:root {
  /* ── Color: Browns ── */
  --color-brown-900: #1e130a;
  --color-brown-700: #3d2b1a;
  --color-brown-600: #5a3e28;
  --color-brown-400: #8a6845;

  /* ── Color: Golds ── */
  --color-gold-500: #c8a96e;
  --color-gold-300: #dbbf87;

  /* ── Color: Parchment ── */
  --color-parchment-100: #f6edd8;
  --color-parchment-200: #e5d4b4;

  /* ── Color: Forest ── */
  --color-forest-900: #243d25;
  --color-forest-700: #34593a;
  --color-forest-500: #4d7c52;

  /* ── Semantic: Text ── */
  --text-primary: #1a0f06;
  --text-secondary: #4a3320;
  --text-muted: #7a5c3a;
  --text-on-dark: var(--color-parchment-100);
  --text-on-dark-muted: rgba(246, 237, 216, 0.72);
  --text-on-dark-faint: rgba(246, 237, 216, 0.55);
  --text-on-dark-ghost: rgba(246, 237, 216, 0.4);
  --text-accent: var(--color-gold-500);
  --text-accent-light: var(--color-gold-300);

  /* ── Semantic: Surfaces ── */
  --surface-dark: var(--color-brown-900);
  --surface-mid: var(--color-brown-700);
  --surface-page: var(--color-parchment-100);
  --surface-border: var(--color-parchment-200);

  /* ── Semantic: Accents ── */
  --accent-primary: var(--color-gold-500);
  --accent-light: var(--color-gold-300);
  --accent-forest: var(--color-forest-700);
  --accent-forest-light: var(--color-forest-500);

  /* ── Overlay ── */
  --overlay-dark: rgba(16, 8, 2, 0.22);
  --overlay-card: rgba(255, 252, 245, 0.40);
  --overlay-card-hover: rgba(255, 252, 245, 0.55);
  --overlay-reunion: rgba(255, 252, 245, 0.45);

  /* ── Borders ── */
  --border-gold: 2px solid var(--color-gold-500);
  --border-gold-subtle: 1px solid rgba(200, 169, 110, 0.45);
  --border-gold-faint: 1px solid rgba(200, 169, 110, 0.3);

  /* ── Shadows ── */
  --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.10);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.14);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.20);
  --shadow-heavy: 0 10px 40px rgba(0, 0, 0, 0.55);

  /* ── Typography ── */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'Lora', Georgia, serif;

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

  /* ── Transitions ── */
  --transition-fast: 0.2s ease;
  --transition-med: 0.24s ease;
}