/* Design Tokens - Auto-generated */
/* Do not edit directly - modify tokens.json instead */

/* === PRIMITIVES === */
:root {
  --primitive-color-lacquer-500: #8F2436;
  --primitive-color-lacquer-600: #7E1A2B;
  --primitive-color-lacquer-700: #6E0F1E;
  --primitive-color-lacquer-800: #55091A;
  --primitive-color-gold-300: #F1D27A;
  --primitive-color-gold-500: #E8B830;
  --primitive-color-gold-600: #C9973B;
  --primitive-color-cream-50: #FBF3E4;
  --primitive-color-cream-100: #F7E7D3;
  --primitive-color-cream-300: #E4C9A6;
  --primitive-color-ink-600: #5B4033;
  --primitive-color-ink-900: #2A1A14;
  --primitive-color-basil-600: #3F7A3A;
  --primitive-color-chili-500: #C1272D;
  --primitive-color-white: #FFFFFF;
  --primitive-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --primitive-font-body: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --primitive-space-1: 4px;
  --primitive-space-2: 8px;
  --primitive-space-3: 12px;
  --primitive-space-4: 16px;
  --primitive-space-5: 24px;
  --primitive-space-6: 32px;
  --primitive-space-7: 48px;
  --primitive-space-8: 72px;
}

/* === SEMANTIC === */
:root {
  --color-bg-canvas: #6E0F1E;
  --color-bg-deep: #55091A;
  --color-bg-card: #7E1A2B;
  --color-bg-card-hover: #8F2436;
  --color-bg-paper: #F7E7D3;
  --color-bg-paper-alt: #FBF3E4;
  --color-bg-white: #FFFFFF;
  --color-text-on-red: #F7E7D3;
  --color-text-muted-on-red: #E4C9A6;
  --color-text-ink: #2A1A14;
  --color-text-muted-ink: #5B4033;
  --color-accent: #E8B830;
  --color-accent-hover: #F1D27A;
  --color-on-accent: #2A1A14;
  --color-leader: #C9973B;
  --color-leader-ink: rgba(42, 26, 20, 0.35);
  --color-open: #3F7A3A;
  --color-spice: #C1272D;
  --color-hairline-red: rgba(232, 184, 48, 0.5);
  --color-hairline-ink: rgba(42, 26, 20, 0.2);
  --color-focus: #E8B830;
  --typography-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --typography-font-body: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
}

/* === COMPONENTS === */
:root {
  --radius-sm: 3px;
  --radius-md: 10px;
  --container-max: 1200px;
  --nav-height: 64px;
  --outline-offset: 5px;
}