/* tokens.css — the style reset's WINNER (founder 2026-09-29: Base B · Type C · Accent C · Ground B · Corners A), copied into the
   shop for B3's pilot cut (PLAN row 6b, 2026-10-05) from product-design/site-style/candidates/w-winner/tokens.css at 6c8a9e20.
   The shop's copy is the one that ships from here (the race page v2 and B6 read it too); the rig's stays the record of the
   decision. Changes from the rig's file: the Google Fonts import removed (the site self-hosts — README §16.1; the serif never
   enters the builder or the order page, §16.2), the Inter faces' URLs made the site's own. */
/* Candidate W — THE WINNER (the founder's picks, 2026-09-29, session 4 of the style reset; README §16): B's tokens as the base with
   TYPE from C (Newsreader for the display sizes, Inter for the UI), ACCENT from C (one quiet teal for links), GROUND B (unchanged),
   CORNERS from A (3 px controls and chips, square cards). Generated by panel/compose-winner.py — edit the candidates or the picks there,
   not this file, except the "combined pass" block at the end (his notes, 2026-09-29). */
/* Session 4 (2026-09-29): Inter's faces declared here too — the poster's live-footer mock is set in "Inter" (the poster's own lettering, never the
   chrome's face); without the declaration it silently fell back to Instrument Sans in B alone, so the product changed with the chrome. */
@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap;
  src: url("/assets/fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0100-0130, U+0132-0151, U+0154-017F;
  src: url("/assets/fonts/inter-latin-ext-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 500; font-style: normal; font-display: swap;
  src: url("/assets/fonts/inter-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 500; font-style: normal; font-display: swap; unicode-range: U+0100-0130, U+0132-0151, U+0154-017F;
  src: url("/assets/fonts/inter-latin-ext-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 600; font-style: normal; font-display: swap;
  src: url("/assets/fonts/inter-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 600; font-style: normal; font-display: swap; unicode-range: U+0100-0130, U+0132-0151, U+0154-017F;
  src: url("/assets/fonts/inter-latin-ext-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 700; font-style: normal; font-display: swap;
  src: url("/assets/fonts/inter-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 700; font-style: normal; font-display: swap; unicode-range: U+0100-0130, U+0132-0151, U+0154-017F;
  src: url("/assets/fonts/inter-latin-ext-700-normal.woff2") format("woff2"); }


:root {
  /* ---- ground + surfaces ---- */
  --ground: #FAFAF8;          /* 2026-09-28: the PAGE (was the wall #E6E5E1 — now --ground-product) */
  --surface: #FFFFFF;         /* 2026-09-28: what you act on, a step lighter than the page (was #FAFAF8) */
  --surface-2: #EEEDE9;
  --ground-product: #E6E5E1;  /* 2026-09-28: the product ground — B's wall, bounded to the product areas */

  /* ---- ink ---- */
  --ink: #171717;
  --ink-2: #3B3B39;
  --soft: #6E6E6A;
  --hairline: #DCDBD6;        /* 2026-09-28: re-tuned for the near-white page (was #CFCEC8, tuned for the wall) */
  --rule: #B8B7B1;
  --field-border: #B8B7B1;

  /* ---- accent + trust ---- */
  --accent: #0F5C63;       /* no colour in the chrome */
  --kicker: var(--soft);
  --num: var(--ink);
  --link: var(--accent);
  --link-underline: rgba(15,92,99,.35);
  --trust: #2B6A4B;           /* verified: found times, "Large enough to print", official results */
  --notice-bg: var(--surface);
  --notice-border: var(--ink);
  --mark-bg: #F3E7BD;

  /* ---- controls ---- */
  --btn-bg: var(--ink); --btn-fg: #FFFFFF; --btn-hover: #000000;
  --ghost-border: var(--ink); --ghost-fg: var(--ink);
  --chip-bg: transparent; --chip-fg: var(--ink); --chip-border: var(--rule);
  --chip-on-bg: var(--surface-2); --chip-on-fg: var(--ink); --chip-on-border: var(--ink); --chip-on-ring: var(--ink);   /* 6b5 (f), his pick A 2026-10-09: ringed on a light grey — the ink fill fought the step's button (was --ink / #FFFFFF) */
  --focus: var(--ink);

  /* ---- type ---- */
  --font-ui: "Inter", system-ui, sans-serif;
  --font-display: "Newsreader", "Newsreader Fallback", Georgia, "Times New Roman", serif;   /* the faces: race.css (PLAN row 8) — the pages set in the serif declare it */
  --display-weight: 500;
  --display-tracking: -0.012em;
  --display-lh: 1.1;
  --h1: clamp(36px, 4.4vw, 50px);
  --h2: 28px; --h2-weight: 500; --h2-tracking: -0.01em;
  --h3: 16.5px;
  --body: 16px; --lh-body: 1.6;
  --lede: 19px;
  --small: 14px; --micro: 12.5px;
  --price: 30px; --price-weight: 600;
  --kicker-size: 12px; --kicker-tracking: 0.1em;

  /* ---- space + shape ---- */
  --unit: 4px;
  --gutter: 28px; --gutter-phone: 16px;
  --section: 72px;
  --maxw: 1120px;
  --radius: 3px;
  --radius-card: 0px;
  --radius-chip: 3px;

  /* ---- elevation ---- */
  --shadow-card: none;
  --shadow-sheet: 0 1px 2px rgba(0,0,0,.10), 0 12px 28px -6px rgba(0,0,0,.22);
  --shadow-frame: 0 1px 1px rgba(0,0,0,.12), 0 3px 8px rgba(0,0,0,.12), 0 22px 44px -10px rgba(0,0,0,.34);
  --shadow-strip: 0 -6px 18px rgba(0,0,0,.08);
  --shadow-menu: 0 14px 28px rgba(0,0,0,.10);
  --sheet-edge: rgba(0,0,0,.06);

  /* ---- the frame ---- */
  --frame-w: 5.5cqw;
  --frame-black: #171512;
  --frame-brown: #5A4130;
  --frame-natural: #D8C7A4;
  --frame-white: #F4F2EC;
  --frame-lip-dark: rgba(255,255,255,.14);
  --frame-lip-light: rgba(0,0,0,.16);
  --frame-outline: rgba(0,0,0,.08);


  /* ---- BACKGROUNDS (the dedicated session, 2026-09-28): the page is white/near-white for reading and configuring; the product ground is grey
     for presenting and comparing. --ground paints the page, --ground-product the product stage/gallery/preview unit, --bar-bg the working chrome,
     --ground-reading the support pages. The old --stage/--stage-pad/--stage-hero/--stage-hero-pad quiet block is RETIRED: a poster inside a
     product area sits on the area (system.css "BACKGROUNDS"). Values here are the initial comparison values — session 4's Ground card. ---- */
  /* ---- the sticky strip / bars ---- */
  --strip-bg: var(--bar-bg);           /* CORRECTED 2026-09-28 (his notes, 1–2): the strip is working chrome; the grey comes with the poster (system.css) */
  --ground-band: #F1F0EC;              /* NEW 2026-09-28 (his notes, 4): the alternate reading band — between the page and the product ground */
  --strip-border: #CFCEC8;             /* its inner separators: the old hairline, tuned for the grey */
  --bar-bg: var(--surface);

  /* ---- RESET 2026-09-24 · semantic roles (the UX/UI review's P1: readable secondary text, control boundaries
     separate from decorative rules, error + focus, the reading measure, the pictured price, the target size).
     Every name here is read by ../../system.css; the values differ per candidate, the roles do not. ---- */
  --text: var(--ink);
  --text-2: var(--ink-2);          /* descriptions */
  --text-3: #5A5A56;               /* secondary but READ: hints, captions, facts, nav, closed stages — >= 4.5:1 on the ground AND on a surface */
  --text-disabled: #8C8B85;        /* unavailable only, never the only cue */
  --rule-deco: var(--hairline);    /* a divider: decorative, may be faint */
  --control-border: #7A7A75;       /* the boundary of anything you can operate: >= 3:1 on the ground and on the surface */
  --control-border-hover: var(--ink);
  --control-bg: var(--surface);
  --error: #A3241F;                /* >= 4.5:1 on the ground: an invalid field, a fit failure, a recovery line */
  --error-bg: #F4E6E3;
  --focus-ring: var(--ink);
  --ground-reading: var(--ground);    /* 2026-09-28: the reading pages share the page (the wall is gone; ?reading=surface compares pure white) */
  --offer-bg: var(--surface);           /* the product summary's surface (variant B) */
  --offer-border: var(--hairline);
  --price-hero: 26px;               /* the pictured format's price */
  --measure: 640px;                 /* the reading measure = 68-74 characters at 16 px */
  --target: 44px;                   /* the comfortable hit size (a design aim; AA's floor is 24) */
  --paper-warm: #F8F2E4; --paper-white: #FFFFFF; --paper-night: #14181D; --paper-ink: #160C00;  /* the live-footer mock */
  --soft: var(--text-3);            /* the old muted role now reads as text-3 (the fix is system-wide; A is no longer byte-equal to today's site) */

  /* ---- THE COMBINED PASS (his notes 2026-09-29, after the picks): the broad poster shadows softened — an unframed sheet looked elevated, and the framed
     examples' shadow spread toward the captions on the tint — the fine edge kept so the white papers stay visible (README §16). ---- */
  --shadow-sheet: 0 1px 2px rgba(0,0,0,.10), 0 8px 18px -8px rgba(0,0,0,.16);
  --shadow-frame: 0 1px 1px rgba(0,0,0,.12), 0 3px 8px rgba(0,0,0,.12), 0 14px 28px -12px rgba(0,0,0,.24);
}