/* =============================================================================
   Exorys — design tokens. The single source of truth.

   Loaded first by index.html, stills.html and the four legal pages. Colour,
   type and the grid live here and nowhere else: --max and --gut in particular
   drive the shared left margin, so the wordmark, header bar and content column
   land on the same x on every page. Change a value here, it changes everywhere.

   Page-specific tokens stay with their page: --tabs in index.html's own
   <style>, --p and --vp (runtime-set) in deck.css.
   ========================================================================== */
:root{
  /* ---------- colour ---------- */
  --paper:#E9E9E4;
  --paper-deep:#DFDFD8;
  --ink:#0B0B0B;
  --ink-60:#565651;
  --ink-30:#9C9C95;
  --rule:#C9C9C1;
  --accent:#C8005F;

  /* ---------- type (all self-hosted, see /fonts/fonts.css) ---------- */
  --display:"Archivo",system-ui,sans-serif;
  --body:"Instrument Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;

  /* ---------- grid ---------- */
  --max:1320px;
  --gut:clamp(20px,5vw,64px);
  --hdr:60px;

  /* Viewport height. Falls back to 100vh where dvh is unsupported; the mobile
     card stack and the fullscreen deck both size against it. */
  --vh:100vh;
}
@supports(height:100dvh){:root{--vh:100dvh}}
