:root{
  /* ── ground ─────────────────────────────── */
  --void:        #0A0916;
  --void-lift:   #131028;
  --void-deep:   #060512;

  /* ── signal ─────────────────────────────── */
  --zhoomer:     #7C5CFF;   /* primary   */
  --zhoomer-hi:  #9C6BFF;   /* hover     */
  --zhoomer-lo:  #5A3FD9;   /* pressed   */
  --bloom:       #FF3D9A;   /* release   */
  --spark:       #FFC46B;   /* active    */
  --neural:      #22D3EE;   /* code/sys  */
  --alarm:       #FF6B6B;   /* error     */
  --ok:          #4ADE80;

  /* ── text ───────────────────────────────── */
  --text:        #EDE9FF;
  --text-dim:    #B8B0D9;
  --muted:       #7A7499;
  --faint:       #4A4560;

  /* ── edges ──────────────────────────────── */
  --edge:        rgba(124,92,255,.18);
  --edge-hi:     rgba(124,92,255,.34);
  --edge-bloom:  rgba(255,61,154,.30);

  /* ── glass ──────────────────────────────── */
  --glass:       linear-gradient(160deg,
                   rgba(124,92,255,.10),
                   rgba(10,9,22,.72));
  --glass-hi:    linear-gradient(160deg,
                   rgba(156,107,255,.16),
                   rgba(19,16,40,.80));

  /* ── glow ───────────────────────────────── */
  --glow-zhoomer: 0 0 24px rgba(124,92,255,.45);
  --glow-bloom:   0 0 32px rgba(255,61,154,.40);
  --lift:         0 8px 32px rgba(0,0,0,.45),
                  inset 0 1px 0 rgba(255,255,255,.05);
  --lift-hi:      0 12px 40px rgba(0,0,0,.55),
                  inset 0 1px 0 rgba(255,255,255,.08);

  /* ── radii ──────────────────────────────── */
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* ── space (4pt grid) ───────────────────── */
  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;
  --s-4: 16px;  --s-5: 20px;  --s-6: 24px;
  --s-8: 32px;  --s-10: 40px; --s-12: 48px;
  --s-16: 64px;

  /* ── type ───────────────────────────────── */
  --f-display: 'Space Grotesk', system-ui, sans-serif;
  --f-body:    'Inter', system-ui, -apple-system, sans-serif;
  --f-mono:    'JetBrains Mono', ui-monospace, Menlo, monospace;

  --t-hero:   clamp(28px, 7vw, 40px);
  --t-h1:     24px;
  --t-h2:     19px;
  --t-body:   15px;
  --t-small:  13px;
  --t-micro:  11px;

  --lh-tight: 1.15;
  --lh-body:  1.6;
  --track-wide: .06em;

  /* ── motion ─────────────────────────────── */
  --e-out:    cubic-bezier(.22,.61,.36,1);
  --e-spring: cubic-bezier(.34,1.56,.64,1);
  --e-snap:   cubic-bezier(.4,0,.2,1);

  --d-fast:   140ms;
  --d-base:   240ms;
  --d-slow:   420ms;
  --d-bloom:  700ms;

  /* ── layout ─────────────────────────────── */
  --composer-h:   52px;
  --composer-hi: 120px;
  --header-h:     56px;
  --drawer-w:    300px;
}

@media (prefers-reduced-motion: reduce){
  :root{
    --d-fast: 1ms; --d-base: 1ms; --d-slow: 1ms; --d-bloom: 1ms;
    --e-spring: linear;
  }
}