:root {
  /* ── Theme tokens — overridden at runtime by App.js from /api/config ── */
  --color-primary:   #6366f1;
  --color-secondary: #f59e0b;
  --color-bg:        #ffffff;
  --color-surface:   #f9fafb;
  --color-border:    #e5e7eb;
  --color-text:      #111827;
  --color-muted:     #6b7280;
  --font-main:       'Inter', sans-serif;

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

  /* ── Border radius ─────────────────────────────────────────────────── */
  --r-sm:   0.25rem;
  --r:      0.5rem;
  --r-lg:   1rem;
  --r-xl:   1.5rem;
  --r-full: 9999px;

  /* ── Shadows ───────────────────────────────────────────────────────── */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
  --shadow:    0 4px 6px -1px rgba(0,0,0,.10), 0 2px 4px -1px rgba(0,0,0,.06);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,.10), 0 4px 6px -2px rgba(0,0,0,.05);
  --shadow-xl: 0 20px 25px -5px rgba(0,0,0,.10), 0 10px 10px -5px rgba(0,0,0,.04);

  /* ── Motion ────────────────────────────────────────────────────────── */
  --t:      200ms ease;
  --t-slow: 400ms ease;

  /* ── Layout ────────────────────────────────────────────────────────── */
  --navbar-h: 64px;
}