:root {
  color-scheme: light;
  --surface-card: var(--white);
  --background-brand: radial-gradient(900px 500px at 12% 8%, var(--brand-glow), transparent 60%), linear-gradient( 160deg, var(--surface-dark), var(--global-color-jade-dark) 92%);
  --background-brand-mark: linear-gradient( 140deg, var(--global-color-jade-light), var(--global-color-jade-pale));
  /* Healthcare tokens for shared components and page styles. */
  --default-palette: navy;
  --global-color-jade: #0c1b53;
  --global-color-ink: #141c22;
  --global-color-muted: #63716c;
  --surface-paper: #f4f6f5;
  --surface-dark: #101720;
  --global-color-jade-dark: #0c1b53;
  --text-on-dark: #eaf3f0;
  --text-on-dark-muted: #a8c7be;
  --global-color-jade-light: #527fe0;
  --global-color-jade-pale: #a6c5ff;
  --text-on-dark-soft: #b8d7cd;
  --text-on-dark-faint: #8fb1a8;
  --border-card: #e0e7e3;
  --shadow-jade: color-mix(in srgb, var(--global-color-jade-dark) 20%, transparent);
  --text-label: #34483f;
  --border-control: #dce4df;
  --surface-selected: #e1f1ec;
  --surface-control: #fbfcfb;
  --text-placeholder: #89948e;
  --global-color-jade-hover: color-mix(in srgb, var(--global-color-jade) 78%, var(--black));
  --border-subtle: #e8edea;
  --border-error: #f0d0cb;
  --surface-error: #fae7e4;
  --text-error: #9c332b;
  --text-faint: #74827b;

  --brand-glow: color-mix(in srgb, var(--global-color-jade-light) 30%, transparent);

  --lh-ui: 1.5;
  --lh-copy: 1.7;
  --lh-display: 1.15;
  --lh-title: 1.25;

  --fw-650: 650;

  /* Reusable form spacing. */
  --space-4: 4px;
  --space-8: 8px;
  --space-9: 9px;
  --space-10: 10px;
  --space-12: 12px;
  --space-14: 14px;
  --space-18: 18px;
  --space-20: 20px;
  --space-22: 22px;
  --space-24: 24px;
  --control-reveal-width: 68px;
  --control-reveal-height: 33px;
  --control-height: 49px;
  --focus-width: 3px;
  --shadow-card: 0 16px 55px -24px var(--shadow-jade);

  --white: #ffffff;
  --black: #000000;
  --global-color-primary: var(--global-color-jade-dark);
  --global-color-secondary: var(--surface-paper);
  --global-color-accent: var(--global-color-jade);
  --global-color-light-accent: #1e84b5;
  --global-color-lightest-accent: #a6d8ef;
  --global-color-text: var(--global-color-muted);
  --global-color-divider: #ffffff1f;
  --global-color-darkdivider: #0e384c1a;
  --global-color-yellow: #ffa800;

  --surface-muted: #e8f0f3;
  --border: #dfe8ee;
  --border-light: #edf1f4;
  --success-background: #e8f4f2;
  --success-text: #176454;
  --input-border: #cbd8e0;
  --error: #a52828;
  --shadow-soft: rgba(14, 56, 76, 0.03);

  --background-linear: linear-gradient(180deg,var(--global-color-secondary) 100%,var(--white) 30%);
  --background-linear-secondary: linear-gradient(180deg,color-mix(in srgb, var(--global-color-secondary) 90%, transparent),color-mix(in srgb, var(--surface-card) 75%, transparent) 30%,color-mix(in srgb, var(--global-color-secondary) 90%, transparent) 70%);
  --background-card-dark-linear: linear-gradient(145deg,color-mix(in srgb, var(--white) 8%, transparent),color-mix(in srgb, var(--white) 2%, transparent));
  --background-internalCard-dark-linear: linear-gradient(135deg,color-mix(in srgb, var(--global-color-accent) 80%, transparent),color-mix(in srgb, var(--global-color-primary) 95%, transparent));
  --background-linear-gray: linear-gradient(90deg,var(--border-control),var(--surface-card),var(--border-control));

  --box-shadow: rgba(14, 56, 76, 0.1) 0px 0px 40px 0px;
  --box-shadow-gray: 0 4px 16px rgba(0, 0, 0, 0.08);
  --box-shadow-pills: 0 0px 17px rgba(30, 132, 181, 0.35);
  --box-shadow-hero-card: 0px 0px 40px 0px rgba(0, 0, 0, 0.12941176470588237);
  --box-shadow-dark-card: 0 8px 25px rgba(0, 0, 0, 0.25);
  --box-shadow-dark-card-hover: 0 14px 35px rgba(0, 0, 0, 0.35);
  --box-shadow-service-card: 0px 4px 40px 0px rgba(0, 0, 0, 0.058823529411764705);

  --common-line-height: 1.6em;
  --heading-line-height: 1.2em;
  --text-line-height: 1.8em;

  --font-family: "Poppins", "Segoe UI", Arial, sans-serif;

  --fs-54: 54px;
  --fs-48: 48px;
  --fs-44: 44px;
  --fs-36: 36px;
  --fs-34: 34px;
  --fs-30: 30px;
  --fs-28: 28px;
  --fs-26: 26px;
  --fs-25: 25px;
  --fs-24: 24px;
  --fs-22: 22px;
  --fs-20: 20px;
  --fs-18: 18px;
  --fs-16: 16px;
  --fs-15: 15px;
  --fs-14: 14px;
  --fs-13: 13px;
  --fs-12: 12px;
  --fs-11: 11px;
  --fs-10: 10px;
  --fs-9: 9px;

  --fs-14-5: 14.5px;
  --fs-13-3: 13.3px;
  --fs-12-5: 12.5px;
  --fs-11-5: 11.5px;
  --fs-10-5: 10.5px;

  --fw-400: 400;
  --fw-500: 500;
  --fw-600: 600;
  --fw-700: 700;

  --br-4: 4px;
  --br-6: 6px;
  --br-8: 8px;
  --br-9: 9px;
  --br-10: 10px;
  --br-12: 12px;
  --br-14: 14px;
  --br-15: 15px;
  --br-18: 18px;
  --br-22: 22px;
  --br-26: 26px;
  --br-40: 40px;
  --br-round: 50%;

  --lh-0: 0;
  --lh-lg: 1.8em;
  --lh-md: 1.6em;
  --lh-sm: 1.2em;
}

/* Theme overrides change semantic surfaces; brand colors remain shared. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --surface-paper: #0d1319;
  --surface-card: #151d25;
  --surface-control: #18232b;
  --global-color-ink: #e8edf1;
  --global-color-muted: #a2b1ba;
  --text-label: #d2e1da;
  --text-placeholder: #899eaa;
  --text-faint: #9aada5;
  --border-card: #2a383d;
  --border-control: #3a4b50;
  --border-subtle: #29383b;
  --surface-selected: #193b31;
  --surface-muted: #1c2c33;
  --border: var(--border-card);
  --border-light: var(--border-subtle);
  --input-border: var(--border-control);
  --surface-error: #3b2426;
  --border-error: #70403f;
  --text-error: #ffb5aa;
  --error: var(--text-error);
  --success-background: var(--surface-selected);
  --success-text: #8edcbb;
}
body {
  background: var(--surface-paper);
}

/* Client palette previews: shared colors drive page surfaces and gradients. */
:root {
  --palette-green: #12715c;
  --palette-navy: #0c1b53;
  --palette-ocean-blue: #0c1b53;
  --palette-ocean-green: #12715c;
  --palette-teal: #0b727c;
}
:root[data-palette="green"] { --global-color-jade: var(--palette-green); --global-color-jade-dark: #0a3b31; --global-color-jade-light: #1b9a7d; --global-color-jade-pale: #7fd9be; }
:root[data-palette="navy"] {
  --global-color-jade: var(--palette-navy);
  --global-color-jade-dark: var(--palette-navy);
  --global-color-jade-light: #527fe0;
  --global-color-jade-pale: #a6c5ff;
}
:root[data-palette="ocean"] {
  --global-color-jade: var(--palette-ocean-green);
  --global-color-jade-dark: var(--palette-ocean-blue);
  --global-color-jade-light: #27a590;
  --global-color-jade-pale: #8de0ce;
  --background-brand:radial-gradient(900px 500px at 12% 8%, var(--brand-glow), transparent 60%),linear-gradient(  155deg,  var(--palette-ocean-blue),  var(--palette-ocean-green) 100%);
  --background-brand-mark: linear-gradient(140deg,var(--palette-ocean-blue),var(--global-color-jade-pale));
}
:root[data-palette="teal"] {
  --global-color-jade: var(--palette-teal);
  --global-color-jade-dark: #083e49;
  --global-color-jade-light: #229aa6;
  --global-color-jade-pale: #8adce2;
}
:root[data-palette] {
  --surface-paper: color-mix(in srgb,var(--global-color-jade) 4%,var(--white));
  --surface-control: color-mix(in srgb,var(--global-color-jade) 1%,var(--white));
  --surface-selected: color-mix(in srgb,var(--global-color-jade) 12%,var(--white));
  --border-card: color-mix(in srgb, var(--global-color-jade) 13%, var(--white));
  --border-control: color-mix(in srgb,var(--global-color-jade) 19%,var(--white));
  --border-subtle: color-mix(in srgb,var(--global-color-jade) 9%,var(--white));
  --text-label: color-mix(in srgb,var(--global-color-jade) 45%,var(--global-color-ink));
  --text-on-dark: color-mix(in srgb,var(--global-color-jade-pale) 12%,var(--white));
  --text-on-dark-muted: color-mix(in srgb,var(--global-color-jade-pale) 65%,var(--white));
  --text-on-dark-soft: color-mix(in srgb,var(--global-color-jade-pale) 45%,var(--white));
  --text-on-dark-faint: color-mix(in srgb,var(--global-color-jade-pale) 75%,var(--white));
}
:root[data-palette][data-theme="dark"] {
  --surface-paper: color-mix(in srgb,var(--global-color-jade-dark) 24%,#0d1319);
  --surface-card: color-mix(in srgb,var(--global-color-jade-dark) 16%,#151d25);
  --surface-control: color-mix(in srgb,var(--global-color-jade-dark) 20%,#18232b);
  --surface-selected: color-mix(in srgb,var(--global-color-jade) 24%,var(--surface-card));
  --border-card: color-mix(in srgb,var(--global-color-jade-pale) 15%,var(--surface-card));
  --border-control: color-mix(in srgb,var(--global-color-jade-pale) 27%,var(--surface-card));
  --border-subtle: color-mix(in srgb,var(--global-color-jade-pale) 12%,var(--surface-card));
  --text-label: var(--global-color-ink);
}

/* Reference template semantic aliases: shared by every admin module. */
:root {
  --jade-900: var(--global-color-jade-dark);
  --jade-700: var(--global-color-jade);
  --jade-500: var(--global-color-jade-light);
  --jade-100: var(--surface-selected);
  --slate-900: var(--surface-dark);
  --slate-800: var(--surface-dark);
  --slate-700: var(--text-label);
  --slate-500: var(--global-color-muted);
  --paper: var(--surface-paper);
  --card: var(--surface-card);
  --line: var(--border-card);
  --ink: var(--global-color-ink);
  --ink-soft: var(--global-color-muted);
  --ink-faint: var(--text-placeholder);
  --r-sm: var(--br-8);
  --r: var(--br-12);
  --r-lg: var(--br-18);
  --r-xl: var(--br-26);
  --sh-1: var(--shadow-soft);
  --sh-2: var(--box-shadow-gray);
  --sh-3: var(--shadow-card);
  
  --rail: 252px;
  --tele: #3a63cf;
  --tele-tint: #e7edfb;
  --amber: #b9781a;
  --amber-tint: #fbf0de;
  --rose: #b3392f;
  --rose-tint: #fae7e4;
  --violet: #6b4fbb;
  --violet-tint: #efebfa;
  --reference-color-1: #c6d0db;
  --reference-color-2: #7e8c9b;
  --reference-color-3: #5c6b7a;
  --reference-color-4: #bcc7d3;
  --reference-color-5: #e8eeec;
  --reference-color-6: #dce6e3;
  --reference-color-7: #bee3d6;
  --reference-color-8: #6fc5a9;
  --reference-color-9: #1e2c38;
  --reference-color-10: #0e1a15;
  --reference-color-11: #22303c;
  --reference-color-12: #8fa3b2;
  --reference-color-13: #dce6ec;
  --reference-color-14: #9fe3cc;
  --reference-color-15: #43d6a8;
  --reference-color-16: rgba(255, 255, 255, 0.055);
  --reference-color-17: rgba(255, 255, 255, 0.07);
  --reference-color-18: rgba(18, 113, 92, 0.35);
  --reference-color-19: rgba(255, 255, 255, 0.08);
  --reference-color-20: rgba(0, 0, 0, 0.28);
  --reference-color-21: rgba(0, 0, 0, 0.3);
  --reference-color-22: rgba(255, 255, 255, 0.14);
  --reference-color-23: rgba(255, 255, 255, 0.16);
  --reference-color-24: rgba(8, 14, 18, 0.45);
  --reference-color-25: #e6eff3;
  --reference-color-26: rgba(255, 255, 255, 0.1);
  --reference-color-27: rgba(120, 140, 150, 0.32);
  --reference-color-28: rgba(27, 154, 125, 0.1);
  --background-reference-1: linear-gradient(90deg,var(--jade-700),var(--reference-color-18));
  --background-reference-2: linear-gradient(160deg,var(--reference-color-5),var(--reference-color-6));
  --background-reference-3: linear-gradient(150deg,var(--reference-color-9),var(--reference-color-10));
}
:root[data-theme="dark"] {
  --tele: #7b9bf0;
  --tele-tint: #1a2440;
  --amber: #e0a44b;
  --amber-tint: #2e2416;
  --rose: #e0776b;
  --rose-tint: #331b18;
  --violet: #a28ee8;
  --violet-tint: #231d3b;
}

/* Reusable theme controls, matching the app design. */
.ui-theme-toggle { position: fixed; top: var(--space-12); right: var(--space-12); z-index: 100; display: grid; place-items: center; width: 40px; height: 40px; padding: var(--space-8); border: 1px solid var(--border-control); border-radius: var(--br-10); background: var(--surface-card); color: var(--global-color-ink); cursor: pointer; }
.ui-theme-toggle:focus-visible { outline: var(--focus-width) solid var(--global-color-jade-light); outline-offset: var(--focus-width); }

.ui-theme-toggle svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ui-theme-toggle:hover { background: var(--surface-selected); color: var(--global-color-jade-light); }
.ui-theme-sun { display: none; }
:root[data-theme="dark"] .ui-theme-moon { display: none; }
:root[data-theme="dark"] .ui-theme-sun { display: block; }


.ui-palette-preview { position: fixed; right: 64px; top: var(--space-12); z-index: 101; border: 1px solid var(--border-control); border-radius: var(--br-10); background: var(--surface-card); color: var(--global-color-ink); font-size: var(--fs-12); box-shadow: var(--shadow-card); }
.ui-palette-preview summary { padding: var(--space-10) var(--space-12); cursor: pointer; }
.ui-palette-options { display: flex; flex-direction: column; gap: var(--space-8); padding: var(--space-8); min-width: 180px; }
.ui-palette-options button { display: flex; align-items: center; gap: var(--space-10); padding: var(--space-8); background: var(--surface-control); color: var(--global-color-ink); border: 1px solid var(--border-control); border-radius: var(--br-8); font: inherit; cursor: pointer; text-align: left; }
.ui-palette-options button[aria-pressed="true"] { background: var(--surface-selected); border-color: var(--global-color-jade-light); }
.ui-palette-options button:focus-visible, .ui-palette-preview summary:focus-visible { outline: var(--focus-width) solid var(--global-color-jade-light); outline-offset: 2px; }
.ui-swatch { width: 18px; height: 18px; border-radius: var(--br-round); flex: none; }
.ui-swatch-green { background: var(--palette-green); }
.ui-swatch-navy { background: var(--palette-navy); }
.ui-swatch-ocean { background: linear-gradient(135deg, var(--palette-ocean-blue), var(--palette-ocean-green)); }
.ui-swatch-teal { background: var(--palette-teal); }

.ui-palette-preview > summary { display: grid; place-items: center; width: 40px; height: 40px; padding: var(--space-8); list-style: none; border-radius: var(--br-10); }
.ui-palette-preview > summary::-webkit-details-marker { display: none; }
.ui-palette-preview > summary svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ui-palette-preview > summary:hover { background: var(--surface-selected); color: var(--global-color-jade-light); }
.ui-palette-preview[open] .ui-palette-options { position: absolute; right: 0; top: calc(100% + var(--space-8)); background: var(--surface-card); border: 1px solid var(--border-control); border-radius: var(--br-10); box-shadow: var(--shadow-card); }
.care-theme-controls { display: inline-flex; align-items: center; gap: 12px; }
.care-theme-controls .ui-theme-toggle, .care-theme-controls .ui-palette-preview { position: relative; top: auto; right: auto; flex: none; margin: 0; }

/* Native details fallback; JS positions the open menu within the viewport. */
.ui-palette-preview[data-open-direction="left"][open] .ui-palette-options{top:0;right:calc(100% + var(--space-8));left:auto}
.ui-palette-preview[data-open-direction="right"][open] .ui-palette-options{top:0;left:calc(100% + var(--space-8));right:auto}
.ui-palette-preview[data-open-direction="top"][open] .ui-palette-options{top:auto;bottom:calc(100% + var(--space-8));left:0;right:auto}
.ui-palette-preview[data-open-direction="bottom"][open] .ui-palette-options{top:calc(100% + var(--space-8));left:0;right:auto}
.ui-palette-preview[open] .ui-palette-options[data-positioned]{position:fixed;left:var(--menu-left);top:var(--menu-top);right:auto;bottom:auto;min-width:0;width:max-content;max-width:calc(100vw - 16px);max-height:var(--menu-max-height);overflow:auto;box-sizing:border-box;z-index:102}
/* Before JS positions auto menus, align with the trigger's left edge. */
.ui-palette-preview[data-open-direction="auto"][open] .ui-palette-options:not([data-positioned]) { left: 0; right: auto; }




/*:root {
  color-scheme: light;
  --surface-card: var(--white);
  --background-brand: radial-gradient(900px 500px at 12% 8%, var(--brand-glow), transparent 60%), linear-gradient( 160deg, var(--surface-dark), var(--global-color-jade-dark) 92%);
  --background-brand-mark: linear-gradient( 140deg, var(--global-color-jade-light), var(--global-color-jade-pale));
  --default-palette: navy;
  --global-color-jade: #0c1b53;
  --global-color-ink: #141c22;
  --global-color-muted: #63716c;
  --surface-paper: #f4f6f5;
  --surface-dark: #101720;
  --global-color-jade-dark: #0c1b53;
  --text-on-dark: #eaf3f0;
  --text-on-dark-muted: #a8c7be;
  --global-color-jade-light: #527fe0;
  --global-color-jade-pale: #a6c5ff;
  --text-on-dark-soft: #b8d7cd;
  --text-on-dark-faint: #8fb1a8;
  --border-card: #e0e7e3;
  --shadow-jade: color-mix(in srgb, var(--global-color-jade-dark) 20%, transparent);
  --text-label: #34483f;
  --border-control: #dce4df;
  --surface-selected: #e1f1ec;
  --surface-control: #fbfcfb;
  --text-placeholder: #89948e;
  --global-color-jade-hover: color-mix(in srgb, var(--global-color-jade) 78%, var(--black));
  --border-subtle: #e8edea;
  --border-error: #f0d0cb;
  --surface-error: #fae7e4;
  --text-error: #9c332b;
  --text-faint: #74827b;

  --brand-glow: color-mix(in srgb, var(--global-color-jade-light) 30%, transparent);

  --lh-ui: 1.5;
  --lh-copy: 1.7;
  --lh-display: 1.15;
  --lh-title: 1.25;

  --fw-650: 650;

 
  --space-8: 8px;
  --space-9: 9px;
  --space-10: 10px;
  --space-12: 12px;
  --space-14: 14px;
  --space-20: 20px;
  --space-22: 22px;
  --space-24: 24px;
  --control-reveal-width: 68px;
  --control-reveal-height: 33px;
  --control-height: 49px;
  --focus-width: 3px;
  --shadow-card: 0 16px 55px -24px var(--shadow-jade);

  --white: #ffffff;
  --black: #000000;
  --global-color-primary: var(--global-color-jade-dark);
  --global-color-secondary: var(--surface-paper);
  --global-color-accent: var(--global-color-jade);
  --global-color-light-accent: #1e84b5;
  --global-color-lightest-accent: #a6d8ef;
  --global-color-text: var(--global-color-muted);
  --global-color-divider: #ffffff1f;
  --global-color-darkdivider: #0e384c1a;
  --global-color-yellow: #ffa800;

  --surface-muted: #e8f0f3;
  --border: #dfe8ee;
  --border-light: #edf1f4;
  --success-background: #e8f4f2;
  --success-text: #176454;
  --input-border: #cbd8e0;
  --error: #a52828;
  --shadow-soft: rgba(14, 56, 76, 0.03);

  --background-linear: linear-gradient(180deg,var(--global-color-secondary) 100%,var(--white) 30%);
  --background-linear-secondary: linear-gradient(180deg,color-mix(in srgb, var(--global-color-secondary) 90%, transparent),color-mix(in srgb, var(--surface-card) 75%, transparent) 30%,color-mix(in srgb, var(--global-color-secondary) 90%, transparent) 70%);
  --background-card-dark-linear: linear-gradient(145deg,color-mix(in srgb, var(--white) 8%, transparent),color-mix(in srgb, var(--white) 2%, transparent));
  --background-internalCard-dark-linear: linear-gradient(135deg,color-mix(in srgb, var(--global-color-accent) 80%, transparent),color-mix(in srgb, var(--global-color-primary) 95%, transparent));
  --background-linear-gray: linear-gradient(90deg,var(--border-control),var(--surface-card),var(--border-control));

  --box-shadow: rgba(14, 56, 76, 0.1) 0px 0px 40px 0px;
  --box-shadow-gray: 0 4px 16px rgba(0, 0, 0, 0.08);
  --box-shadow-pills: 0 0px 17px rgba(30, 132, 181, 0.35);
  --box-shadow-hero-card: 0px 0px 40px 0px rgba(0, 0, 0, 0.12941176470588237);
  --box-shadow-dark-card: 0 8px 25px rgba(0, 0, 0, 0.25);
  --box-shadow-dark-card-hover: 0 14px 35px rgba(0, 0, 0, 0.35);
  --box-shadow-service-card: 0px 4px 40px 0px rgba(0, 0, 0, 0.058823529411764705);

  --common-line-height: 1.6em;
  --heading-line-height: 1.2em;
  --text-line-height: 1.8em;

  --font-family: "Poppins", "Segoe UI", Arial, sans-serif;

  --fs-54: 54px;
  --fs-48: 48px;
  --fs-44: 44px;
  --fs-36: 36px;
  --fs-34: 34px;
  --fs-30: 30px;
  --fs-28: 28px;
  --fs-26: 26px;
  --fs-25: 25px;
  --fs-24: 24px;
  --fs-22: 22px;
  --fs-20: 20px;
  --fs-18: 18px;
  --fs-16: 16px;
  --fs-15: 15px;
  --fs-14: 14px;
  --fs-13: 13px;
  --fs-12: 12px;
  --fs-11: 11px;
  --fs-10: 10px;
  --fs-9: 9px;

  --fs-14-5: 14.5px;
  --fs-13-3: 13.3px;
  --fs-12-5: 12.5px;
  --fs-11-5: 11.5px;
  --fs-10-5: 10.5px;

  --fw-400: 400;
  --fw-500: 500;
  --fw-600: 600;
  --fw-700: 700;

  --br-4: 4px;
  --br-6: 6px;
  --br-8: 8px;
  --br-9: 9px;
  --br-10: 10px;
  --br-12: 12px;
  --br-14: 14px;
  --br-15: 15px;
  --br-18: 18px;
  --br-22: 22px;
  --br-26: 26px;
  --br-40: 40px;
  --br-round: 50%;

  --lh-lg: 1.8em;
  --lh-md: 1.6em;
  --lh-sm: 1.2em;
}


:root[data-theme="dark"] {
  color-scheme: dark;
  --surface-paper: #0d1319;
  --surface-card: #151d25;
  --surface-control: #18232b;
  --global-color-ink: #e8edf1;
  --global-color-muted: #a2b1ba;
  --text-label: #d2e1da;
  --text-placeholder: #899eaa;
  --text-faint: #9aada5;
  --border-card: #2a383d;
  --border-control: #3a4b50;
  --border-subtle: #29383b;
  --surface-selected: #193b31;
  --surface-muted: #1c2c33;
  --border: var(--border-card);
  --border-light: var(--border-subtle);
  --input-border: var(--border-control);
  --surface-error: #3b2426;
  --border-error: #70403f;
  --text-error: #ffb5aa;
  --error: var(--text-error);
  --success-background: var(--surface-selected);
  --success-text: #8edcbb;
}
body {
  background: var(--surface-paper);
}


:root {
  --palette-green: #12715c;
  --palette-navy: #0c1b53;
  --palette-ocean-blue: #0c1b53;
  --palette-ocean-green: #12715c;
  --palette-teal: #0b727c;
}
:root[data-palette="green"] { --global-color-jade: var(--palette-green); --global-color-jade-dark: #0a3b31; --global-color-jade-light: #1b9a7d; --global-color-jade-pale: #7fd9be; }
:root[data-palette="navy"] {
  --global-color-jade: var(--palette-navy);
  --global-color-jade-dark: var(--palette-navy);
  --global-color-jade-light: #527fe0;
  --global-color-jade-pale: #a6c5ff;
}
:root[data-palette="ocean"] {
  --global-color-jade: var(--palette-ocean-green);
  --global-color-jade-dark: var(--palette-ocean-blue);
  --global-color-jade-light: #27a590;
  --global-color-jade-pale: #8de0ce;
  --background-brand:radial-gradient(900px 500px at 12% 8%, var(--brand-glow), transparent 60%),linear-gradient(  155deg,  var(--palette-ocean-blue),  var(--palette-ocean-green) 100%);
  --background-brand-mark: linear-gradient(140deg,var(--palette-ocean-blue),var(--global-color-jade-pale));
}
:root[data-palette="teal"] {
  --global-color-jade: var(--palette-teal);
  --global-color-jade-dark: #083e49;
  --global-color-jade-light: #229aa6;
  --global-color-jade-pale: #8adce2;
}
:root[data-palette] {
  --surface-paper: color-mix(in srgb,var(--global-color-jade) 4%,var(--white));
  --surface-control: color-mix(in srgb,var(--global-color-jade) 1%,var(--white));
  --surface-selected: color-mix(in srgb,var(--global-color-jade) 12%,var(--white));
  --border-card: color-mix(in srgb, var(--global-color-jade) 13%, var(--white));
  --border-control: color-mix(in srgb,var(--global-color-jade) 19%,var(--white));
  --border-subtle: color-mix(in srgb,var(--global-color-jade) 9%,var(--white));
  --text-label: color-mix(in srgb,var(--global-color-jade) 45%,var(--global-color-ink));
  --text-on-dark: color-mix(in srgb,var(--global-color-jade-pale) 12%,var(--white));
  --text-on-dark-muted: color-mix(in srgb,var(--global-color-jade-pale) 65%,var(--white));
  --text-on-dark-soft: color-mix(in srgb,var(--global-color-jade-pale) 45%,var(--white));
  --text-on-dark-faint: color-mix(in srgb,var(--global-color-jade-pale) 75%,var(--white));
}
:root[data-palette][data-theme="dark"] {
  --surface-paper: color-mix(in srgb,var(--global-color-jade-dark) 24%,#0d1319);
  --surface-card: color-mix(in srgb,var(--global-color-jade-dark) 16%,#151d25);
  --surface-control: color-mix(in srgb,var(--global-color-jade-dark) 20%,#18232b);
  --surface-selected: color-mix(in srgb,var(--global-color-jade) 24%,var(--surface-card));
  --border-card: color-mix(in srgb,var(--global-color-jade-pale) 15%,var(--surface-card));
  --border-control: color-mix(in srgb,var(--global-color-jade-pale) 27%,var(--surface-card));
  --border-subtle: color-mix(in srgb,var(--global-color-jade-pale) 12%,var(--surface-card));
  --text-label: var(--global-color-ink);
}


:root {
  --jade-900: var(--global-color-jade-dark);
  --jade-700: var(--global-color-jade);
  --jade-500: var(--global-color-jade-light);
  --jade-100: var(--surface-selected);
  --slate-900: var(--surface-dark);
  --slate-800: var(--surface-dark);
  --slate-700: var(--text-label);
  --slate-500: var(--global-color-muted);
  --paper: var(--surface-paper);
  --card: var(--surface-card);
  --line: var(--border-card);
  --ink: var(--global-color-ink);
  --ink-soft: var(--global-color-muted);
  --ink-faint: var(--text-placeholder);
  --r-sm: var(--br-8);
  --r: var(--br-12);
  --r-lg: var(--br-18);
  --r-xl: var(--br-26);
  --sh-1: var(--shadow-soft);
  --sh-2: var(--box-shadow-gray);
  --sh-3: var(--shadow-card);
  
  --rail: 252px;
  --tele: #3a63cf;
  --tele-tint: #e7edfb;
  --amber: #b9781a;
  --amber-tint: #fbf0de;
  --rose: #b3392f;
  --rose-tint: #fae7e4;
  --violet: #6b4fbb;
  --violet-tint: #efebfa;
  --reference-color-1: #c6d0db;
  --reference-color-2: #7e8c9b;
  --reference-color-3: #5c6b7a;
  --reference-color-4: #bcc7d3;
  --reference-color-5: #e8eeec;
  --reference-color-6: #dce6e3;
  --reference-color-7: #bee3d6;
  --reference-color-8: #6fc5a9;
  --reference-color-9: #1e2c38;
  --reference-color-10: #0e1a15;
  --reference-color-11: #22303c;
  --reference-color-12: #8fa3b2;
  --reference-color-13: #dce6ec;
  --reference-color-14: #9fe3cc;
  --reference-color-15: #43d6a8;
  --reference-color-16: rgba(255, 255, 255, 0.055);
  --reference-color-17: rgba(255, 255, 255, 0.07);
  --reference-color-18: rgba(18, 113, 92, 0.35);
  --reference-color-19: rgba(255, 255, 255, 0.08);
  --reference-color-20: rgba(0, 0, 0, 0.28);
  --reference-color-21: rgba(0, 0, 0, 0.3);
  --reference-color-22: rgba(255, 255, 255, 0.14);
  --reference-color-23: rgba(255, 255, 255, 0.16);
  --reference-color-24: rgba(8, 14, 18, 0.45);
  --reference-color-25: #e6eff3;
  --reference-color-26: rgba(255, 255, 255, 0.1);
  --reference-color-27: rgba(120, 140, 150, 0.32);
  --reference-color-28: rgba(27, 154, 125, 0.1);
  --background-reference-1: linear-gradient(90deg,var(--jade-700),var(--reference-color-18));
  --background-reference-2: linear-gradient(160deg,var(--reference-color-5),var(--reference-color-6));
  --background-reference-3: linear-gradient(150deg,var(--reference-color-9),var(--reference-color-10));
}
:root[data-theme="dark"] {
  --tele: #7b9bf0;
  --tele-tint: #1a2440;
  --amber: #e0a44b;
  --amber-tint: #2e2416;
  --rose: #e0776b;
  --rose-tint: #331b18;
  --violet: #a28ee8;
  --violet-tint: #231d3b;
} */