/* css/variables.css — Complete token system */
:root {
  /* ── Colors ─────────────────────────────────────────────── */
  --bg-base:              #080808;
  --bg-paper:             #0d0c0a;
  --bg-raised:            #111010;

  --ink-primary:          rgba(235, 228, 215, 0.95);
  --ink-secondary:        rgba(235, 228, 215, 0.65);
  --ink-tertiary:         rgba(235, 228, 215, 0.40);
  --ink-accent:           rgba(180, 210, 190, 0.90);

  --surface:              rgba(235, 228, 215, 0.03);
  --surface-hover:        rgba(235, 228, 215, 0.06);
  --border:               rgba(235, 228, 215, 0.12);
  --border-hover:         rgba(235, 228, 215, 0.22);

  --peak-warm:            rgba(255, 200, 120, 0.80);
  --peak-cool:            rgba(180, 210, 190, 0.60);
  --peak-rare:            rgba(200, 170, 255, 0.50);

  /* ── Typography ─────────────────────────────────────────── */
  --font-display:         'Zodiak', Georgia, serif;
  --font-ui:              'Satoshi', system-ui, sans-serif;
  --font-mono:            'Geist Mono', 'Courier New', monospace;

  /* ── Spacing (6pt base) ──────────────────────────────────── */
  --space-1:   3px;
  --space-2:   6px;
  --space-3:   12px;
  --space-4:   18px;
  --space-6:   24px;
  --space-8:   36px;
  --space-12:  48px;
  --space-16:  72px;

  /* ── Border Radius ──────────────────────────────────────── */
  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-tile: 8px;

  /* ── Shadows ────────────────────────────────────────────── */
  --shadow-raised:  0 2px 12px rgba(0,0,0,0.6), 0 1px 0 rgba(235,228,215,0.04) inset;
  --shadow-panel:   0 8px 40px rgba(0,0,0,0.7);
  --shadow-tile:    0 4px 20px rgba(0,0,0,0.5);
  --shadow-peak:    0 0 30px rgba(255,200,120,0.15), 0 0 60px rgba(255,200,120,0.06);

  /* ── Blur ───────────────────────────────────────────────── */
  --blur-ui:    blur(16px) saturate(140%);
  --blur-heavy: blur(24px);

  /* ── Easings ────────────────────────────────────────────── */
  --ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-entry:   cubic-bezier(0.34, 1.26, 0.64, 1);
  --ease-out:     cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-precise: cubic-bezier(0.16, 1, 0.3, 1);

  /* ── Durations ──────────────────────────────────────────── */
  --dur-fast:   120ms;
  --dur-base:   250ms;
  --dur-slow:   400ms;
  --dur-slower: 700ms;

  /* ── Layout ─────────────────────────────────────────────── */
  --header-height: 56px;
  --hud-height:    76px;
  --filter-height: 56px;
}