/*
 * TASCO Growth Platform — design tokens (v3, TASCO Insurance brand re-skin, after baohiemtasco.vn).
 * Brand: TASCO navy #213368 (headings, wordmark) and the light brand teal #6CC7C5 (surfaces, bands).
 * Every text/background pairing below meets WCAG 2.2 AA (4.5:1) in both themes.
 *
 * Teal accessibility rule (cited by the UX documents):
 *   - White text on the brand teal #6CC7C5 is only 1.98:1 and fails AA. #6CC7C5 is therefore used for
 *     large surfaces only (utility strip, bands, footer, selected states, focus halo) and always carries
 *     NAVY text: #213368 on #6CC7C5 = 6.11:1.
 *   - Filled primary buttons with white text use the "action teal" #0F8482: the lightest teal on the
 *     brand hue (178.7°) that reaches 4.5:1 against white (#0F8482 on #FFFFFF = 4.52:1). Hover #0B6B66.
 *   - Teal text and links use #0B6B66 (6.35:1 on white, 5.87:1 on the #F5F6F8 page background).
 *   - Dark theme: buttons invert to light teal #6CC7C5 with deep-navy text (#0E1A3D on #6CC7C5 = 8.5:1).
 *
 * Typeface pairing: Lexend (wide, geometric — the TASCO website face) for headings, navigation, buttons,
 * KPI values, the customer app and the login page (--font-brand). Inter stays for dense data: table
 * cells, form input text and small meta text (--font), because Lexend is too wide for dense tables.
 *
 * Token families
 *   colour   --bg, --surface(-2/-3), --border(-strong), --text(-muted/-subtle), --primary(-hover/-soft/-contrast),
 *            --accent, --link, semantic --ok/--warn/--danger/--info (+ -bg, -border), --chart-1…6
 *   type     --font (Inter, data), --font-brand (Lexend, brand), --mono, --fs-11…--fs-30, --fw-*, --lh-*
 *   space    --sp-1 (4px) … --sp-8 (64px) — 4-pt scale
 *   shape    --radius-sm 6, --radius 8 (inputs, buttons), --radius-lg/--radius-card 12 (console cards), --radius-xl 16
 *            (customer app and login cards), --radius-pill
 *   depth    --shadow-xs/-sm/-md/-lg, --z-*
 *   motion   --dur-fast/-base/-slow, --ease, --motion
 * Legacy names (--fs-sm, --shadow-1, --radius-lg 16 …) remain as aliases so existing pages keep working.
 */

/* Inter — self-hosted (SIL OFL 1.1, see /fonts/LICENSE-Inter.txt). Latin, Latin-ext and Vietnamese subsets. */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/inter-vietnamese-400-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/inter-vietnamese-500-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/inter-vietnamese-600-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/inter-vietnamese-700-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/inter-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/inter-latin-ext-500-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/inter-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/inter-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/inter-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/inter-latin-500-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/inter-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/inter-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

/* Lexend 5.3 (@fontsource/lexend) — self-hosted (SIL OFL 1.1, see /fonts/LICENSE-Lexend.txt). Latin, Latin-ext and Vietnamese subsets, 300–700. */
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 300; font-display: swap; src: url("/fonts/lexend-vietnamese-300-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/lexend-vietnamese-400-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/lexend-vietnamese-500-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/lexend-vietnamese-600-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/lexend-vietnamese-700-normal.woff2") format("woff2"); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 300; font-display: swap; src: url("/fonts/lexend-latin-ext-300-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/lexend-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/lexend-latin-ext-500-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/lexend-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/lexend-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 300; font-display: swap; src: url("/fonts/lexend-latin-300-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/lexend-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/lexend-latin-500-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/lexend-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Lexend"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/lexend-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root {
  color-scheme: light;
  /* Brand — see the teal accessibility rule in the header comment */
  --brand-navy: #213368;
  --brand-navy-700: #1a2853;
  --brand-navy-900: #0e1a3d;
  --brand-navy-600: #2c4386;
  --brand-navy-50: #eef1f8;
  --brand-teal: #6cc7c5;          /* light brand teal: surfaces only, navy text on it (6.11:1) */
  --brand-teal-action: #0f8482;   /* filled buttons with white text (4.52:1) */
  --brand-teal-action-hover: #0b6b66;
  --brand-teal-ink: #0b6b66;      /* teal text and links (6.35:1 on white) */
  --brand-teal-50: #e9f7f6;
  --brand-teal-100: #d5efee;
  --brand-teal-tint: rgba(108, 199, 197, 0.18); /* active nav item */
  --brand-grad: linear-gradient(120deg, #1a2853 0%, #213368 42%, #1c5a78 72%, #2a8f97 100%);
  --heading: var(--brand-navy);

  /* Neutrals (cool grey) */
  --gray-25: #fcfcfd; --gray-50: #f8f9fb; --gray-100: #f2f4f7; --gray-200: #e4e7ec; --gray-300: #d0d5dd;
  --gray-400: #98a2b3; --gray-500: #667085; --gray-600: #475467; --gray-700: #344054; --gray-800: #1d2939; --gray-900: #101828;

  /* Surfaces & text */
  --bg: #f5f6f8;
  --surface: #ffffff;
  --surface-2: #f8f9fb;   /* table headers, subtle panels */
  --surface-3: #f2f4f7;   /* hover, wells */
  --surface-sunken: #eef0f4;
  --border: #e4e7ec;
  --border-strong: #d0d5dd;
  --border-input: #8a94a6;  /* form-field boundaries: 3.06:1 on white (WCAG 1.4.11) */
  --text: #101828;
  --text-muted: #475467;
  --text-subtle: #667085;
  --text-on-brand: #ffffff;

  /* Interactive */
  --primary: var(--brand-teal-action);
  --primary-hover: var(--brand-teal-action-hover);
  --primary-soft: var(--brand-teal-50);
  --primary-soft-text: var(--brand-navy);
  --primary-contrast: #ffffff;
  --secondary-fg: var(--brand-navy);
  --secondary-border: var(--brand-navy);
  --accent: var(--brand-teal-ink);
  --accent-soft: var(--brand-teal-50);
  --link: var(--brand-teal-ink);
  --nav-active-bg: var(--brand-teal-tint);
  --nav-active-fg: var(--brand-navy);
  --strip-bg: var(--brand-teal);
  --strip-fg: var(--brand-navy);
  --focus: #0f8482;
  --focus-ring: 0 0 0 3px rgba(108, 199, 197, 0.65), 0 0 0 1px #0f8482;
  --overlay: rgba(14, 26, 61, 0.5);
  --tooltip-bg: #101828; --tooltip-fg: #ffffff;

  /* Semantic (text / background / border) */
  --ok: #067647;      --ok-bg: #ecfdf3;     --ok-border: #abefc6;
  --warn: #93370d;    --warn-bg: #fffaeb;   --warn-border: #fedf89;
  --danger: #b42318;  --danger-bg: #fef3f2; --danger-border: #fecdca;
  --info: #1d4ed8;    --info-bg: #eff4ff;   --info-border: #c7d7fe;
  --neutral: #344054; --neutral-bg: #f2f4f7; --neutral-border: #e4e7ec;
  --hot: #b42318; --warm: #93370d; --nurture: #475467;

  /* Charts — brand palette: navy, action teal, light teal, grey, then semantic amber and rose */
  --chart-1: #213368; --chart-2: #0f8482; --chart-3: #6cc7c5; --chart-4: #667085; --chart-5: #dc6803; --chart-6: #c01048;
  --chart-grid: #e4e7ec;

  /* Shell */
  --sidebar-bg: #ffffff;
  --sidebar-w: 256px;
  --strip-h: 36px;
  --sidebar-w-collapsed: 68px;
  --topbar-h: 64px;

  /* Typography */
  --font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-brand: "Lexend", "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --fs-11: 0.6875rem; --fs-12: 0.75rem; --fs-13: 0.8125rem; --fs-14: 0.875rem; --fs-16: 1rem; --fs-20: 1.25rem; --fs-24: 1.5rem; --fs-30: 1.875rem;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
  --lh-tight: 1.25; --lh: 1.5;
  /* legacy aliases */
  --fs-xs: var(--fs-12); --fs-sm: var(--fs-13); --fs-md: var(--fs-14); --fs-lg: var(--fs-16); --fs-xl: var(--fs-20); --fs-2xl: var(--fs-24);

  /* Spacing — 4-pt */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;
  --gutter: 24px;

  /* Shape */
  --radius-sm: 6px; --radius: 8px; --radius-lg: 12px; --radius-xl: 16px; --radius-pill: 999px;
  --radius-card: 12px;       /* console cards */
  --radius-card-lg: 16px;    /* customer app and login cards */

  /* Depth */
  --shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.06);
  --shadow-sm: 0 1px 3px rgba(16, 24, 40, 0.08), 0 1px 2px rgba(16, 24, 40, 0.04);
  --shadow-md: 0 4px 8px -2px rgba(16, 24, 40, 0.08), 0 2px 4px -2px rgba(16, 24, 40, 0.04);
  --shadow-lg: 0 12px 16px -4px rgba(16, 24, 40, 0.08), 0 4px 6px -2px rgba(16, 24, 40, 0.03);
  --shadow-xl: 0 20px 24px -4px rgba(16, 24, 40, 0.1), 0 8px 8px -4px rgba(16, 24, 40, 0.04);
  --shadow-raised: 0 8px 24px rgba(33, 51, 104, 0.08); /* raised brand cards (login, quote form) */
  --shadow-1: var(--shadow-xs); --shadow-2: var(--shadow-lg);

  /* Layers */
  --z-sticky: 20; --z-sidebar: 30; --z-topbar: 35; --z-dropdown: 50; --z-drawer: 60; --z-modal: 70; --z-toast: 80; --z-tooltip: 90;

  /* Motion */
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --dur-fast: 120ms; --dur-base: 180ms; --dur-slow: 260ms;
  --motion: var(--dur-base) var(--ease);

  /* Controls */
  --control-h: 44px;        /* console inputs and buttons */
  --control-h-lg: 52px;     /* customer app and login */
  --control-h-sm: 32px;
  --tap: 44px; /* minimum touch target (customer app) */
}

/* Dark theme — applied for the system preference unless the viewer forced light, or when forced dark. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0b1430; --surface: #111d3f; --surface-2: #15234a; --surface-3: #1b2b57; --surface-sunken: #0d1838;
    --border: #26386b; --border-strong: #34497f; --border-input: #6a7fb3;
    --text: #e8ecf4; --text-muted: #aeb9d0; --text-subtle: #8f9cb8; --text-on-brand: #ffffff; --heading: #eef1f8;
    --primary: #6cc7c5; --primary-hover: #8ad5d3; --primary-soft: #16364a; --primary-soft-text: #c9f0ee; --primary-contrast: #0e1a3d;
    --secondary-fg: #e8ecf4; --secondary-border: #6cc7c5;
    --accent: #7fdcd8; --accent-soft: #10302f; --link: #7fdcd8;
    --nav-active-bg: rgba(108, 199, 197, 0.16); --nav-active-fg: #ffffff;
    --strip-bg: #6cc7c5; --strip-fg: #0e1a3d;
    --focus: #8ad5d3; --focus-ring: 0 0 0 3px rgba(108, 199, 197, 0.55); --overlay: rgba(2, 6, 16, 0.66); --tooltip-bg: #f2f4f7; --tooltip-fg: #101828;
    --ok: #6ce9a6; --ok-bg: #0d2a1e; --ok-border: #145c3b;
    --warn: #fec84b; --warn-bg: #2e2109; --warn-border: #6b4a0b;
    --danger: #fda29b; --danger-bg: #351513; --danger-border: #7a271a;
    --info: #a4bcfd; --info-bg: #142145; --info-border: #2d4383;
    --neutral: #cfd6e4; --neutral-bg: #1b2b57; --neutral-border: #2b3858;
    --hot: #fda29b; --warm: #fec84b; --nurture: #aeb9d0;
    --chart-1: #9db0f0; --chart-2: #6cc7c5; --chart-3: #b4e6e4; --chart-4: #98a2b3; --chart-5: #fdb022; --chart-6: #f670a7; --chart-grid: #26386b;
    --sidebar-bg: #0e1838;
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4); --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.45);
    --shadow-md: 0 4px 10px rgba(0, 0, 0, 0.45); --shadow-lg: 0 12px 24px rgba(0, 0, 0, 0.5); --shadow-xl: 0 20px 32px rgba(0, 0, 0, 0.55);
    --shadow-raised: 0 8px 24px rgba(0, 0, 0, 0.4);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b1430; --surface: #111d3f; --surface-2: #15234a; --surface-3: #1b2b57; --surface-sunken: #0d1838;
  --border: #26386b; --border-strong: #34497f; --border-input: #6a7fb3;
  --text: #e8ecf4; --text-muted: #aeb9d0; --text-subtle: #8f9cb8; --text-on-brand: #ffffff; --heading: #eef1f8;
  --primary: #6cc7c5; --primary-hover: #8ad5d3; --primary-soft: #16364a; --primary-soft-text: #c9f0ee; --primary-contrast: #0e1a3d;
  --secondary-fg: #e8ecf4; --secondary-border: #6cc7c5;
  --accent: #7fdcd8; --accent-soft: #10302f; --link: #7fdcd8;
  --nav-active-bg: rgba(108, 199, 197, 0.16); --nav-active-fg: #ffffff;
  --strip-bg: #6cc7c5; --strip-fg: #0e1a3d;
  --focus: #8ad5d3; --focus-ring: 0 0 0 3px rgba(108, 199, 197, 0.55); --overlay: rgba(2, 6, 16, 0.66); --tooltip-bg: #f2f4f7; --tooltip-fg: #101828;
  --ok: #6ce9a6; --ok-bg: #0d2a1e; --ok-border: #145c3b;
  --warn: #fec84b; --warn-bg: #2e2109; --warn-border: #6b4a0b;
  --danger: #fda29b; --danger-bg: #351513; --danger-border: #7a271a;
  --info: #a4bcfd; --info-bg: #142145; --info-border: #2d4383;
  --neutral: #cfd6e4; --neutral-bg: #1b2b57; --neutral-border: #2b3858;
  --hot: #fda29b; --warm: #fec84b; --nurture: #aeb9d0;
  --chart-1: #9db0f0; --chart-2: #6cc7c5; --chart-3: #b4e6e4; --chart-4: #98a2b3; --chart-5: #fdb022; --chart-6: #f670a7; --chart-grid: #26386b;
  --sidebar-bg: #0e1838;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4); --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 4px 10px rgba(0, 0, 0, 0.45); --shadow-lg: 0 12px 24px rgba(0, 0, 0, 0.5); --shadow-xl: 0 20px 32px rgba(0, 0, 0, 0.55);
  --shadow-raised: 0 8px 24px rgba(0, 0, 0, 0.4);
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-base: 0ms; --dur-slow: 0ms; --motion: 0ms linear; }
}