/* Design tokens — single source of truth */
:root {
  /* Color */
  --color-bg:          #060b18;
  --color-surface:     #0d1525;
  --color-surface-2:   #111d33;
  --color-border:      #1e2d4a;
  --color-border-2:    #2a3f5f;
  --color-accent:      #f59e0b;
  --color-accent-dim:  rgba(245, 158, 11, 0.12);
  --color-text:        #f1f5f9;
  --color-text-dim:    #94a3b8;
  --color-muted:       #475569;

  /* Typography */
  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body:    'Syne', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', 'Courier New', monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  3rem;
  --text-6xl:  3.75rem;
  --text-7xl:  4.5rem;

  /* Spacing */
  --space-1:   0.25rem;
  --space-2:   0.5rem;
  --space-3:   0.75rem;
  --space-4:   1rem;
  --space-5:   1.25rem;
  --space-6:   1.5rem;
  --space-8:   2rem;
  --space-10:  2.5rem;
  --space-12:  3rem;
  --space-16:  4rem;
  --space-20:  5rem;
  --space-24:  6rem;
  --space-32:  8rem;

  /* Radius */
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;

  /* Motion */
  --ease-out:       cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out:    cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast:  150ms;
  --duration-base:  250ms;
  --duration-slow:  450ms;
}