/* Episode cues live here; the shared player selects and resets each scene. */
.penguin-motion{transform-box:fill-box;transform-origin:50% 96%}
#beat-3.deck-active .penguin-motion{animation:waddle-in 2400ms linear both}
#beat-4.deck-active .penguin-motion{animation:waddle-away 1700ms linear both}
.explosion-plume{opacity:0;transform-box:fill-box;transform-origin:left 65%}
#beat-4.deck-active .explosion-plume{animation:explosion-arrival 650ms 1900ms cubic-bezier(.16,.8,.3,1) both}
#beat-4.deck-active .scene-frame{animation:blast-jolt 430ms 1940ms linear}
#beat-5.deck-active .fire-backdrop{animation:firelight 1600ms ease-in-out infinite alternate}
#beat-5.deck-active .rear-penguin{filter:drop-shadow(0 4px 2px #100c08aa)}
#beat-5.deck-active .ember{animation:ember-drift 3200ms var(--ember-delay) linear infinite;transform-box:fill-box}
@keyframes waddle-in{
 0%{transform:translate(1040px,0) rotate(5deg)}
 10%{transform:translate(936px,-5px) rotate(-5deg)}
 20%{transform:translate(832px,0) rotate(5deg)}
 30%{transform:translate(728px,-5px) rotate(-5deg)}
 40%{transform:translate(624px,0) rotate(5deg)}
 50%{transform:translate(520px,-5px) rotate(-5deg)}
 60%{transform:translate(416px,0) rotate(5deg)}
 70%{transform:translate(312px,-5px) rotate(-5deg)}
 80%{transform:translate(208px,0) rotate(5deg)}
 90%{transform:translate(104px,-5px) rotate(-5deg)}
 100%{transform:translate(0,0) rotate(0)}
}
@keyframes waddle-away{
 0%{transform:translate(0,0) rotate(0)}
 12.5%{transform:translate(-138px,-5px) rotate(-5deg)}
 25%{transform:translate(-275px,0) rotate(5deg)}
 37.5%{transform:translate(-413px,-5px) rotate(-5deg)}
 50%{transform:translate(-550px,0) rotate(5deg)}
 62.5%{transform:translate(-688px,-5px) rotate(-5deg)}
 75%{transform:translate(-825px,0) rotate(5deg)}
 87.5%{transform:translate(-963px,-5px) rotate(-5deg)}
 100%{transform:translate(-1100px,0) rotate(0)}
}
@keyframes explosion-arrival{0%{opacity:0;transform:translateX(-250px) scale(.82);filter:brightness(1)}15%{opacity:1;filter:brightness(1.8)}45%{transform:translateX(0) scale(1.03);filter:brightness(1.15)}100%{opacity:1;transform:translateX(0) scale(1);filter:brightness(1)}}
@keyframes blast-jolt{0%,100%{transform:translate(0,0)}15%{transform:translate(-6px,3px)}30%{transform:translate(5px,-3px)}45%{transform:translate(-4px,2px)}65%{transform:translate(3px,-1px)}85%{transform:translate(-1px,1px)}}
@keyframes firelight{0%{filter:brightness(.97)}48%{filter:brightness(1.055)}100%{filter:brightness(1.01)}}
@keyframes ember-drift{0%{opacity:0;transform:translate(0,60px)}15%{opacity:.85}75%{opacity:.65}100%{opacity:0;transform:translate(45px,-190px)}}

.episode-links{display:flex;gap:12px;font:14px Arial,sans-serif}
.episode-links a,.episode-links span{padding:9px 12px;white-space:nowrap}
.episode-links span{opacity:.35}
@media(max-width:700px){
 .episode-links{width:100%;justify-content:space-between;font-size:12px}
 /* Silent panels do not need the tall dialogue reserve used by other episodes. */
 html.deck-ready body{height:auto;min-height:100svh}
 html.deck-ready .masthead{margin:0}
 html.deck-ready main{flex:0 0 auto;overflow:visible}
 .deck-controls{margin-top:10px}
}