/* S8 tokens (clean rebuild) */
:root{
  --s8-bg: #0b0d10;
  --s8-surface: #13171c;
  --s8-surface-2: #1a1f26;
  --s8-text: #f4f1e8;
  --s8-muted: #b3aa99;
  --s8-border: rgba(244, 241, 232, .14);
  --s8-border-strong: rgba(244, 241, 232, .26);
  --s8-accent: #d4af37;
  --s8-accent-rgb: 212, 175, 55;
  --s8-accent-hover: #e2c55c;
  --s8-accent-contrast: #0b0d10;
  /* Proportional geometry: controls < cards < large panels. */
  --s8-radius-xs: 3px;
  --s8-radius-sm: clamp(4px, .4vw, 6px);
  --s8-radius-md: clamp(8px, .7vw, 10px);
  --s8-radius-lg: clamp(12px, 1vw, 16px);
  --s8-shadow-card: 0 6px 20px rgba(0, 0, 0, .45);
  --s8-shadow-hero: 0 24px 60px rgba(0, 0, 0, .6);
  --s8-space-section: clamp(48px, 6vw, 88px);
  --s8-container: 1200px;
  --primary: #d4af37;
  --primary-rgb: 212, 175, 55;
  --primary-hover: #e2c55c;
  --accent: var(--primary);
  --bg: #0b0d10;
  --surface: #13171c;
  --surface-2: #1a1f26;
  --text: #f4f1e8;
  --muted: #b3aa99;
  --c-muted: #b3aa99;
  --border: rgba(244, 241, 232, .14);
  --shadow: var(--s8-shadow-card);
  --radius: var(--s8-radius-md);
  --radius-sm: var(--s8-radius-sm);
  --cyp-radius: var(--s8-radius-md);
  --cyp-radius-sm: var(--s8-radius-sm);
  --dag-field-radius: var(--s8-radius-sm);
  --c-bg: #0b0d10;
  --c-text: #f4f1e8;
  --c-border: rgba(244, 241, 232, .14);
  --c-accent: var(--primary);
  --c-accent-hover: var(--primary-hover);
  --cyp-bg: #13171c;
  --cyp-soft: #0f1318;
  --cyp-text: #f4f1e8;
  --cyp-muted: #b3aa99;
  --cyp-border: rgba(244, 241, 232, .14);
  --cyp-shadow: var(--s8-shadow-card);
  --cyp-green: var(--primary);
  --page-bg: #0f1318;
  --page-text: #f4f1e8;
  --pagi-radius: var(--s8-radius-sm);
  --pagi-bg: #13171c;
  --pagi-bg-hover: rgba(var(--s8-accent-rgb), .14);
  --pagi-text: #f4f1e8;
  --pagi-muted: #b3aa99;
  --pagi-border: rgba(244, 241, 232, .16);
  --pagi-shadow: 0 6px 20px rgba(0, 0, 0, .4);
  --pagi-accent: var(--primary);
  --pagi-accent-rgb: 212, 175, 55;
}