/* ==========================================================================
   tokens.css  —  design tokens for the GPT-2 manifestation interface
   Palette: indigo + cyan + violet on near-black ink. No pastel rainbow.
   ========================================================================== */
:root {
  /* Ink & paper */
  --ink:        #0a0e1a;
  --ink-soft:   #1e293b;
  --muted:      #64748b;
  --muted-soft: #94a3b8;
  --paper:      #ffffff;
  --surface:    #f8fafc;
  --surface-2:  #f1f5f9;
  --border:     #e2e8f0;
  --border-2:   #cbd5e1;

  /* Brand — transformer indigo with cyan accent */
  --indigo:     #4f46e5;
  --indigo-d:   #3730a3;
  --indigo-l:   #eef2ff;
  --indigo-2l:  #e0e7ff;
  --cyan:       #06b6d4;
  --cyan-d:     #0e7490;
  --cyan-l:     #ecfeff;
  --violet:     #7c3aed;
  --violet-l:   #f3eaff;

  /* Heat-scale used by the head matrix (low → high importance) */
  --heat-0:     #f1f5f9;
  --heat-1:     #c7d2fe;
  --heat-2:     #818cf8;
  --heat-3:     #6366f1;
  --heat-4:     #4338ca;
  --heat-5:     #1e1b4b;

  /* Semantic */
  --good:       #059669;
  --warn:       #d97706;
  --bad:        #dc2626;

  /* Typography */
  --font-sans:  "Inter", "Inter Tight", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono:  "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;
  --fs-12: 12px;  --fs-13: 13px;  --fs-14: 14px;
  --fs-15: 15px;  --fs-16: 16px;  --fs-18: 18px;
  --fs-20: 20px;  --fs-24: 24px;  --fs-32: 32px;
  --fs-44: 44px;  --fs-56: 56px;

  /* Layout */
  --col-max: 1280px;
  --gap-1: 4px;  --gap-2: 8px;  --gap-3: 12px;
  --gap-4: 16px; --gap-5: 24px; --gap-6: 32px;
  --gap-7: 48px; --gap-8: 64px; --gap-9: 96px;

  /* Radii / shadow / motion */
  --r-1: 4px; --r-2: 8px; --r-3: 12px; --r-4: 16px; --r-pill: 999px;
  --sh-1: 0 1px 2px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.04);
  --sh-2: 0 4px 12px rgba(15,23,42,.08), 0 2px 4px rgba(15,23,42,.04);
  --sh-3: 0 12px 32px rgba(15,23,42,.12), 0 4px 8px rgba(15,23,42,.06);
  --sh-glow: 0 0 0 3px rgba(79,70,229,.15);
  --motion-fast:   140ms cubic-bezier(.4,0,.2,1);
  --motion-base:   240ms cubic-bezier(.4,0,.2,1);
  --motion-slow:   480ms cubic-bezier(.4,0,.2,1);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}