/* Mentzai colour, from tokens.json. Light is :root (website, documents, decks); dark is [data-theme="dark"] (product UI, code).
   midnight and citrus are the same in both themes; primary flips. One citrus element per view. */
:root, [data-theme="light"] {
  --surface: #ffffff;
  --surface-sunken: #f3f5f9;
  --surface-raised: #ffffff;
  --line: #dde3ec;
  --line-strong: #7f8ea6;
  --ink: #0b1b33;
  --ink-muted: #4a5871;
  --ink-subtle: #5e6c85;
  --midnight: #0b1b33;
  --ink-on-midnight: #ffffff;
  --navy: #183565;
  --navy-soft: #e6ecf6;
  --citrus: #daf537;
  --on-citrus: #0b1b33;
  --citrus-ink: #556f00;
  --citrus-soft: #f4fbcf;
  --primary: #0b1b33;
  --primary-hover: #183565;
  --on-primary: #ffffff;
  --link: #1f4a9c;
  --focus: #183565;
  --success: #0f7a5c;
  --success-soft: #dcf4ec;
  --warning: #9a5b00;
  --warning-soft: #fff0d3;
  --danger: #c0362b;
  --danger-soft: #fce8e6;
  --chart-1: var(--navy);
  --chart-2: var(--citrus);
  --chart-3: var(--ink-muted);
  --focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px #183565;

  /* Semantic aliases (point at the tokens above; no new colours) */
  --text-body: var(--ink);
  --text-muted: var(--ink-muted);
  --text-subtle: var(--ink-subtle);
  --text-link: var(--link);
  --surface-page: var(--surface);
  --surface-band: var(--surface-sunken);
  --surface-card: var(--surface-raised);
  --surface-selected: var(--navy-soft);
  --border-hairline: var(--line);
  --border-control: var(--line-strong);
  --the-point: var(--citrus);
}
[data-theme="dark"] {
  --surface: #0b1b33;
  --surface-sunken: #07132a;
  --surface-raised: #132a4d;
  --line: #22395f;
  --line-strong: #5d7aa8;
  --ink: #eef2f8;
  --ink-muted: #aab7cc;
  --ink-subtle: #8797b1;
  --midnight: #0b1b33;
  --ink-on-midnight: #eef2f8;
  --navy: #183565;
  --navy-soft: #17315a;
  --citrus: #daf537;
  --on-citrus: #0b1b33;
  --citrus-ink: #daf537;
  --citrus-soft: #2a3a0a;
  --primary: #daf537;
  --primary-hover: #c8e62a;
  --on-primary: #0b1b33;
  --link: #8fb6ff;
  --focus: #daf537;
  --success: #3fd0a0;
  --success-soft: #0e3a2e;
  --warning: #f4b84f;
  --warning-soft: #3f2b06;
  --danger: #f5817a;
  --danger-soft: #4a1c18;
  --chart-1: var(--navy);
  --chart-2: var(--citrus);
  --chart-3: var(--ink-muted);
  --focus-ring: 0 0 0 2px #0b1b33, 0 0 0 4px #daf537;
}