/* Shared tokens. Loaded by BOTH the showcase and every landing page.
 *
 * This file holds token NAMES and neutral defaults plus the two shared faces.
 * It holds no brand colour. Each landing page overrides the ink/ground tokens
 * in its own [data-theme] block at the bottom of page.css, so adding a fifth
 * brand never touches this file.
 *
 * Linked as a separate <link>, not @import-ed, deliberately: an @import from
 * inside showcase.css would serialise the two requests, and the stamper would
 * then have to rewrite a URL inside a stylesheet inside a stylesheet.
 */

/* Anton, subset, 12 KB, OFL - licence sits beside it in fonts/LICENCE.txt.
 * Chosen for the word wall because it is the only face in the house set that is
 * both heavy AND condensed; a display grotesk like Clash eats ~40% more room
 * per character at 230px and the wall stops reading as a wall.
 *
 * Being a subset is a real hazard at this size: a character it lacks falls back
 * silently, mid-word, at 230px. probes/check-glyphs.mjs proves coverage for the
 * exact phrase and both apostrophe candidates. Verified 17 Aug 2026: every
 * character of CAN'T RUSH WEBSITES is present, U+2019 included, so the wall is
 * authored with the typographic apostrophe rather than the straight one.
 *
 * font-display: block, not swap. The wall IS the page; a flash of 230px
 * Helvetica reflowing into 230px Anton is far worse than 100ms of nothing.
 */
@font-face {
  font-family: 'Anton';
  src: url('fonts/anton.woff2?v=e57915c8') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: block;
}

/* JetBrains Mono for the card plates and corner tags only - about 44 glyphs
 * of the 31 KB face. Subset before launch; tracked as a build step, not a
 * nice-to-have, because it is 5% of the showcase budget for two lines of text.
 * font-display: swap is right here: these are small, late, and a fallback mono
 * at 10px is nearly indistinguishable.
 */
@font-face {
  font-family: 'JetBrains Mono';
  src: url('fonts/jetbrains-mono.woff2?v=570751c5') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* --- type ------------------------------------------------------------ */
  --f-display: 'Anton', Impact, 'Haettenschweiler', sans-serif;
  --f-body: system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* --- ground and ink --------------------------------------------------
   * Ratios below are computed from the hex values, not estimated, and are
   * re-asserted against rendered pixels by verify.mjs check 5. Where a value
   * appears over the word wall rather than over a flat ground, the element
   * carries its own opaque chip - see the contrast trap note in showcase.css.
   */
  --ground: #F5E7A3;   /* riso yellow, read off the reference poster */
  --ink:    #1A1917;   /* on --ground 14.09:1, on --paper 16.56:1 */
  --paper:  #FAF8F4;   /* card plates and corner chips */
  --ink-2:  #5E5B55;   /* plate URL on --paper 6.38:1 (AA floor 4.5) */
  --line:   #1A19171F; /* hairlines: ink at 12% */

  /* --- geometry -------------------------------------------------------- */
  --radius: 10px;
  --u: 8px;            /* spacing unit; everything is a multiple */

  /* --- motion ----------------------------------------------------------
   * One easing vocabulary shared by the showcase and every landing page, so
   * the whole site moves with a single signature.
   */
  --e-out:   cubic-bezier(.22, .9, .28, 1);
  --e-inout: cubic-bezier(.42, 0, .58, 1);
  --t-fast: 160ms;
  --t:      320ms;
  --t-slow: 620ms;
}