/* =============================================================================
   Sunday Marathon — DESIGN TOKENS (single source of truth).

   This is the ONE place design tokens live. Both the public surface (ds.css,
   shell.css) and the app surface (app.css) consume these — neither redefines a
   :root. Loaded first in every layout (main, app-public, app-onboarding) so the
   variables are defined before any component stylesheet uses them.

   Values were previously duplicated identically in ds.css and app.css; they are
   merged here verbatim (2026-06-21 de-fork) so a token changes in one place only.
   ========================================================================== */
:root {
  /* Volt brand */
  --ink:        oklch(0.20 0.012 95);
  --ink-2:      oklch(0.30 0.012 95);
  --paper:      oklch(0.990 0.002 95);
  --paper-2:    oklch(0.978 0.003 95);
  --card:       oklch(1 0 0);
  --line:       oklch(0.90 0.01 95);
  --line-dk:    oklch(0.34 0.012 95);
  --volt:       oklch(0.87 0.20 128);
  --volt-deep:  oklch(0.74 0.20 130);
  --volt-text:  oklch(0.50 0.15 130); /* accessible green for TEXT/icons on light bg (~5.5:1, WCAG AA) */
  --blue:       oklch(0.58 0.16 250);
  --blue-deep:  oklch(0.48 0.16 250);
  --volt-soft:  oklch(0.95 0.06 128);
  --muted:      oklch(0.52 0.012 95);
  --muted-dk:   oklch(0.70 0.01 95);
  /* Extra warm neutrals referenced by views (were hardcoded fallbacks to non-existent
     tokens; promoted here so they resolve from the single source, same values). */
  --ink-1:      #2b2a26;
  --ink-3:      #9a9991;
  --wash:       #faf9f6;
  --gold:       #E8B23A;
  --gold-soft:  #FBF0D2;
  --danger:     #C9362D;
  --success:    var(--volt-deep);

  /* Type */
  --font-display: "Archivo", system-ui, -apple-system, sans-serif;
  --font-body:    "Hanken Grotesk", system-ui, -apple-system, sans-serif;
  --font-mono:    "Space Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Type scale (Archivo is heavy → slightly tighter than the serif scale) */
  --fs-display: clamp(2.1rem, 1.3rem + 3.6vw, 4.2rem);
  --fs-h2:      clamp(1.55rem, 1.1rem + 2vw, 2.5rem);
  --fs-h3:      clamp(1.12rem, 1rem + .6vw, 1.35rem);
  --fs-title:   1.05rem;
  --fs-lead:    clamp(1rem, .96rem + .5vw, 1.18rem);
  --fs-body:    1rem;
  --fs-caption: .82rem;
  --fs-eyebrow: .76rem;

  /* Geometry / motion */
  --r-sm: 9px; --r-md: 12px; --r-lg: 16px; --r-xl: 20px; --r-pill: 999px;
  --sh-1: 0 1px 2px rgba(20,22,18,.05);
  --sh-2: 0 14px 30px -22px rgba(20,22,18,.45);
  --sh-3: 0 24px 50px -34px rgba(20,22,18,.5);
  --t-fast: 140ms cubic-bezier(.2,.7,.2,1);
  --t: 240ms cubic-bezier(.2,.7,.2,1);

  /* App-surface aliases (formerly app.css :root) — kept verbatim */
  --r:      14px;
  --ease:   cubic-bezier(.2,.7,.2,1);
  --shadow: 0 24px 50px -34px rgba(0,0,0,.45);

  /* ---- Legacy --sm-* alias bridge (re-skins all existing public views) -- */
  --sm-road:         var(--ink);
  --sm-road-soft:    var(--ink-2);
  --sm-mile:         var(--muted);
  --sm-muted:        var(--muted);
  --sm-start:        var(--card);
  --sm-cloud:        var(--paper-2);
  --sm-sky:          var(--volt-soft);
  --sm-cream:        var(--volt-soft);
  --sm-teal:         var(--volt-deep);
  --sm-teal-dark:    var(--ink);
  --sm-teal-soft:    var(--volt-soft);
  --sm-route:        var(--volt-deep);
  --sm-route-soft:   var(--volt-soft);
  --sm-gold:         var(--gold);
  --sm-gold-soft:    var(--gold-soft);
  --sm-clay:         var(--volt-deep);
  --sm-clay-soft:    var(--volt-soft);
  --sm-red:          var(--danger);
  --sm-border:       var(--line);
  --sm-border-strong:var(--line-dk);
  --sm-surface:      var(--card);
  --sm-surface-soft: var(--paper-2);
  --sm-radius:       var(--r-md);
  --sm-radius-sm:    var(--r-sm);
  --sm-shadow:       var(--sh-3);
  --sm-shadow-soft:  var(--sh-2);
  --sm-focus:        0 0 0 3px color-mix(in oklab, var(--volt-deep) 35%, transparent);
}