/* css/tokens.css — Braun redesign token system (v3.0).
   Dark = "Braun black-LCD": neutral charcoal, warm cream digits, Braun-yellow accent.
   Authoritative values: design_handoff_show_clock/rd-styles.css.
   Imported into the `tokens` layer by style.css.

   MIGRATION NOTE: the redesign renames every token (--bg, --surface, --fg, --amber, …).
   The "legacy aliases" block below maps every OLD token name to the NEW one via var(),
   so un-rewritten modules keep working in the new palette during the phased migration.
   CSS custom-property aliases resolve lazily at use-site, so theme overrides in
   themes.css need only override the NEW names — the aliases follow automatically.
   The alias block is deleted in Phase 6 once all modules use the new names. */

:root {
  /* ── Surfaces ─────────────────────────────────────────── */
  --bg:          #0d0e10;
  --surface:     #15171a;
  --surface-2:   #1d2024;
  --surface-3:   #262a2f;

  /* ── Text ─────────────────────────────────────────────── */
  --fg:          #ece8da;
  --muted:       #9a988f;
  /* Review P4: #62635e was ≈3.2:1 on --bg / ≈2.9:1 on --surface — below the
     4.5:1 minimum for the functional small text that uses it (phone tab-bar
     labels, .slot__state.done, sheet labels). #8a8b83 ≈ 5.5:1 on --bg,
     ≈4.7:1 on --surface-2. */
  --faint:       #8a8b83;

  /* ── Accent + semantic ────────────────────────────────── */
  --amber:       #f5be00;
  --amber-soft:  #ffd34d;
  --blue:        #7e9cc4;
  --green:       #6cab38;
  --error:       #e0524e;
  /* Signal orange (user pick 2026-07-10): a true orange at the same brightness as
     --amber, so the warning state reads "hotter", never a dirty/darker amber.
     Old #ef9d24 sat only ~20° from --amber in hue → looked degraded, not distinct. */
  --warning:     #ff8a2e;

  /* ── AUD-D ink tokens (audit Batch D) ───────────────────
     Text/icon variants of the accents, guaranteed ≥4.5:1 on their usual
     surfaces PER THEME (themes.css overrides for light). Raw --amber as
     ink was 1.74:1 on the light theme's white; the LATE pill ink was
     4.16:1 on its own tint in dark. Backgrounds keep the raw accents. */
  --amber-ink:   var(--amber);   /* dark 11.26:1 on --bg */
  --ok-ink:      var(--green);   /* dark 5.50:1 on its 11% tint */
  --late-ink:    #e66663;        /* dark 4.89:1 on its 12% tint (was --error 4.16) */
  --ahead-ink:   var(--blue);    /* dark 5.32:1 on its 12% tint */
  --warning-ink: var(--warning); /* dark 6.67:1 on its 12% tint */

  /* AUD-F41: ink used ON amber surfaces (Live chip, primary buttons, seg .on,
     cue banner). Was a #0a0a0a literal repeated ~8× — one token, one place to
     change if a theme ever shifts amber lightness. 11.37:1 on light amber. */
  --ink-on-accent: #0a0a0a;

  /* ── Lines ────────────────────────────────────────────── */
  --line:        #24262a;
  /* AUD-F25: was #33363b = 1.48:1 vs --surface — ghost buttons and segs were
     identified almost solely by invisible hairlines. #565b63 = 2.63:1: a
     deliberate PARTIAL step (full 3:1 needs ≈#6e737b, which reads as chrome,
     not hairline, against the Braun black-LCD look). Text inside every
     affected control passes ≥4.5:1 and remains the primary identifier. */
  --line-2:      #565b63;

  /* ── Live accent (swapped by [data-state] on .app) ────── */
  --live:        var(--amber);

  /* ── Type ─────────────────────────────────────────────── */
  --mono:        'JetBrains Mono', ui-monospace, Menlo, monospace;
  --sans:        'Helvetica Neue', Helvetica, Arial, 'DM Sans', system-ui, sans-serif;

  /* ── Radii ────────────────────────────────────────────── */
  --r-chip:      6px;
  --r-ctrl:      8px;
  --r-card:      12px;

  /* ── Spacing scale (kept from legacy; handoff has no scale) ── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* ── Effects ──────────────────────────────────────────── */
  --transition:  0.15s;
  --shadow-lift: 0 24px 70px -28px rgba(0, 0, 0, 0.85);
  --glow-amber:  0 0 60px color-mix(in oklab, var(--amber) 15%, transparent);

  /* ════════════ LEGACY ALIASES (removed in Phase 6) ════════════
     Old name → new token. Lazily resolved, so theme overrides of the
     new names cascade through these to un-rewritten modules. */
  --bg-primary:        var(--bg);
  --bg-surface:        var(--surface);
  --bg-surface-2:      var(--surface-2);
  --bg-surface-3:      var(--surface-3);
  --text-primary:      var(--fg);
  --text-muted:        var(--muted);
  --text-faint:        var(--faint);
  --accent-amber:      var(--amber);
  --accent-amber-soft: var(--amber-soft);
  --accent-teal:       var(--blue);
  --accent-blue:       var(--blue);
  --accent-green:      var(--green);
  --clock-warning:     var(--warning);
  --clock-alert:       var(--error);
  --clock-positive:    var(--green);
  --color-success:     var(--green);
  --color-warning:     var(--warning);
  --color-error:       var(--error);
  --border-subtle:     var(--line);
  --border-strong:     var(--line-2);
  --radius:            var(--r-card);
  --radius-sm:         var(--r-ctrl);
  --radius-xs:         var(--r-chip);
  --radius-lg:         14px;
  --font-mono:         var(--mono);
  --font-body:         var(--sans);
  --font-ui:           var(--sans);
  --accent-color:      var(--amber);
  --bg-base:           var(--bg);
  --bg-panel:          var(--surface);
  --text-secondary:    var(--muted);
}