/* theme.css — docs/STYLE.md §2. The single source of truth for every UI-chrome colour token (tier 3
   in that doc). `style.css` and `player.css` both link this directly from their own HTML `<head>` —
   a `<link>`, not a CSS `@import`, so the two stylesheets still load in parallel with it instead of
   waiting on a nested fetch. Neither game nor player stylesheet declares its own copy of these
   variables any more; changing a hex here changes it everywhere at once.

   This file owns tier-3 tokens only. The artwork's own colours (ART_RGB in cell.js, WALL_BODY/
   WALL_EDGE/GLOW_CSS in render.js, VOID_RGB in mapview.js) are deliberately NOT here — tier 1/2 are
   literal hex that must never move through a CSS variable or invert with theme (docs/STYLE.md §1). */
:root{
  --ground:#F5F7F7; --surface:#FFFFFF; --surface-2:#EDF1F1;
  --ink:#14191A; --ink-2:#3E4849; --muted:#697476; --hair:#DCE2E2;
  --accent:#007176; --warn:#845922;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
@media (prefers-color-scheme:dark){
  :root{
    --ground:#0D1011; --surface:#151A1B; --surface-2:#1C2223;
    --ink:#E8EDED; --ink-2:#C0C9C9; --muted:#8D9899; --hair:#252C2D;
    --accent:#24C1C9; --warn:#DB9D4F;
  }
}

/* Manual override: the #settings "theme" dropdown (main.js) sets `data-theme="light"`/`"dark"` on
   `<html>` (or clears it for "System") so a player can force either palette regardless of what their
   system prefers — the PWA manifest's theme_color/background_color are static and ship dark (PLAN.md
   §56), so this is the escape hatch. An attribute selector on :root always outranks the dark media
   query's plain :root rule, regardless of source order, so neither block below needs `!important` or
   to move above it.

   Adam's report, 2026-08-31: only the light override existed at first — with the system set to
   light, there was no way to force the app dark. `[data-theme="dark"]` is the missing other half,
   the exact values the dark media query above already uses, just reachable without the system
   agreeing. */
:root[data-theme="light"]{
  --ground:#F5F7F7; --surface:#FFFFFF; --surface-2:#EDF1F1;
  --ink:#14191A; --ink-2:#3E4849; --muted:#697476; --hair:#DCE2E2;
  --accent:#007176; --warn:#845922;
}
:root[data-theme="dark"]{
  --ground:#0D1011; --surface:#151A1B; --surface-2:#1C2223;
  --ink:#E8EDED; --ink-2:#C0C9C9; --muted:#8D9899; --hair:#252C2D;
  --accent:#24C1C9; --warn:#DB9D4F;
}
