
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;700;900&family=Inter:wght@300;400;600;800&display=swap');
:root{--gold:#d7b865;--gold2:#f4db8a;--ink:#05090d;--cream:#f8f1de;--soft:#cfc5ad}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--cream);font-family:Inter,Arial,sans-serif}a{text-decoration:none;color:inherit}
.nav{position:fixed;z-index:50;top:0;left:0;right:0;padding:18px 4vw;display:flex;justify-content:center;gap:18px;flex-wrap:wrap;background:linear-gradient(180deg,rgba(0,0,0,.88),rgba(0,0,0,.18),rgba(0,0,0,0));font-family:Cinzel,serif;letter-spacing:.12em;font-size:.82rem;color:var(--gold2)}
.nav a:hover{color:white;text-shadow:0 0 18px var(--gold)}
.hero{min-height:100vh;display:grid;place-items:center;text-align:center;padding:150px 24px 70px;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(5,9,13,.96)),url('assets/hero.png') center/cover no-repeat}
.kicker{font-family:Cinzel,serif;letter-spacing:.22em;color:var(--gold2);text-shadow:0 4px 20px #000;font-size:clamp(1rem,2vw,1.4rem)}
h1{font-family:Cinzel,serif;color:var(--gold);font-size:clamp(4rem,11vw,10rem);line-height:.86;margin:18px 0;text-transform:uppercase;text-shadow:0 7px 28px #000}
.stack{font-weight:900;letter-spacing:.14em;line-height:1.45;font-size:clamp(1.45rem,3.5vw,3.1rem);margin:26px 0;text-shadow:0 4px 22px #000}
.hero p{max-width:850px;margin:18px auto 28px;color:#eee1c4;font-size:1.15rem;line-height:1.7;text-shadow:0 3px 16px #000}
.buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.btn{border:1px solid var(--gold);color:var(--gold2);padding:15px 24px;background:rgba(0,0,0,.38);font-weight:900;letter-spacing:.08em}.btn:hover{background:rgba(215,184,101,.2)}
section{padding:88px 6vw}.wrap{max-width:1220px;margin:auto}.episode-list{display:grid;gap:28px;margin-top:28px}.panel h3{font-family:Cinzel,serif;color:var(--gold2);font-size:1.45rem;margin:0 0 18px}
.title{font-family:Cinzel,serif;color:var(--gold);font-size:clamp(2.4rem,5vw,4.8rem);margin:0 0 15px}.lead{font-size:1.12rem;color:#ddd2bb;line-height:1.8;max-width:900px}
.panel{border:1px solid rgba(215,184,101,.28);background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(0,0,0,.34));box-shadow:0 20px 70px rgba(0,0,0,.42);padding:28px}.embed{aspect-ratio:16/9;width:100%;border:0;box-shadow:0 18px 58px #000}
.chapter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:32px}.chapter{border:1px solid rgba(215,184,101,.25);background:rgba(255,255,255,.045);padding:20px;min-height:105px;display:flex;flex-direction:column;justify-content:center}.chapter b{color:var(--gold2);font-family:Cinzel,serif}.chapter span{margin-top:8px;color:#e9dfc8;font-weight:700}
.cast-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;margin-top:34px}.cast-card{border:1px solid rgba(215,184,101,.3);background:rgba(255,255,255,.045);box-shadow:0 20px 60px rgba(0,0,0,.35);overflow:hidden}.cast-card img{width:100%;height:auto;display:block}.cast-copy{padding:20px}.cast-copy h3{font-family:Cinzel,serif;color:var(--gold2);font-size:1.5rem;margin:0 0 5px}.cast-copy span{color:#dac198;font-weight:800}.cast-copy p{color:#d6cdb8;line-height:1.55}
.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:30px}.rule{border-left:3px solid var(--gold);padding:22px;background:rgba(255,255,255,.045);line-height:1.6}.rule b{color:var(--gold2)}
.footer{text-align:center;color:#afa58f;border-top:1px solid rgba(215,184,101,.2);padding:44px 20px}
@media(max-width:720px){.nav{position:absolute;font-size:.67rem;gap:10px}.hero{padding-top:175px}.buttons{flex-direction:column}.btn{width:100%}}

.music-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:28px;margin:30px 0}.music-card p{color:#ddd2bb;line-height:1.65}.tag{display:inline-block;color:var(--gold2);border:1px solid rgba(215,184,101,.36);background:rgba(215,184,101,.1);padding:8px 12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;font-size:.74rem;margin-bottom:14px}.mini-buttons{margin-top:18px}.mini-buttons .btn{font-size:.82rem;padding:12px 16px}.soundtrack-panel{margin-top:28px}.soundtrack-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-top:24px}.track-card{border:1px solid rgba(215,184,101,.22);background:rgba(255,255,255,.04);padding:16px;min-height:120px;display:flex;flex-direction:column;justify-content:space-between}.track-card b{font-family:Cinzel,serif;color:var(--gold2);font-size:1.25rem}.track-card span{font-weight:900;color:#f0e2c5;margin:10px 0}.track-card small{color:#bfb39d;line-height:1.4}.update-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:24px 0 28px}.update-list div{border-left:3px solid var(--gold);background:rgba(255,255,255,.045);padding:18px}.update-list b{display:block;color:var(--gold2);font-family:Cinzel,serif;margin-bottom:7px}.update-list span{color:#ddd2bb;line-height:1.5}


.audio-dock{position:fixed;right:18px;bottom:18px;z-index:80;display:flex;align-items:center;gap:14px;max-width:360px;padding:14px 16px;border:1px solid rgba(215,184,101,.38);background:rgba(5,9,13,.82);box-shadow:0 18px 60px rgba(0,0,0,.58);backdrop-filter:blur(10px)}
.audio-copy{display:flex;flex-direction:column;gap:3px;min-width:0}.audio-copy strong{font-family:Cinzel,serif;color:var(--gold2);letter-spacing:.08em;font-size:.82rem;text-transform:uppercase}.audio-copy span{color:#ddd2bb;font-size:.86rem;line-height:1.25}.audio-btn{border:1px solid var(--gold);color:var(--gold2);background:rgba(215,184,101,.12);font-weight:900;letter-spacing:.08em;padding:10px 14px;cursor:pointer}.audio-btn:hover{background:rgba(215,184,101,.24)}.audio-dock.playing{box-shadow:0 0 0 1px rgba(215,184,101,.18),0 18px 60px rgba(0,0,0,.58)}.audio-dock.needs-click{animation:pulseDock 1.8s ease-in-out 2}@keyframes pulseDock{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:720px){.audio-dock{left:12px;right:12px;bottom:12px;max-width:none;justify-content:space-between}.audio-copy span{font-size:.8rem}}

.jukebox-dock{max-width:430px}.audio-controls{display:flex;align-items:center;gap:8px}.audio-btn.small{padding:10px 12px;font-size:1.05rem;line-height:1}.jukebox-panel{display:grid;grid-template-columns:minmax(260px,1.2fr) minmax(220px,.8fr);gap:22px;align-items:stretch;margin:24px 0}.jukebox-now,.jukebox-note{border:1px solid rgba(215,184,101,.22);background:rgba(0,0,0,.24);padding:22px}.jukebox-now h3{margin:0 0 8px}.jukebox-now p,.jukebox-note p{color:#ddd2bb;line-height:1.55}.jukebox-note code{color:var(--gold2);font-weight:900}.track-card.playable{cursor:pointer;position:relative}.track-card.playable.active{border-color:rgba(244,219,138,.72);box-shadow:0 0 0 1px rgba(244,219,138,.15),0 18px 45px rgba(0,0,0,.36);background:linear-gradient(145deg,rgba(215,184,101,.13),rgba(255,255,255,.045))}.track-card.locked{opacity:.78}.track-card.bonus{grid-column:auto;min-height:132px}.track-play{margin-top:12px;border:1px solid var(--gold);background:rgba(215,184,101,.12);color:var(--gold2);font-weight:900;letter-spacing:.08em;padding:10px 12px;cursor:pointer}.track-play:hover{background:rgba(215,184,101,.24)}.jukebox-main{cursor:pointer}
@media(max-width:720px){.jukebox-panel{grid-template-columns:1fr}.jukebox-dock{left:12px;right:12px}.audio-controls{gap:6px}.audio-btn.small{padding:9px 11px}.jukebox-note{font-size:.92rem}}


/* v12 cleanup: keep internal audio file paths hidden and prevent track-card text bleed */
.track-card{overflow:hidden}
.track-card span,.track-card small{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.track-card small{white-space:normal}
.jukebox-note code{display:none}
