:root {
  /* ── Surfaces ── */
  --dark-surface:   #111111;
  --dark-card:      #1A1A1A;
  --dark-elevated:  #232323;
  --cream:          #F5F0E8;
  --cream-deep:     #EDE6D6;
  --ivory:          #FFFCF9;

  /* ── Gold ── */
  --gold:           #C5A059;
  --gold-light:     #D4B06A;
  --gold-pale:      rgba(197, 160, 89, 0.12);
  --gold-border:    rgba(197, 160, 89, 0.25);

  /* ── Text — Dark World ── */
  --dark-body:      rgba(240, 236, 228, 0.88);
  --dark-overline:  rgba(197, 160, 89, 0.90);
  --dark-italic:    rgba(197, 160, 89, 0.82);
  --dark-muted:     rgba(240, 236, 228, 0.60);

  /* ── Text — Cream World ── */
  --cream-body:     #291D1E;
  --cream-muted:    #6A6A6A;
  --cream-gold:     #876424;

  /* ── Semantic ── */
  --error:          #8B2A2A;

  /* ── Typography ── */
  --font-serif:     'Cormorant Garamond', Georgia, serif;
  --font-script:    'Clicker Script', cursive;
  --font-sans:      'DM Sans', system-ui, sans-serif;

  --text-xs:   0.625rem;
  --text-sm:   0.75rem;
  --text-base: 0.875rem;
  --text-md:   1rem;
  --text-lg:   1.25rem;
  --text-xl:   1.75rem;
  --text-2xl:  2.5rem;

  /* ── Motion ── */
  --dur-fast:   250ms;
  --dur-base:   400ms;
  --dur-reveal: 700ms;
  --dur-hero:   900ms;
  --dur-page:   500ms;
  --stagger:    130ms;
  --ease:       cubic-bezier(0.2, 0.9, 0.2, 1);
  --ease-in:    cubic-bezier(0.4, 0, 1, 1);

  /* ── Spacing ── */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;

  /* ── Radii ── */
  --radius-sm:   2px;
  --radius-pill: 40px;

  /* ── Tab bar ── */
  --tab-height: 64px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast:   0ms;
    --dur-base:   0ms;
    --dur-reveal: 0ms;
    --dur-hero:   0ms;
    --dur-page:   0ms;
  }
}