/* ============================================================================
   TORAVANE DESIGN TOKENS — GENERATED. DO NOT HAND-EDIT.
   ----------------------------------------------------------------------------
   Source of truth : AIOS/dashboard/design/Design Decisions.json
   Regenerate with : npm run design-tokens
   Verify with     : npm run design-check
   Protocol        : AIOS/dashboard/design/DESIGN.md  (read before writing CSS)
   Direction       : Vantage · dark-first · comfortable · Inter
   Generated       : 2026-07-27

   A hand edit here is exactly the drift design-check exists to catch.
   If a value is wrong, change the decision in the lab and regenerate.
   ============================================================================ */

:root {
  /* --------------------------------------------------------------------------
     CLIENT OVERRIDE — the ONLY line a client install may change.
     White-labelling is limited to accent hue + logo, by product decision.
     Validate a new hue first:  npm run design-check -- --hue=<n>
     -------------------------------------------------------------------------- */
  --brand-hue: 218;

  /* ---- STRUCTURE (identical in both themes — never redeclare per theme) ---- */
  --scrim-blur: blur(2px);
  --bg-grid: none;
  --grid-size: 32px;
  --font-ui: Inter,ui-sans-serif,system-ui,sans-serif;
  --font-head: Inter,ui-sans-serif,system-ui,sans-serif;
  --font-mono: 'JetBrains Mono',ui-monospace,monospace;
  --num-font: inherit;
  --fs-base: 16px;
  --fs-h3: 21.3px;
  --fs-h2: 28.4px;
  --head-weight: 700;
  --head-track: -0.035em;
  --head-case: none;
  --label-case: uppercase;
  --label-track: 0.08em;
  --label-weight: 700;
  --nav-case: none;
  --nav-track: 0;
  --btn-case: none;
  --btn-track: 0;
  --tab-case: none;
  --tab-track: 0;
  --num-variant: tabular-nums;
  --r-sm: 8px;
  --r-md: 10px;
  --r-lg: 12px;
  --r-ctl: 10px;
  --r-badge: 10px;
  --r-avatar: 999px;
  --r-dot: 50%;
  --r-toggle: 999px;
  --clip-lg: none;
  --clip-sm: none;
  --border-w: 1px;
  --rule: 1px;
  --rule-always: 1px;
  --row-h: 36px;
  --ctl-h: 36px;
  --space: 8px;
  --page-pad: 28px;
  --page-max: 880px;
  --page-margin: 0 auto;
  --icon-w: 2;
  --dot-size: 8px;
  --card-border: 1px;
  --dur: 150ms;
  --ease: cubic-bezier(.2,.7,.3,1);
  --head-pad: 16px;
  --head-rule: 0px;
  --tab-gap: 4px;
  --tab-rule: 0px;
  --tab-radius: 10px;
  --side-w: 288px;
  --row-nav: 32px;
  --prose-max: 720px;

  /* ---- COLOUR: DARK (default theme) ----
     --c-accent        bright: text, borders, active-nav bar, focus, dots.
                       NEVER a background under white text.
     --c-accent-solid  darker: the only accent allowed as a filled background. */
  --c-bg: hsl(var(--brand-hue) 6% 8%);
  --c-surface: hsl(var(--brand-hue) 6% 11.5%);
  --c-surface-2: hsl(var(--brand-hue) 6% 15%);
  --c-side: hsl(var(--brand-hue) 6% 10%);
  --c-border: hsl(var(--brand-hue) 6% 21%);
  --c-border-strong: hsl(var(--brand-hue) 6% 40%);
  --c-text: hsl(var(--brand-hue) 6% 95%);
  --c-text-dim: hsl(var(--brand-hue) 6% 70%);
  --c-text-mute: hsl(var(--brand-hue) 6% 53%);
  --c-accent: hsl(var(--brand-hue) 88% 62%);
  --c-accent-hover: hsl(var(--brand-hue) 88% 48%);
  --c-accent-strong: hsl(var(--brand-hue) 96% 70%);
  --c-accent-soft: hsl(var(--brand-hue) 38% 18%);
  --c-accent-soft2: hsl(var(--brand-hue) 42% 23%);
  --c-accent-fg: #fff;
  --c-ok: hsl(152 54% 52%);
  --c-warn: hsl(40 80% 58%);
  --c-danger: hsl(4 64% 58%);
  --ok-soft: hsl(152 38% 13%);
  --ok-strong: hsl(152 64% 60%);
  --warn-soft: hsl(40 42% 14%);
  --warn-strong: hsl(38 82% 66%);
  --danger-soft: hsl(4 42% 14%);
  --danger-strong: hsl(4 72% 70%);
  --danger-border: hsl(4 32% 27%);
  --hover-bg: rgba(255,255,255,.055);
  --nav-on-bg: var(--c-accent-solid);
  --nav-on-fg: #fff;
  --nav-tint-bg: hsl(var(--brand-hue) 38% 18%);
  --nav-tint-fg: hsl(var(--brand-hue) 96% 70%);
  --badge-bg: hsl(var(--brand-hue) 38% 18%);
  --badge-fg: hsl(var(--brand-hue) 96% 70%);
  --scrim: rgba(0,0,0,.64);
  --card-bg: hsl(var(--brand-hue) 6% 11.5%);
  --card-border-c: hsl(var(--brand-hue) 6% 21%);
  --card-shadow: 0 1px 2px rgba(0,0,0,.5);
  --shadow-2: 0 18px 44px rgba(0,0,0,.66);
  --focus: 0 0 0 3px hsl(var(--brand-hue) 88% 62% / 0.3);
  --c-accent-solid: hsl(var(--brand-hue) 88% 54%);
  --c-inset: hsl(var(--brand-hue) 6% 5%);
  --c-alarm: #ff3b30;
  --c-alarm-hover: #ff5b52;
  --c-alarm-ink: #c2150b;
  --c-alarm-deep: #2a0806;
  --c-alarm-raise: rgba(255, 59, 48, .10);
  --c-alarm-edge: rgba(255, 59, 48, .38);
  --c-alarm-text: #ffb3ad;
  --c-alarm-scrim: rgba(20, 0, 0, .72);
  --c-on-alarm: #ffffff;
  --scroll-thumb: hsl(var(--brand-hue) 6% 26%);
  --scroll-thumb-hover: hsl(var(--brand-hue) 6% 38%);
  --c-danger-solid: hsl(4 64% 52%);
  --c-alarm-solid: hsl(4 100% 46%);
}

/* ---- COLOUR: light. Only what differs; structure is never redeclared. ---- */
[data-theme="light"] {
  --c-bg: hsl(var(--brand-hue) 6% 98.4%);
  --c-surface: hsl(var(--brand-hue) 6% 100%);
  --c-surface-2: hsl(var(--brand-hue) 6% 96.5%);
  --c-side: hsl(var(--brand-hue) 6% 97.4%);
  --c-border: hsl(var(--brand-hue) 6% 91.5%);
  --c-border-strong: hsl(var(--brand-hue) 6% 58%);
  --c-text: hsl(var(--brand-hue) 6% 14%);
  --c-text-dim: hsl(var(--brand-hue) 6% 36%);
  --c-text-mute: hsl(var(--brand-hue) 6% 46%);
  --c-accent: hsl(var(--brand-hue) 88% 47%);
  --c-accent-hover: hsl(var(--brand-hue) 88% 41%);
  --c-accent-strong: hsl(var(--brand-hue) 96% 38%);
  --c-accent-soft: hsl(var(--brand-hue) 78% 94%);
  --c-accent-soft2: hsl(var(--brand-hue) 80% 89%);
  --c-ok: hsl(152 54% 38%);
  --c-warn: hsl(40 80% 41%);
  --c-danger: hsl(4 64% 48%);
  --ok-soft: hsl(152 62% 93%);
  --ok-strong: hsl(152 64% 29%);
  --warn-soft: hsl(40 84% 93%);
  --warn-strong: hsl(38 82% 31%);
  --danger-soft: hsl(4 80% 95%);
  --danger-strong: hsl(4 72% 40%);
  --danger-border: hsl(4 52% 87%);
  --hover-bg: hsl(var(--brand-hue) 6% 95.2%);
  --nav-tint-bg: hsl(var(--brand-hue) 78% 94%);
  --nav-tint-fg: hsl(var(--brand-hue) 96% 38%);
  --badge-bg: hsl(var(--brand-hue) 78% 94%);
  --badge-fg: hsl(var(--brand-hue) 96% 38%);
  --scrim: rgba(20,24,32,.42);
  --card-bg: hsl(var(--brand-hue) 6% 100%);
  --card-border-c: hsl(var(--brand-hue) 6% 91.5%);
  --card-shadow: 0 1px 2px rgba(16,20,28,.06);
  --shadow-2: 0 18px 44px rgba(16,20,28,.16);
  --focus: 0 0 0 3px hsl(var(--brand-hue) 88% 47% / 0.3);
  --c-accent-solid: hsl(var(--brand-hue) 88% 47%);
  --c-inset: hsl(var(--brand-hue) 6% 94%);
  --c-alarm-deep: hsl(4 80% 97%);
  --c-alarm-text: hsl(4 72% 34%);
  --c-alarm-scrim: rgba(60, 6, 2, .40);
  --scroll-thumb: hsl(var(--brand-hue) 6% 80%);
  --scroll-thumb-hover: hsl(var(--brand-hue) 6% 66%);
  --c-danger-solid: hsl(4 64% 48%);
}

/* Follow the OS until the user picks explicitly in Settings.
   An explicit data-theme on <html> always wins. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) { color-scheme: light; }
}

/* Motion budget is "minimal" — but a user asking for less always wins. */
@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; --scrim-blur: none; }
}