:root {
  color-scheme: dark;
  --color-background: #1c1c1d;
  --color-surface: #252728;
  --color-surface-raised: #242526;
  --color-surface-soft: #3b3c3e;
  --color-border: #3e4042;
  --color-text: #e4e6eb;
  --color-muted: #b0b3b8;
  --color-icon: #b0b3b8;
  --color-icon-subtle: #8a8d91;
  --color-icon-active: #d4af37;
  --color-brand-gold: #d4af37;
  --color-gold: #d4af37;
  --color-gold-text: #d4af37;
  --color-gold-hover: #d4af37;
  --color-on-gold: #1c1e21;
  --font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif;
  --font-weight-regular: 400;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --icon-style: outline;
  --icon-stroke-width: 1.8;
  --icon-linecap: round;
  --icon-linejoin: round;
  --shadow-card: 0 12px 32px rgba(0, 0, 0, 0.28);
  --radius-card: 16px;
  --radius-control: 10px;
}

:root[data-theme="light"] {
  color-scheme: light;
  --color-background: #f2f4f7;
  --color-surface: #ffffff;
  --color-surface-raised: #ffffff;
  --color-surface-soft: #e4e6eb;
  --color-border: #d0d3d7;
  --color-text: #1c1e21;
  --color-muted: #65676b;
  --color-icon: #65686c;
  --color-icon-subtle: #8a8d91;
  --color-icon-active: #d4af37;
  --color-brand-gold: #d4af37;
  --color-gold: #d4af37;
  --color-gold-text: #d4af37;
  --color-gold-hover: #d4af37;
  --color-on-gold: #1c1e21;
  --shadow-card: 0 8px 24px rgba(28, 30, 33, 0.16);
}