/* THE ONE PLACE A COLOUR IS DEFINED, for every page this service draws.

   WHY ONE FILE. The tokens used to live in four copies — landing.html,
   index.html, legal.css and closed.html — and they drifted. The app kept an
   older look (a warm-grey ground, cool blue-grey text, a blue-black dark mode)
   while the landing moved to Notion's register on 2026-09-16. And under a
   comment in landing.html saying the state colours "must match" the app's, dark
   Liveliness was #008300 in one and #2f9e2f in the other. A copy that has to be
   kept in step by hand is a copy that will not be. `pipeline/tests/test_auth.py`
   now fails if any other file under web/static defines `--ground:`.

   THE LOOK is taken from notion.com by founder direction, 2026-09-16: a true
   white ground, warm off-white for anything raised, text that is warm near-black
   rather than a cold grey, and a solid accent for the one action on a screen.
   `/talk` took it on 2026-09-18 so signing in does not feel like walking into a
   different building.

   WHAT EACH PAGE KEEPS FOR ITSELF is layout: spacing, type sizes, components.
   Nothing that names a colour. */

:root{
  --ground:#FFFFFF; --panel:#F7F6F3; --rule:#E9E9E7; --rule2:#F1F0EE;
  --ink:#191918; --body:#5F5E5B; --muted:#8B8A85; --faint:#B4B2AD;
  --accent:#2383E2; --accent-ink:#FFFFFF;

  /* The readout's two: a state working, a state struggling. */
  --pos:#0F7A4F; --neg:#C2333A;

  /* THE SEVEN STATES. `HUE` in index.html points at these by name, and the
     landing hero cycles through them, so a person who has seen the page
     recognises the colours in their first turn. */
  --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a; --s4:#eda100;
  --s5:#e87ba4; --s6:#008300; --s7:#4a3aa7;

  /* The app's own surfaces, in the same register. `--cell0` is an empty cell in
     the history grid, which sits on `--panel`, so it must read against the
     off-white and not only against the white. `--me` is the person's own
     message. */
  --cell0:#EAE9E5; --mid:#A3A29D; --me:#F3F2EF;
  --warn:#8a5a2b; --rec:#b4443a;
  --shadow:0 1px 2px rgba(25,25,24,.06);
  /* THE OPENING, the message the engine writes before they say anything. Its
     own tint so it is never mistaken for a reply to something they said. */
  --open:#EEF5FD; --open-rule:#BCD7F5; --open-ink:#1B6BBE;
  /* THE PERSON'S OWN MESSAGE, 2026-09-30 (founder): a light blue bubble, the
     familiar chat look, instead of the warm grey — and nothing else on the page
     is tinted, so their words are the one coloured thing. */
  --bubble:#EDF2FE; --bubble-ink:#1E3A8A;

  --f-ui:'Archivo',-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans Malayalam","Noto Sans",Roboto,sans-serif;
  --f-num:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --f-say:'Newsreader',Georgia,"Noto Serif Malayalam","Noto Sans Malayalam","Times New Roman",serif;
}

/* DARK, TWICE, AND THE TWO BLOCKS MUST STAY IDENTICAL. The media query follows
   the device; the attribute is an explicit choice that wins over it either way.

   DARK LIVELINESS IS #2f9e2f. Every other state brightens for the dark ground
   and the app's #008300 did not — it was the light value carried over, and it
   sat at poor contrast on a near-black page. */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ground:#191919; --panel:#252525; --rule:#373737; --rule2:#2A2A2A;
  --ink:#EDEDEC; --body:#B4B3AF; --muted:#8B8A85; --faint:#5C5B57;
  --accent:#4A9EEB; --accent-ink:#0F1115;
  --pos:#41C98A; --neg:#E8595E;
  --s1:#3987e5; --s2:#d95926; --s3:#199e70; --s4:#c98500;
  --s5:#d55181; --s6:#2f9e2f; --s7:#9085e9;
  --cell0:#303030; --mid:#7A7975; --me:#242424;
  --warn:#d0a06a; --rec:#c9544a;
  --shadow:0 1px 2px rgba(0,0,0,.45);
  --open:#1B2531; --open-rule:#2F4C6C; --open-ink:#7DB6F0;
  --bubble:#1C2740; --bubble-ink:#C9D6FB;
}}
:root[data-theme="dark"]{
  --ground:#191919; --panel:#252525; --rule:#373737; --rule2:#2A2A2A;
  --ink:#EDEDEC; --body:#B4B3AF; --muted:#8B8A85; --faint:#5C5B57;
  --accent:#4A9EEB; --accent-ink:#0F1115;
  --pos:#41C98A; --neg:#E8595E;
  --s1:#3987e5; --s2:#d95926; --s3:#199e70; --s4:#c98500;
  --s5:#d55181; --s6:#2f9e2f; --s7:#9085e9;
  --cell0:#303030; --mid:#7A7975; --me:#242424;
  --warn:#d0a06a; --rec:#c9544a;
  --shadow:0 1px 2px rgba(0,0,0,.45);
  --open:#1B2531; --open-rule:#2F4C6C; --open-ink:#7DB6F0;
  --bubble:#1C2740; --bubble-ink:#C9D6FB;
}