/* Shah Rukh Khan · Halawi Media birthday · visual language override
   Deep black / midnight / gold. Not wine. Not rose. */

:root{
  --deep:#05080f;
  --ink:#02040a;
  --gold:#e2bd72;
  --gold-2:#f3dca4;
  --gold-3:#a87a35;
  --ivory:#f6f1e8;
  --ivory-2:#ddd4c4;
  --rose:#c9a66b;
  --rose-2:#8a6a3a;
  --sea:#0c1828;
}

body{
  background:
    radial-gradient(120% 50% at 50% 0%, #12243d 0%, transparent 50%),
    radial-gradient(80% 40% at 80% 100%, #1a0a14 0%, transparent 40%),
    radial-gradient(60% 30% at 15% 60%, rgba(226,189,114,.04) 0%, transparent 50%),
    var(--deep);
}

/* hero — full name needs room */
.hero__name{
  font-size:clamp(42px, 11.5vw, 128px);
  line-height:1.05;
  padding:.08em .15em .12em;
  letter-spacing:.01em;
}
.hero__hb{font-size:clamp(26px, 7vw, 52px);}
.hero__lede{max-width:36ch;}
/* the full name needs a wider column than the base 760px, or "Khan" drops to its own line on desktop */
.hero__inner{max-width:min(1040px, 100%);z-index:1;}
@media (min-width:560px){.hero__name{white-space:nowrap;}}
.hero__halo{
  background:
    radial-gradient(circle, rgba(243,220,164,.22) 0%, rgba(226,189,114,.12) 30%, rgba(18,36,61,.2) 55%, transparent 75%);
  filter:blur(20px);
}
.arms{
  position:absolute;
  left:0;right:0;
  bottom:calc(17% + var(--sab, 0px));
  width:min(94vw, 820px);
  margin:0 auto;
  pointer-events:none;
  opacity:.6;
  z-index:0;
}
.arms__svg{width:100%;height:auto;}

/* chapter atmospheres — film, not sea */
.chapter{
  position:relative;
  padding:clamp(90px, 14vh, 140px) var(--pad);
  overflow:hidden;
}
.act-arrival{
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(226,189,114,.08), transparent 60%),
    linear-gradient(180deg, transparent, rgba(12,24,40,.4));
}
.act-choices{
  background:linear-gradient(180deg, rgba(12,24,40,.4), rgba(26,10,20,.25), transparent);
}
.act-promise{
  background:
    radial-gradient(70% 50% at 50% 30%, rgba(226,189,114,.14), transparent 70%),
    radial-gradient(40% 30% at 80% 70%, rgba(180,140,60,.06), transparent 60%),
    linear-gradient(180deg, transparent, rgba(12,24,40,.3));
}
.act-reign{
  background:linear-gradient(180deg, rgba(12,24,40,.3), transparent);
}
.act-empire{
  background:linear-gradient(180deg, transparent, rgba(12,24,40,.35));
}
.act-return{
  background:
    radial-gradient(60% 40% at 50% 20%, rgba(226,189,114,.12), transparent 70%),
    linear-gradient(180deg, rgba(12,24,40,.25), transparent);
}
.act-king{
  background:linear-gradient(180deg, transparent, rgba(12,24,40,.4));
  text-align:center;
}
.act-king .chapter__body{max-width:680px;}

/* reel cards — darker, more ticket-like */
.frame{
  background:
    radial-gradient(130% 60% at 50% 0%, rgba(226,189,114,.08), transparent 60%),
    linear-gradient(175deg, #141c2c 0%, #0c121c 60%, #080c14 100%);
  border-color:rgba(226,189,114,.28);
}
.frame.f-gold{
  border-color:rgba(226,189,114,.5);
  box-shadow:0 0 0 1px rgba(226,189,114,.15), 0 20px 40px -20px rgba(0,0,0,.5);
}

/* medals & quote */
.medal{
  background:linear-gradient(160deg, rgba(246,241,232,.05), rgba(246,241,232,.01));
  border-color:rgba(226,189,114,.22);
}
.quote{
  background:linear-gradient(150deg, rgba(226,189,114,.1), rgba(12,24,40,.3));
  border-color:rgba(226,189,114,.25);
}

/* cake — navy base instead of wine */
.cake__svg path[fill="#1a2a44"],
.cake__svg path[fill="#243656"]{opacity:.95;}

/* sound button on dark */
.sound{background:rgba(5,8,15,.6);border-color:rgba(226,189,114,.4);}

/* progress bar */
.progress span{background:linear-gradient(90deg, var(--gold-3), var(--gold), var(--gold-2));}

/* reduced motion safety */
@media (prefers-reduced-motion: reduce){
  .arms{opacity:.4;}
}

/* ---------- fixes & polish (added) ---------- */

/* wine-toned leftovers from the base stylesheet -> midnight */
.sound{background:rgba(5,8,15,.6);}
.brand{background:rgba(5,8,15,.34);}
.reel{background:linear-gradient(180deg,transparent,rgba(2,4,10,.6) 20%,rgba(2,4,10,.6) 80%,transparent);}
.reel__viewport::before,.reel__viewport::after{background-color:#04070d;}
.tk__stub::before,.tk__stub::after{background:#05080f;}
.frame--more{background:linear-gradient(170deg,rgba(226,189,114,.2),rgba(18,36,61,.5) 60%,#080c14);}
.btn:not(.btn--ghost),.medal__disc,.poll__ic,.poll__badge{color:#0a1628;}
.btn--ghost{color:var(--gold-2);}
.medal__disc{box-shadow:inset 0 0 0 4px rgba(10,22,40,.18),0 10px 26px -10px rgba(226,189,114,.6);}
.poll__result{background:linear-gradient(150deg,rgba(226,189,114,.2),rgba(18,36,61,.5));}
.endless{background:rgba(2,4,10,.6);}
.endless__strip span{background:linear-gradient(160deg,#16243b,#080c14);}
.footer{background:rgba(2,4,10,.65);}
.progress span{background:linear-gradient(90deg,var(--gold-3),var(--gold),var(--gold-2));}
.quiz__bar span{background:linear-gradient(90deg,var(--gold-3),var(--gold));}

/* centred closing chapter: keep the eyebrow rule centred with the text */
.act-king .chapter__no{justify-content:center;}
.act-king .crown-stage{margin-bottom:28px;}

/* keep the hero art behind the copy on small screens */
@media (max-width:560px){
  .arms{bottom:calc(17% + var(--sab, 0px));opacity:.45;}
  .hero__name{font-size:clamp(46px,15vw,128px);text-wrap:balance;}
}
.scrollcue{white-space:nowrap;}

/* answer / poll / dish surfaces: midnight, not wine */
.opt,.poll__opt{background:rgba(5,8,15,.6);}
.opt:not(:disabled):hover,.poll__opt:not(.sel):hover{background:rgba(18,36,61,.7);}
.poll__opt.sel{background:rgba(226,189,114,.14);}
/* sapphire centre-stone for the crown (was rose) */
.gem.r{fill:#7fa8ee;}
/* year discs read better a touch heavier */
.medal__disc{font-weight:600;}

