/* Design tokens, shared by the landing page and the portal.
   AUTHORED SOURCE: 06_pipeline/landing-page/public/tokens.css
   COPY, never edited: 06_pipeline/portal/src/tokens.css
   The direction is one-way. Edit the source, then re-copy.
   LOCKED, and ENFORCED since 2026-09-18: row C8 in
   06_pipeline/locked-settings.tsv makes the pre-commit hook refuse a commit
   in which the two copies differ, and rows C1 to C7 and D1 to D7 lock every
   value below. Changing a colour means changing its row in the same commit;
   the colour sitting will do exactly that. This read "Nothing enforces this;
   the check is the mechanism" until then.

   PALETTE: HARBOR BRIGHT since 2026-09-18 (owner, at the colour sitting: "I
   like Harbor bright for the site for now"). It is Harbor with a brighter
   accent only (#0f6a8b -> #00718f light, #4fb0d4 -> #42c1f0 dark); every
   other value is unchanged. The sitting page, not this comment, is how the
   choice was made: infra-docs verbatimlog-pipeline/brand/palette-sitting.html.

   LIGHT HALF REWORKED 2026-09-18, same day (owner picked option B at the
   light-mode sitting, infra-docs verbatimlog-pipeline/brand/light-sitting.html).
   His phone screenshots showed the halves reading as two brands: dark had the
   bright #42c1f0 button, light a dull #00718f one. One token did two jobs.
   Link text on near-white needs 4.5:1 and the sky blue gives about 2:1, so
   --accent (text) and --accent-fill (the button) are now separate. The button
   is #42c1f0 with dark ink in BOTH halves; light links went #00718f -> #0072a3,
   the page #f7fafb -> #eef4f7 and rules #dce5e9 -> #d3dfe5 so cards stand
   apart. Before screenshots: brand/light-mode-2026-09-18/before/.

   Before that: Harbor (blue-teal), chosen 2026-08-22 from an eleven-way comparison
   run on the real /login page. It replaced the original amber
   (#b45309 / #e8873a) on both hosts: the apex has served this file since the
   CSS extraction deployed (infra-docs pipeline doc 039). The other ten
   candidates live in the portal's palettes.css and are reachable only in the
   `palettes` build mode.

   Two corrections, 2026-09-03. This read "a nine-way comparison" and "The
   other eight candidates", against eleven in both palettes.css and
   PalettePicker.jsx, and it said the landing page "still serves" amber, which
   stopped being true when the extraction shipped. Derive the count rather than
   believing this line:
     grep -o 'data-palette="[a-z-]*"' palettes.css | sort -u | wc -l

   Until 2026-09-18 this said Harbor was verified in one viewing condition
   only (one desktop browser, desktop width, OS in dark mode). The sitting
   that day showed both halves at phone and desktop width in more than one
   browser. Open in infra-docs
   ROADMAP.md; the comparison tool is `npm run build:palettes` in the portal,
   served with `npx wrangler dev` so the CSP still applies. */

:root {
  --bg: #eef4f7;
  --text: #13191c;
  --muted: #5e696f;
  --accent: #0072a3;
  --rule: #d3dfe5;
  --field: #ffffff;
  /* The button: its fill and the text on it. Split from --accent 2026-09-18
     so the button can be the bright blue while link text stays dark enough
     to read. Dark ink on #42c1f0 is about 8.9:1. */
  --accent-fill: #42c1f0;
  --accent-ink: #0f1417;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0f1417;
    --text: #e6ecef;
    --muted: #909ea5;
    --accent: #42c1f0;
    --rule: #232c31;
    --field: #161c20;
    --accent-fill: #42c1f0;
    /* Text ON the accent. In dark mode the accent is a LIGHT colour, so white
       on it fails contrast (the old #e8873a on #fff was about 2.2:1, against
       the 4.5:1 a bold 0.95rem button needs). Using the page background
       instead gives roughly 7:1 and holds for every palette. */
    --accent-ink: #0f1417;
  }
}