:root {
  --bg: #070709;
  --surface: rgba(18, 18, 22, 0.6);
  --border-hairline: rgba(255, 255, 255, 0.07);
  --border-active: rgba(255, 255, 255, 0.22);
  
  --text-primary: #f4f4f5;
  --text-secondary: #a1a1aa;
  --text-tertiary: #52525b;
  
  --accent: #ffffff;
  --accent-glow: rgba(255, 255, 255, 0.12);
  --radius-pill: 9999px;
  
  --shadow-subtle: 0 30px 60px -15px rgba(0, 0, 0, 0.95);
}

html[data-theme="white"] {
  --accent: #ffffff;
  --accent-glow: rgba(255, 255, 255, 0.12);
}

html[data-theme="gold"] {
  --accent: #fbbf24;
  --accent-glow: rgba(251, 191, 36, 0.15);
}

html[data-theme="emerald"] {
  --accent: #10b981;
  --accent-glow: rgba(16, 185, 129, 0.15);
}

html[data-theme="cyan"] {
  --accent: #38bdf8;
  --accent-glow: rgba(56, 189, 248, 0.15);
}