.stage{position:relative;height:100vh;height:100svh;min-height:640px;overflow:hidden;
  background:radial-gradient(58% 72% at 64% 40%,#8148e0 0%,#5d2bb3 36%,#36147d 70%,var(--p900) 100%)}
.spot{position:absolute;left:44%;top:-10%;width:42%;height:92%;border-radius:50%;background:radial-gradient(closest-side,rgba(190,150,255,.38),transparent 72%);filter:blur(20px);pointer-events:none}
.floor{position:absolute;left:0;right:0;bottom:0;height:38%;background:radial-gradient(64% 90% at 64% 100%,rgba(176,128,255,.5),transparent 72%);pointer-events:none}
.grain{position:absolute;inset:0;opacity:.09;mix-blend-mode:overlay;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
#gl{position:absolute;pointer-events:none;opacity:0;transition:opacity .45s}
#gl.on{opacity:1}
.poster{position:absolute;pointer-events:none;object-fit:contain;transition:opacity .45s;user-select:none}
.poster.off{opacity:0}
.shadow{position:absolute;height:34px;border-radius:50%;background:radial-gradient(closest-side,rgba(14,0,40,.6),transparent);filter:blur(4px);pointer-events:none}

/* left rail */
.vert{position:absolute;z-index:2;left:max(18px,env(safe-area-inset-left,0px));top:96px;bottom:300px;display:flex;flex-direction:column;align-items:center;gap:14px;font:500 10.5px/1 var(--sans);letter-spacing:.22em;color:var(--faint);pointer-events:none}
.vert span{writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap}
.vert i{flex:1;width:1px;background:linear-gradient(var(--line),transparent)}
.social{position:absolute;z-index:3;left:max(18px,env(safe-area-inset-left,0px));bottom:calc(var(--mq) + 18px);display:grid;gap:10px}
.social a{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:rgba(28,9,66,.4);font:700 10px/1 var(--sans);letter-spacing:.08em;text-decoration:none;color:var(--soft)}
.social a:hover{border-color:var(--yellow);color:var(--yellow)}

/* hero copy */
.copy{position:absolute;z-index:3;left:max(72px,calc(env(safe-area-inset-left,0px) + 72px));bottom:calc(var(--mq) + 26px);width:min(420px,44vw)}
.stage .chip{display:inline-flex;align-items:center;gap:9px;padding:7px 13px 7px 9px;border-radius:999px;background:rgba(28,9,66,.6);border:1px solid var(--line);font-size:12.5px;font-weight:700;margin-bottom:22px}
.stage .chip i{width:11px;height:11px;border-radius:50%;background:#c8ee5a;box-shadow:0 0 0 4px rgba(200,238,90,.22)}
.stage h1{margin:0 0 18px;font-weight:400;line-height:.98}
.stage h1 .l1{display:block;white-space:nowrap;font:400 clamp(54px,7.6vw,98px)/.95 var(--display);letter-spacing:-.005em;text-transform:none}
.stage h1 .l2{display:block;font:italic 400 clamp(60px,8.6vw,112px)/.95 var(--serif);color:var(--yellow);margin-top:2px}
.stage .lede{margin:0 0 26px;color:var(--soft);font-size:15.5px;line-height:1.55;max-width:38ch}
.cta-row{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.btn-big{display:inline-flex;align-items:center;gap:20px;background:var(--yellow);color:var(--yellow-ink);text-decoration:none;font-weight:700;font-size:17px;padding:9px 9px 9px 22px;border-radius:14px;box-shadow:0 14px 34px -14px rgba(243,223,91,.85);transition:transform .15s}
.btn-big:hover{transform:translateY(-2px)}
.btn-big b{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--yellow-ink);color:var(--yellow)}
.btn-big svg{width:15px;height:15px}
.watch{display:inline-flex;align-items:center;gap:10px;background:none;border:0;padding:0;font-weight:700;font-size:14.5px}
.watch svg{width:17px;height:17px}
.watch:hover{color:var(--yellow)}

/* readings */
.readings{position:absolute;z-index:4;top:calc(92px + env(safe-area-inset-top,0px));right:max(26px,env(safe-area-inset-right,0px));width:212px;padding:14px 16px 14px;border-radius:18px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.r-head{display:flex;align-items:center;gap:8px;font:700 10.5px/1 var(--sans);letter-spacing:.14em;color:var(--soft)}
.r-head .dot{width:7px;height:7px;border-radius:50%;background:var(--yellow);box-shadow:0 0 10px var(--yellow);animation:blink 1.6s infinite}
.r-head i{margin-left:auto;font-style:normal;color:var(--yellow)}
.r-body{display:flex;align-items:center;gap:12px;margin:12px 0 10px}
#dial{width:104px;height:104px;flex:none}
.r-look small,.r-foot small{display:block;font-size:11px;color:var(--faint);margin-bottom:2px}
.r-look em,.r-foot em{display:block;font:italic 400 26px/1 var(--serif);color:#fff}
.r-look em{min-height:52px}
.r-foot{display:flex;align-items:flex-end;justify-content:space-between;padding-top:10px;border-top:1px solid var(--line)}
.bars{display:flex;gap:4px;align-items:flex-end;height:24px}
.bars i{width:6px;border-radius:2px;background:rgba(255,255,255,.2);transition:background .2s}
.bars i:nth-child(1){height:9px}.bars i:nth-child(2){height:14px}.bars i:nth-child(3){height:19px}.bars i:nth-child(4){height:24px}
.bars i.on{background:var(--yellow)}
.r-frame{margin-top:10px;font:500 10.5px/1.3 ui-monospace,Menlo,Consolas,monospace;color:var(--faint);letter-spacing:.02em}
.r-frame b{color:var(--yellow);font-weight:500}

/* episode card */
.episode{position:absolute;z-index:4;right:max(26px,env(safe-area-inset-right,0px));bottom:calc(var(--mq) + 22px);width:270px;padding:12px;border-radius:18px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:grid;grid-template-columns:78px 1fr;gap:12px}
.thumb{width:78px;height:78px;border-radius:12px;overflow:hidden;background-color:var(--p600);transition:background .4s;box-shadow:inset 0 0 0 1px var(--line)}
.ep-text{min-width:0}
.pill{display:inline-block;font:700 10px/1 var(--sans);letter-spacing:.08em;background:var(--yellow);color:var(--yellow-ink);padding:5px 8px;border-radius:6px;margin-bottom:6px}
.ep-text strong{display:block;font-size:14px;line-height:1.2}
.ep-text small{display:block;color:var(--faint);font-size:12px;margin-top:3px}
.ep-ctl{grid-column:1/-1;display:flex;align-items:center;gap:8px}
.dashes{display:flex;gap:6px;flex:1}
.dashes i{height:4px;width:16px;border-radius:2px;background:rgba(255,255,255,.22);transition:width .3s,background .3s}
.dashes i.on{width:46px;background:var(--yellow)}
.ep-ctl button{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.05)}
.ep-ctl button:hover{border-color:var(--yellow);color:var(--yellow)}
.ep-ctl svg{width:13px;height:13px}
.episode.flash{animation:flash .7s}
@keyframes flash{30%{box-shadow:0 0 0 3px var(--yellow)}}

/* ticker */
.ticker{position:absolute;z-index:6;left:0;right:0;bottom:0;height:var(--mq);background:var(--yellow);color:var(--yellow-ink);overflow:hidden;display:flex;align-items:center;padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:content-box}
.track{display:flex;flex:none;gap:22px;align-items:center;white-space:nowrap;animation:slide 34s linear infinite;padding-right:22px}
.track .d{font-size:12px}
.track .u{font:400 17px/1 var(--display);letter-spacing:.04em;text-transform:uppercase}
.track .s{font:italic 400 22px/1 var(--serif)}
@keyframes slide{to{transform:translateX(-50%)}}
@keyframes blink{50%{opacity:.35}}

/* banana cursor */
.banana{position:fixed;opacity:0;left:0;top:0;width:38px;height:38px;z-index:20;pointer-events:none;will-change:transform;filter:drop-shadow(0 4px 5px rgba(10,0,30,.45))}

@media(max-width:860px){
  :root{--mq:38px}
  .social,.stage .chip{display:none}
  
  .copy{left:max(18px,env(safe-area-inset-left,0px));right:max(18px,env(safe-area-inset-right,0px));width:auto;bottom:calc(var(--mq) + 18px)}
  .stage h1 .l1{font-size:clamp(46px,15vw,76px)}.stage h1 .l2{font-size:clamp(50px,16.5vw,84px)}
  .stage .lede{font-size:14px;margin-bottom:18px;max-width:34ch}.stage .chip{margin-bottom:12px}
  .btn-big{font-size:15px}.cta-row{flex-direction:row;align-items:center;gap:18px;flex-wrap:wrap}
  .readings{top:calc(76px + env(safe-area-inset-top,0px));right:max(12px,env(safe-area-inset-right,0px));width:148px;padding:10px 11px}
  .r-head{font-size:9.5px;letter-spacing:.1em}#dial{width:64px;height:64px}.r-body{gap:8px;margin:9px 0 8px}.r-look em{font-size:19px;min-height:40px}.r-foot em{font-size:19px}.r-frame{display:none}
}
@media(prefers-reduced-motion:reduce){.track{animation:none}.r-head .dot{animation:none}}
.thumb svg{width:100%;height:100%;display:block}

body.banana-on,body.banana-on *{cursor:none!important}
.ep-title{display:block;font-weight:700;font-size:14px;line-height:1.2;text-decoration:none}.ep-title:hover{color:var(--yellow)}
.stage .copy .btn-big{cursor:pointer}

.musicrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.musicrow .pick{font-size:12.5px;color:var(--soft);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.musicrow .pick:hover{color:var(--yellow)}
.watch[aria-pressed=true]{color:var(--yellow)}
.bubble{position:absolute;z-index:5;right:max(40px,6vw);top:calc(96px + env(safe-area-inset-top,0px));width:250px;padding:16px 18px 16px;border-radius:18px;background:var(--yellow);color:var(--yellow-ink);box-shadow:0 18px 40px rgba(10,0,40,.45);display:grid;gap:6px;font-size:14px;line-height:1.4;animation:bub .35s cubic-bezier(.2,1.4,.4,1)}
.bubble[hidden]{display:none}
.bubble b{font:400 24px/1 var(--display);letter-spacing:.01em}
.bubble .btn-mini{justify-self:start;margin-top:6px;background:var(--yellow-ink);color:var(--yellow);padding:9px 16px;border-radius:10px;font-weight:700;font-size:13.5px;text-decoration:none}
.bubble #bubX{position:absolute;top:6px;right:10px;background:none;border:0;font-size:22px;line-height:1;color:inherit;cursor:pointer}
@keyframes bub{from{transform:translateY(10px) scale(.92);opacity:0}}
@media(max-width:860px){.bubble{right:12px;left:12px;width:auto;top:calc(82px + env(safe-area-inset-top,0px))}}

/* dance poses: full-figure images swapped on the beat; the 3D canvas fades out while they play */
.posewrap{position:absolute;pointer-events:none;opacity:0;transition:opacity .28s;transform-origin:53.4% 94.9%;will-change:transform}
.stage.posing .posewrap{opacity:1}
.stage.posing #gl,.stage.posing .poster{opacity:0!important}