/* docs/design/theme.md section 2. Light is the bare :root; dark redefines the neutrals
   twice so the device setting and an explicit data-theme both win. Yellow appears only
   on the sign, green and vermilion only on the map. */
@layer tokens, base, components;

@layer tokens {
  :root {
    --paper: #FFFFFF; --ink: #000000; --muted: #6B6B6B; --rule: #D9D9D6; --heat0: #ECECE9;
    --ad: #F3F3F0;
    --quiet: #009E73; --busy: #D55E00;
    --sign: #FFD500; --sign-ink: #000000; --sign-muted: #4A4200; --sign-rule: #D9B400;
    --font: "Atkinson Hyperlegible Next", "Atkinson Hyperlegible fallback", "Atkinson Hyperlegible", "Public Sans", system-ui, sans-serif;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) { --paper: #000000; --ink: #FFFFFF; --muted: #9A9A96; --rule: #2E2E2C; --heat0: #1C1C1A; --ad: #141412; }
  }
  :root[data-theme="dark"] { --paper: #000000; --ink: #FFFFFF; --muted: #9A9A96; --rule: #2E2E2C; --heat0: #1C1C1A; --ad: #141412; }
}