/* =========================================
   SHADOWCAST — Premium Chamber Theme
   Scope: everything under `body.shadowcast`
   Loads after css/style.css and overrides
   CSS custom properties so existing components
   (nav, buttons, cards) re-render in the new
   palette without per-component changes.
   ========================================= */

/* ---- Shadowcast-mode palette ---- */
body.shadowcast {
  /* Backgrounds: deeper indigo-black with warmer cast */
  --bg-primary:      #0a0810;
  --bg-secondary:    #120e1a;
  --bg-card:         #1a1323;
  --bg-card-hover:   #221928;

  /* Accents: violet kept to tie back to base brand; gold → ember */
  --accent:          #a78bfa;
  --accent-light:    #c4b5fd;
  --accent-glow:     rgba(167, 139, 250, 0.18);
  --gold:            #c8432e;           /* ember replaces gold */
  --gold-soft:       rgba(200, 67, 46, 0.25);

  /* Text: bone white instead of lavender */
  --text-primary:    #e8dcc4;
  --text-secondary:  #b5a994;
  --text-muted:      #6e6354;

  /* Borders + glow: ember-tinted */
  --border:          rgba(200, 67, 46, 0.18);
  --border-strong:   rgba(200, 67, 46, 0.42);
  --shadow-glow:     0 0 40px rgba(200, 67, 46, 0.15);

  /* New Shadowcast-only tokens */
  --ember:           #c8432e;
  --ember-dim:       #7a2a1c;
  --ember-glow:      rgba(200, 67, 46, 0.35);
  --bone:            #e8dcc4;
  --bone-dim:        #a89a82;
  --heading-font:    'IM Fell English', 'Cormorant Garamond', Georgia, serif;
  --rune-glow:       0 0 20px rgba(232, 220, 196, 0.3);
}

/* ---- Suppress the base starfield ::before on Shadowcast pages ---- */
body.shadowcast::before {
  background-image: none;
}

/* ---- Serif headings inside Shadowcast chamber ---- */
body.shadowcast h1,
body.shadowcast h2,
body.shadowcast h3,
body.shadowcast h4 {
  font-family: var(--heading-font);
  font-weight: 500;           /* serif looks heavier — tone it down */
  letter-spacing: 0.005em;    /* serif needs less negative tracking */
}

/* ---- Section tags / small caps get an ember hue ---- */
body.shadowcast .section-tag {
  color: var(--ember);
  border-color: var(--border-strong);
}

/* ---- Nav logo sparkle: ember in the chamber, matching the register ---- */
body.shadowcast .logo-symbol {
  color: var(--ember);
  text-shadow: 0 0 10px var(--ember-glow), 0 0 2px rgba(232, 220, 196, 0.4);
}

/* ---- Primary buttons inside the chamber: match the "Begin the forging"
        ember gradient so all primary CTAs (gate unlocks, reveal hand-offs,
        carry-forward) read as one family of forge buttons. ---- */
body.shadowcast .btn-primary {
  background: linear-gradient(135deg, var(--ember), var(--ember-dim));
  color: var(--bone);
  border: 1px solid var(--ember);
  box-shadow: 0 0 24px var(--ember-glow);
  font-family: var(--heading-font);
  letter-spacing: 0.02em;
}
body.shadowcast .btn-primary:hover {
  background: linear-gradient(135deg, var(--ember), var(--ember-dim));
  color: var(--bone);
  box-shadow: 0 0 34px rgba(200, 67, 46, 0.55);
  transform: translateY(-1px);
}

/* ---- Secondary buttons inside the chamber: ember outline to stay in family ---- */
body.shadowcast .btn-secondary {
  border-color: var(--border-strong);
  color: var(--bone);
  font-family: var(--heading-font);
  letter-spacing: 0.02em;
}
body.shadowcast .btn-secondary:hover {
  background: rgba(200, 67, 46, 0.08);
  border-color: var(--ember);
  color: var(--bone);
}

/* ---- Tier badge: premium badge goes bone-on-ember ---- */
body.shadowcast .tier-badge.premium {
  background: linear-gradient(135deg, var(--ember), var(--ember-dim));
  color: var(--bone);
}

/* ---- Rune glyphs — used anywhere an SVG rune or Unicode rune appears ---- */
body.shadowcast .rune-glyph {
  color: var(--bone);
  filter: drop-shadow(0 0 8px var(--ember-glow));
  transition: filter var(--transition);
}
body.shadowcast .rune-glyph:hover {
  filter: drop-shadow(0 0 16px var(--bone));
}

/* ---- Shadowcast hero: primal-serious tone ---- */
body.shadowcast .page-hero h1 {
  color: var(--bone);
  text-shadow: 0 0 30px rgba(232, 220, 196, 0.15);
}
body.shadowcast .page-hero p {
  color: var(--bone-dim);
}

/* ---- Cards in Shadowcast mode: ember border on hover ---- */
body.shadowcast .card:hover,
body.shadowcast .pricing-card:hover {
  border-color: var(--border-strong);
  box-shadow: 0 8px 32px rgba(200, 67, 46, 0.18);
}

/* ---- Storm warning widget (Phase 4, styled ahead of time) ---- */
body.shadowcast .storm-warning {
  background: linear-gradient(135deg, rgba(200, 67, 46, 0.08), rgba(167, 139, 250, 0.04));
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  padding: 18px 22px;
  color: var(--bone);
}
body.shadowcast .storm-warning .storm-date {
  font-family: var(--heading-font);
  color: var(--ember);
  font-size: 1.15rem;
}

/* ---- WebGL canvas: same stacking rules as bg-webgl.js ---- */
body.shadowcast #storm-canvas {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
body.shadowcast .page-wrapper {
  position: relative;
  z-index: 1;
}