/* Brand tokens. Light is the default; dark follows the system or the toggle. */
:root,
[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f6fb;
  --bg-glow: #e6ebff;
  --surface: rgb(255 255 255 / 0.84);
  --surface-solid: #ffffff;
  --chip-bg: rgb(255 255 255 / 0.94);
  --edge: rgb(255 255 255 / 0.9);
  --ink: #0b1020;
  --ink-2: #3a4258;
  --muted: #5a6380;
  --line: rgb(11 16 32 / 0.08);
  --ring: rgb(11 16 32 / 0.3);
  --accent: #3346ff;
  --ok: #0f8a5a;
  --warn: #c27803; /* score "fair" */
  --risk: #d4442e; /* score "poor" */
  --error: #b42318; /* form errors (6.6:1 on white) */
  --shadow: 40 52 120;
  --btn-bg: #0b1020;
  --btn-ink: #ffffff;
  --halo-opacity: 0.32;
  --grain: 0.05;
  --rest-mix: 55%; /* unfilled Problem words: share of --ink */
  --plan-cta: var(--accent); /* featured plan button: the card is dark here */
  --plan-cta-ink: var(--bg);
}

/* css/nojs.css repeats this block for visitors without JS (QA compares them). */
[data-theme="dark"] {
  color-scheme: dark;
  --bg: #070a18;
  --bg-glow: #151c44;
  --surface: rgb(16 21 44 / 0.86);
  --surface-solid: #10152c;
  --chip-bg: rgb(20 26 54 / 0.92);
  --edge: rgb(255 255 255 / 0.1);
  --ink: #eef1ff;
  --ink-2: #c3c9e6;
  --muted: #9aa3c7;
  --line: rgb(255 255 255 / 0.08);
  --ring: rgb(238 241 255 / 0.35);
  --accent: #8a97ff;
  --ok: #3ddc97;
  --warn: #f5b544;
  --risk: #ff7a66;
  --error: #ff8f85;
  --shadow: 0 0 0;
  --btn-bg: #eef1ff;
  --btn-ink: #070a18;
  --halo-opacity: 0.45;
  --grain: 0.06;
  --rest-mix: 45%;
  --seg-tint: 30%;
  --plan-cta: var(--btn-ink); /* the card is pale here: a dark button keeps its edge */
  --plan-cta-ink: var(--btn-bg);
  --photo-filter: brightness(.9) saturate(.95); /* late.css */
}

:root {
  --font-display: "Funnel Display", "Segoe UI", system-ui, sans-serif;
  --font: "Funnel Sans", "Segoe UI", system-ui, sans-serif;
  --mono: "Martian Mono", ui-monospace, Consolas, monospace;
  --ease: cubic-bezier(.16, 1, .3, 1);
  --max: 1280px;
  --gutter: clamp(16px, 4vw, 48px);
  --r-panel: 24px;
  --r-input: 12px;
  --z-nav: 50;
  --z-grain: 80;
  --z-cursor: 90;
}