:root {
  /* Neutrals */
  --c-bg-0:   #070910;
  --c-bg-1:   #0d1117;
  --c-bg-2:   #131a28;
  --c-bg-3:   #192236;
  --c-bg-4:   #1f2b44;

  --c-border-0: rgba(255,255,255,0.03);
  --c-border-1: rgba(255,255,255,0.07);
  --c-border-2: rgba(255,255,255,0.13);
  --c-border-3: rgba(255,255,255,0.22);

  --c-text-0: #eef2ff;
  --c-text-1: #8fa4cc;
  --c-text-2: #4b6080;

  /* Blue */
  --c-blue-800: #1e3a8a;
  --c-blue-700: #1d4ed8;
  --c-blue-600: #2563eb;
  --c-blue-500: #3b82f6;
  --c-blue-400: #60a5fa;
  --c-blue-300: #93c5fd;

  /* Red */
  --c-red-800:  #7f1d1d;
  --c-red-700:  #b91c1c;
  --c-red-600:  #dc2626;
  --c-red-500:  #e63946;
  --c-red-400:  #f87171;
  --c-red-300:  #fca5a5;

  /* Purple (midpoint) */
  --c-purple-600: #7c3aed;
  --c-purple-500: #8b5cf6;

  /* Semantic */
  --c-success: #10b981;
  --c-warning: #f59e0b;
  --c-error:   #ef4444;

  /* Brand gradients */
  --grad-brand:      linear-gradient(135deg, #e63946 0%, #7c3aed 50%, #2563eb 100%);
  --grad-brand-h:    linear-gradient(90deg,  #e63946 0%, #7c3aed 50%, #2563eb 100%);
  --grad-brand-soft: linear-gradient(135deg,
                       rgba(230,57,70,0.15) 0%,
                       rgba(124,58,237,0.08) 50%,
                       rgba(37,99,235,0.15) 100%);
  --grad-blue: linear-gradient(135deg, #1d4ed8, #3b82f6);
  --grad-red:  linear-gradient(135deg, #b91c1c, #e63946);

  /* Shadows */
  --shadow-sm:   0 1px 3px rgba(0,0,0,0.45);
  --shadow-md:   0 4px 16px rgba(0,0,0,0.5);
  --shadow-lg:   0 8px 32px rgba(0,0,0,0.6);
  --glow-blue:   0 0 0 1px rgba(37,99,235,0.5), 0 0 20px rgba(37,99,235,0.25);
  --glow-brand:  0 0 0 1px rgba(124,58,237,0.4), 0 0 24px rgba(124,58,237,0.2);

  /* Spacing (4px base) */
  --sp-1:  4px;  --sp-2:  8px;   --sp-3:  12px;
  --sp-4:  16px; --sp-5:  20px;  --sp-6:  24px;
  --sp-7:  28px; --sp-8:  32px;  --sp-10: 40px;
  --sp-12: 48px; --sp-16: 64px;  --sp-20: 80px;

  /* Radius */
  --r-xs:   4px;
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;
  --r-xl:   24px;
  --r-pill: 9999px;

  /* Typography */
  --font-sans: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  --text-xs:   0.6875rem;
  --text-sm:   0.8125rem;
  --text-base: 0.9375rem;
  --text-md:   1.0625rem;
  --text-lg:   1.25rem;
  --text-xl:   1.5rem;
  --text-2xl:  1.875rem;

  /* Transitions */
  --t-fast:   100ms ease;
  --t-base:   180ms ease;
  --t-slow:   280ms ease;
  --t-spring: 260ms cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-smooth: 220ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Layout */
  --header-h:    64px;
  --controls-w:  400px;
  --gap:         24px;
  --site-max:    1240px;
  --site-px:     24px;
  --panel-px:    24px;
  --panel-py:    20px;
  }