/* ============================================================================
   Passerelle — tokens.css
   The single source of truth for the platform's visual language.

   « La passerelle » is a ship's bridge: where every signal converges and
   decisions get made. This file is the design layer's foundation — load it
   FIRST, before any component or page stylesheet.

   ── Why the aliases below exist ──────────────────────────────────────────
   Roughly 84 references across app_* point at variables that were never
   defined anywhere (var(--accent) ×35, var(--bg-hover) ×11, var(--text-bright)
   ×19, var(--bg-card) ×15, var(--surface) ×2, var(--radius-card) ×2). Today
   they resolve to nothing: primary buttons render transparent, hovers are
   dead, triage cards lose their radius, and the calibration screen falls back
   to a white light-theme island inside a dark app.

   Rather than rewrite ~84 call sites (churn, merge conflicts with the
   generic_analysis_2 upstream, and a real regression risk), this file DEFINES
   those names as aliases onto the canonical tokens. Every broken reference
   heals at once, at zero risk. The aliases are permanent backward
   compatibility — do not delete them, and prefer the canonical name in new
   code.

   Canonical → alias map:
     --bg-secondary      ← --surface, --bg-card
     --accent            ← --accent-highlight   (legacy name, still in use)

   ── One deliberate value change ──────────────────────────────────────────
   --text-muted was #6b7280 (≈3.9:1 on --bg-primary — fails WCAG AA) and is
   lifted to #8b93a8 (≥4.6:1). It is used platform-wide for meta text, hints
   and empty states. DO NOT REVERT.
   ========================================================================== */

:root {
  /* ── Surfaces ─────────────────────────────────────────────────────────── */
  --bg-primary: #0f1117;
  --bg-secondary: #1a1d27;
  --bg-tertiary: #242833;
  --bg-hover: #2a2f3d;
  --border-color: #2e3344;

  /* Aliases healing existing broken references — see header. */
  --surface: var(--bg-secondary);
  --bg-card: var(--bg-secondary);

  /* ── Text ─────────────────────────────────────────────────────────────── */
  --text-primary: #e4e6f0;
  --text-secondary: #9ca3b8;
  --text-muted: #8b93a8; /* lifted from #6b7280 for WCAG AA — do not revert */
  --text-bright: #f4f6fc;

  /* ── Accent ───────────────────────────────────────────────────────────── */
  --accent: #3b82f6;
  --accent-hover: #2563eb;
  --accent-highlight: var(--accent); /* legacy alias — must keep working */

  /* ── Semantic ─────────────────────────────────────────────────────────── */
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
  --info: #60a5fa;

  /* ── Shape ────────────────────────────────────────────────────────────── */
  --radius-s: 4px;
  --radius-m: 8px;
  --radius-card: 10px;
  --radius-pill: 999px;

  /* ── Space ────────────────────────────────────────────────────────────── */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;

  /* ── Type ─────────────────────────────────────────────────────────────────
     Inter and Lora are named here so the tokens need no edit once the fonts
     are self-hosted (roadmap Phase 1, asset workstream). Until then each
     stack falls through to a system face — nothing renders unstyled. */
  --font-ui: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, sans-serif;
  --font-reading: 'Lora', Georgia, 'Times New Roman', serif;
  --font-mono: ui-monospace, 'Fira Code', 'SFMono-Regular', Consolas,
    'Liberation Mono', monospace;

  /* ── Focus ────────────────────────────────────────────────────────────────
     Applied as `outline: var(--focus-ring)` on every interactive element. */
  --focus-ring: 2px solid var(--accent);
}
