/* BIRTHDAY design-system — extracted from welcome.html */
html, body {
  background: #0d0a14 !important;
  background-color: #0d0a14 !important;
  color: #ede8f5 !important;
  font-family: 'Hanken Grotesk', sans-serif !important;
}
:root {
  --ds-bg: #0d0a14;
  --ds-surface: #1c1428;
  --ds-accent: #c084fc;
  --ds-accent-gradient: linear-gradient(to right, #7e22ce, #c084fc);
  --ds-cta-text: #0f0018;
  --ds-font-display: 'Playfair Display', serif;
  --ds-font-body: 'Hanken Grotesk', sans-serif;
  --ds-on-surface: #ede8f5;
  --ds-on-surface-variant: #cdc4db;
  --ds-glass-bg: rgba(29,20,45,0.7);
  --ds-glass-border: rgba(192,132,252,0.15);
}
/* CTA buttons */
button.btn-glow,
button.option-next,
button[class*='bg-gradient'] {
  background: linear-gradient(to right, #7e22ce, #c084fc) !important;
  color: #0f0018 !important;
}
/* Glass cards */
.glass-card, .option-card {
  background: rgba(29,20,45,0.7) !important;
  border: 1.5px solid rgba(192,132,252,0.15) !important;
}
.glass-card.selected, .option-card.selected, .option-card:hover {
  border-color: #c084fc !important;
}
/* Accent text */
.text-primary, [class*='text-primary'] {
  color: #c084fc !important;
}

/* LIGATURE FIX: prevent body/span font-family override from breaking Material Symbols icons */
span.material-symbols-outlined,
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined' !important;
  font-weight: normal !important;
  font-style: normal !important;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal !important;
  text-transform: none !important;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}
