/* The Reserve List — design tokens.
 *
 * The single definition of the palette that was copy-pasted, byte-identically,
 * into all 42 source files.
 *
 * ===========================================================================
 * What is in here, and what deliberately is not
 * ===========================================================================
 *
 * Only tokens that are (a) shared across many pages and (b) have exactly ONE
 * value everywhere they appear.
 *
 * The second condition matters more than it sounds. Extracting the union of all
 * 42 :root blocks looks safe — an unused custom property costs nothing, and a
 * missing one causes an invisible fallback bug that is miserable to find. But
 * two tokens are genuinely divergent:
 *
 *     --com   #A78BFA in eu_budget and eu_trilogue_inside
 *             #9B8CE8 in eu_trilogue_anatomy
 *     --ep    #7FD8E8 in eu_budget and eu_trilogue_inside
 *             #5EC8D8 in eu_trilogue_anatomy
 *
 * SINCE UPDATED, and worth knowing before you act on the paragraph above: the
 * page holding the divergent values, /explainers/trilogue-anatomy, was folded
 * into /explainers/trilogue-inside and deleted. The two live pages that define
 * these three tokens -- page/budget.css and page/trilogue-inside.css -- now
 * agree byte for byte, so the divergence survives only in the archived source
 * HTML. Hoisting them is therefore safe for the SITE and would still fail
 * invariant 8, which reads the originals. That is a Pass C decision with the
 * invariant to adjust alongside it, not a free win -- do not do half of it.
 *
 * Those are institution colours — Commission and Parliament — and hoisting
 * either one here would silently recolour a diagram on a page nobody thought
 * they were editing. They stay in page CSS. So do the other one-off tokens
 * (--abs, --closed, --cou, --d290, --d291, --dead, --founder, --frozen, --land,
 * --lobby, --lock, --member, --open, --sea, --unopen), which mean something
 * only in the page that defines them.
 *
 * Extraction rule, for whoever adds the next one: a token belongs here when it
 * names a role in the shared visual language. A token that names a specific
 * thing on one page does not, however tempting the deduplication looks.
 */

:root {
  /* --- Surfaces ------------------------------------------------------- */
  --bg:       #0B1E33;                    /* page ground */
  --panel:    #0F2740;                    /* cards, panels */
  --panel-2:  #123055;                    /* raised surface within a panel */
  --dark:     #08172a;                    /* recessed wells, code blocks */

  /* --- Lines and the grid backdrop ------------------------------------ */
  --line:     #5EC8D8;                    /* the cyan the whole site is built on */
  --line-dim: rgba(94, 200, 216, .28);    /* borders */
  --grid:     rgba(94, 200, 216, .07);    /* the 32px graph-paper background */

  /* --- Ink ------------------------------------------------------------ */
  --ink:      #DCEEF5;
  --ink-dim:  #7FA0B8;

  /* --- Status --------------------------------------------------------- */
  --ok:       #6FE7B3;                    /* correct, passed, complete */
  --bad:      #F2A93B;                    /* warning, degraded */
  --warn:     #F2C94C;                    /* softer caution */
  --crit:     #E8544A;                    /* error, failure, destructive */
  --no:       #E8737F;                    /* "against" in the vote UI */
  --drill:    #FF9F5A;                    /* the EN TRAVAUX / roadworks orange */

  /* --- Type ------------------------------------------------------------
   * Both families are self-hosted from /assets/fonts rather than fetched from
   * fonts.googleapis.com. All 42 original files loaded them from Google, which
   * transfers every visitor's IP address to a third country on page load — the
   * thing the Munich Regional Court decided against in 2022. Cheap to fix, and
   * we were editing every one of these files anyway.
   *
   * ===========================================================================
   * THESE TWO ARE OVERRIDDEN ON 22 PAGES AND NOBODY DECIDED THAT
   * ===========================================================================
   *
   * The fallback stacks below were added here. The originals said
   *
   *     --mono: 'IBM Plex Mono', monospace;
   *     --disp: 'Space Grotesk', sans-serif;
   *
   * and 22 page sheets still carry exactly that in their own :root. A page
   * sheet loads AFTER this file, so on those 22 pages the shorter version is
   * the one in force and the stacks here do nothing. Pass B removed the other
   * 256 redeclarations from those blocks precisely because they were equal;
   * these two survived because they are not, and reconciling them is a
   * rendering decision rather than a deduplication.
   *
   * It is only visible before the webfont arrives, or if it fails to: the
   * fallback is then bare `monospace` rather than the platform's own. Two ways
   * to settle it, both one job:
   *
   *   a. delete the --mono/--disp lines from the 22 page sheets, and these
   *      stacks apply everywhere -- which is what this file is for; or
   *   b. shorten these two back, and the page sheets become removable too.
   *
   * What should not happen is a third value appearing somewhere. Note that
   * invariants.pl check 8 does not cover this: it compares tokens against the
   * ARCHIVED source HTML, not against the live page sheets, so this divergence
   * is unchecked.
   * ------------------------------------------------------------------- */
  --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --disp: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* --- Layout ---------------------------------------------------------
   * The wrapper width varied per page (820px on the hub, 760px on the drills
   * index, 660px on the listing, 460px on signup). One token, set per page by
   * a body class, rather than four copies of .wrap.
   * ------------------------------------------------------------------- */
  --wrap-max: 820px;
  --grid-size: 32px;
}