/* SPIRITANIMAL design-system.css — extracted from welcome.html */
/* BG: #0d150f (deep forest green), buttons: gold #FFD700 on dark green */
/* Fonts: Bodoni Moda (headings) / Manrope (body) / Space Grotesk (labels) */

@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,wght@6..96,500;6..96,600;6..96,700&family=Manrope:wght@400;500;600&family=Space+Grotesk:wght@500&display=swap');

html, body {
  background-color: #0d150f !important;
  background-image: radial-gradient(circle at 50% 0%, rgba(184, 204, 184, 0.06) 0%, transparent 60%) !important;
  color: #dbe5db !important;
  font-family: 'Manrope', sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Bodoni Moda', serif !important;
  color: #dbe5db !important;
}

button.cta-btn,
button.cta-button,
a.cta-btn,
.cta-button,
button[id*="cta"],
button[id*="next"],
button[id*="continue"],
button[id*="Btn"],
button[id*="Button"],
button[id*="next-btn"],
#vfc button {
  background: #FFD700 !important;
  color: #0d150f !important;
  font-family: 'Manrope', sans-serif !important;
  font-weight: 700 !important;
  box-shadow: 0 0 24px rgba(255, 215, 0, 0.3) !important;
  border: none !important;
}

button.cta-button:disabled,
button[id*="next"]:disabled,
button[id*="next-btn"]:disabled,
button[id*="Btn"]:disabled,
button[id*="Button"]:disabled {
  background: rgba(255, 215, 0, 0.2) !important;
  color: rgba(219, 229, 219, 0.3) !important;
  box-shadow: none !important;
}

.option-card,
.glass-card,
.glass-panel,
.sheen-effect,
.element-card {
  background: rgba(45, 54, 47, 0.4) !important;
  border-color: rgba(166, 124, 82, 0.2) !important;
}
.option-card.selected,
.element-card.selected,
.glass-card.selected {
  border-color: #FFD700 !important;
  background: rgba(129, 86, 0, 0.2) !important;
}

.text-primary { color: #f6bc64 !important; }
a { color: #f6bc64 !important; }

.progress-fill, .progress-bar-fill {
  background: linear-gradient(90deg, #815600, #FFD700) !important;
}

/* === CTA CLICK-FIX (g4 2026-05-31) === */
button.cta-btn,
button.cta-button,
a.cta-btn,
.cta-button,
button[id*='cta'],
button[id*='next'],
button[id*='continue'],
button[id*='Btn'],
button[id*='Button'],
button[id*='next-btn'],
#vfc button {
  cursor: pointer !important;
  pointer-events: auto !important;
  display: inline-flex !important;
}
button.cta-btn > *,
button.cta-button > *,
a.cta-btn > *,
.cta-button > *,
button[id*='cta'] > *,
button[id*='next'] > *,
button[id*='continue'] > *,
button[id*='Btn'] > *,
button[id*='Button'] > * {
  pointer-events: none !important;
}

/* === g3 ligature fix 2026-05-31 === */
/* Restore Material Symbols font-family overridden by design-system body/span rules */
.material-symbols-outlined,
.material-symbols-rounded,
.material-symbols-sharp,
span.material-symbols-outlined,
span.material-symbols-rounded,
span.material-symbols-sharp {
  font-family: "Material Symbols Outlined" !important;
  font-weight: normal !important;
  font-style: normal !important;
  font-size: inherit;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

