/* STANDARDS — design tokens.
 *
 * This file OUTLIVES the Phase 1 spike. When index.html and main.js are
 * deleted at Review Gate 1, this stays: the palette here is measured, not
 * chosen by eye, and re-deriving it in Phase 2 would mean repeating the audit.
 *
 * Every contrast figure below is a WCAG 2.1 ratio against the surface named,
 * verified against the live DOM by checks/contrast.js — not calculated from
 * the stylesheet and hoped for. Run that check before changing any value here.
 *
 * Targets: 4.5:1 normal text, 3.0:1 large text and UI component edges. The
 * game is played outdoors, so the floor is deliberately kept above AA rather
 * than at it — see "Field conditions" in CONCEPT.md.
 */

:root {
  /* --------------------------------------------------------------- stock
     One department, one paper stock. NCR carbonless sets run
     white–yellow–pink–blue–green in a fixed order, so the five-department
     palette in Phase 4 is a swap of --stock and --stock-2, not five brand
     decisions. Footwear is the white copy. */

  --stock:      #E9E5D8;
  --stock-2:    #E0DBCB;

  /* ----------------------------------------------------------------- ink
     The values on the right are what these replaced. Every one of the old
     ones failed its target before any sunlight was involved. */

  --ink:        #17150F;   /* 14.48:1 on --stock */
  --ink-soft:   #4A463A;   /*  7.48:1 — body prose */
  --ink-faint:  #544F44;   /*  6.46:1 — was #837C6B at 3.29:1, failing AA */
  --rule:       #6E6857;   /*  4.41:1 — was #A9A392 at 2.00:1, failing 3.0 */
  --rule-soft:  #847E6D;   /*  3.21:1 — was #C6C0AF at 1.44:1, failing 3.0 */

  /* Two reds. --stamp is the ink of the stamp as a graphic; --mark is the
     same red when it carries readable text and therefore has to clear 4.5. */
  --stamp:      #B33A2B;
  --mark:       #9E3123;   /*  6.00:1 on --stock */

  --bar:        #D5DDCB;   /* green bar */
  --ral-1021:   #E0B400;   /* Rapsgelb, as issued */
  --ral-faded:  #CBBE86;   /* the reference chip, degraded */

  /* ---------------------------------------------------------- instrument
     The viewfinder is a device, not paper, and a paper ink has no business
     on it: --stamp on --dark measures 3.34:1, the worst pairing glare can
     hand you. --hud-mark exists for exactly that. */

  --hud:        #E8E4DA;   /* 15.52:1 on --dark */
  --hud-dim:    #C6C1B4;   /* 10.96:1 */
  --hud-mark:   #E4705C;   /*  6.35:1 */
  --dark:       #0B0B09;

  /* -------------------------------------------------------------- scrims
     A gradient over a sunlit pavement leaves chrome floating on whatever the
     street supplies. Field copy swaps these for solid plates, which are
     deterministic. Never rely on a gradient to make text readable. */

  --scrim-top:    linear-gradient(to bottom, rgba(0,0,0,0.72), transparent);
  --scrim-bottom: linear-gradient(to top, rgba(0,0,0,0.84), transparent);
  --scrim-top-h:    26%;
  --scrim-bottom-h: 46%;

  --stroke: 1px;

  /* ---------------------------------------------------------------- type
     Two families, four treatments, and that is the whole system: chrome
     (mono, tracked, uppercase) for every label, number and button; display
     (grotesk 800) for the brief; prose (grotesk 400) for the Ministry
     speaking in sentences; figure (mono, tabular) for the deadline. Colour
     and size are modifiers on those four, never new treatments.

     Both stacks are pinned explicitly. -apple-system resolves to SF on iOS
     and Roboto on Android, which made the same screen a different typeface
     per device. */

  --display: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --chrome: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  --t-chrome: 11px;
  --t-prose:  15px;
  --t-button: 12px;
  --t-figure: 24px;
  --t-cell:   clamp(16px, 5vw, 21px);
}

/* --------------------------------------------------------------- field copy
 *
 * The Ministry's large-print edition, for a game played outdoors in bright
 * sun. Two ways in, because both are needed: the operating system's own
 * contrast preference costs the player nothing, and an explicit control
 * covers the far more common case of bright sun with no preference ever set.
 *
 * Explicit "off" beats the OS. Explicit "on" beats everything. The two blocks
 * below are identical on purpose — a media query cannot be reused as a
 * selector, and collapsing them behind one class would make the OS path
 * depend on JavaScript having run.
 */

@media (prefers-contrast: more) {
  :root:not([data-field="off"]) {
    --ink-soft:  #17150F;
    --ink-faint: #2A2721;
    --rule:      #17150F;
    --rule-soft: #4A463A;
    --mark:      #7E2618;
    --hud-dim:   #E8E4DA;
    --hud-mark:  #F09A8A;   /* 9.09:1 on --dark */
    --scrim-top:    rgba(11, 11, 9, 0.92);
    --scrim-bottom: rgba(11, 11, 9, 0.94);
    --scrim-top-h:    22%;
    --scrim-bottom-h: 40%;
    --stroke: 2px;
    --t-chrome: 13px;
    --t-prose:  17px;
    --t-button: 14px;
    --t-figure: 26px;
    --t-cell:   clamp(18px, 5.6vw, 23px);
  }
}

:root[data-field="on"] {
  --ink-soft:  #17150F;
  --ink-faint: #2A2721;
  --rule:      #17150F;
  --rule-soft: #4A463A;
  --mark:      #7E2618;
  --hud-dim:   #E8E4DA;
  --hud-mark:  #F09A8A;   /* 9.09:1 on --dark */
  --scrim-top:    rgba(11, 11, 9, 0.92);
  --scrim-bottom: rgba(11, 11, 9, 0.94);
  --scrim-top-h:    22%;
  --scrim-bottom-h: 40%;
  --stroke: 2px;
  --t-chrome: 13px;
  --t-prose:  17px;
  --t-button: 14px;
  --t-figure: 26px;
  --t-cell:   clamp(18px, 5.6vw, 23px);
}