/* Each collage retains its height and travel on phones. Scroll motion stays in app.js. */
.new-story{--world-width:max(100vw,150vh);--world-origin:calc(50vw - var(--world-width)*.5)}
.new-story .layer{height:auto;overflow:visible}
.new-story img{object-position:center bottom}
.new-story .layer>img,.new-story .layer>span>img{display:block;width:100%;height:auto}
.new-story .atlas-source{position:absolute!important;width:1px!important;height:1px!important;opacity:0;pointer-events:none}
.new-story .art-cue{display:block;position:static;text-align:center;white-space:nowrap;color:#999;font-size:10px;letter-spacing:.17em;margin-top:13px}
.new-story .editorial-title{width:calc(var(--world-width)*.44)}
.new-credit{display:block;text-align:center;font-size:11px;letter-spacing:.23em;margin-top:15px;color:#bab5b3}
.new-story button img{pointer-events:none}
.new-story .year{z-index:3}
.gentle-float{display:block;animation:prop-hover 7s ease-in-out infinite;transform-origin:center}
@keyframes prop-hover{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-1.5vh) rotate(1.5deg)}}
/* Page 13 — the filmmakers occupy a screening room, projection behind them. */
.jeen-curtains{left:calc(var(--world-origin) - var(--world-width)*.04);width:calc(var(--world-width)*1.08);bottom:-1vh;z-index:0;opacity:.31}
.jeen-chairs{left:calc(var(--world-origin) + var(--world-width)*.04);bottom:-1vh;width:calc(var(--world-width)*.34);z-index:1}
.jeen-directors{left:calc(var(--world-origin) + var(--world-width)*.43);bottom:-15vh;height:77vh!important;width:auto;z-index:7}
.jeen-title{left:calc(var(--world-origin) + var(--world-width)*.38);top:25vh;z-index:6}
.jeen-title strong{font-family:Arial,sans-serif;font-size:8vh;font-weight:700;letter-spacing:.11em}
.jeen-title .editorial-kicker{font-size:14px;letter-spacing:.23em}
.jeen-title .editorial-credit{font-size:11px;letter-spacing:.12em}
.jeen-lantern{top:4vh;width:20vh;z-index:3}
.jeen-lantern-left{left:calc(var(--world-origin) + var(--world-width)*.08)}
.jeen-lantern-right{left:calc(var(--world-origin) + var(--world-width)*.83)}
.fresnel-glow{position:absolute;top:47%;left:29%;width:15%;height:20%;border-radius:50%;background:#fff8de;box-shadow:0 0 10px 5px #ffe8b77a,0 0 36px 14px #fff1bd38;opacity:.75}
.jeen-lantern-right .fresnel-glow{left:71%;top:47%}
.jeen-floor-light{left:calc(var(--world-origin) + var(--world-width)*.82);width:26vh;bottom:-1vh;z-index:5}
.floor-light-glow{position:absolute;top:17%;left:40%;width:21%;height:10%;border-radius:50%;background:#ffe8c05c;box-shadow:0 0 12px 3px #ffe7ac80,0 0 32px 14px #e7c26d25;rotate:-32deg}
.jeen-projection{left:calc(var(--world-origin) + var(--world-width)*.59);top:5vh;width:32vh;height:38vh!important;z-index:4}
.jeen-projection>img:not(.atlas-source){position:absolute;top:0;left:30%;width:13vh}
.jeen-projection canvas{position:absolute;top:11vh;left:0;width:25vh;height:35vh;mix-blend-mode:screen;opacity:.78}
.projector-beam{position:absolute;left:45%;top:5vh;width:22vh;height:32vh;translate:-50% 0;opacity:.28;background:linear-gradient(#ececd980,transparent);clip-path:polygon(47% 0,53% 0,100% 100%,0 100%);filter:blur(6px);pointer-events:none}
.jeen-projection .art-cue{position:absolute;top:4vh;left:78%;font-size:9px;text-align:left;writing-mode:vertical-rl;opacity:.65}
.jeen-story.projection-off .jeen-projection canvas,.jeen-story.projection-off .projector-beam{opacity:0}
/* Page 14 — complete proscenium, equipment at the floor, lights at their source. */
.rock-theatre{left:calc(var(--world-origin) - var(--world-width)*.02);width:calc(var(--world-width)*1.04);bottom:-1vh;z-index:0}
.scene .rock-theatre>img{filter:grayscale(1) brightness(.6)}
.rock-chris{left:calc(var(--world-origin) + var(--world-width)*.4);bottom:-4vh;height:88vh!important;width:auto;z-index:5}
.rock-logo{left:calc(var(--world-origin) + var(--world-width)*.57);top:52vh;width:calc(var(--world-width)*.33);translate:-50% -50%;z-index:8}
.scene .rock-logo>img{filter:drop-shadow(0 0 12px #efe8c763) drop-shadow(0 0 32px #f1e5c42e)}
.rock-year{left:calc(var(--world-origin) + var(--world-width)*.13);top:62vh}
.rock-mic{left:calc(var(--world-origin) + var(--world-width)*.39);bottom:-1vh;height:60vh!important;width:auto;z-index:6}
.rock-stool{left:calc(var(--world-origin) + var(--world-width)*.08);bottom:-2vh;height:30vh!important;width:auto;z-index:4}
.rock-case{left:calc(var(--world-origin) + var(--world-width)*.65);bottom:-3vh;width:calc(var(--world-width)*.24);z-index:6}
.rock-road-case{left:calc(var(--world-origin) + var(--world-width)*.86);bottom:-3vh;width:calc(var(--world-width)*.14);z-index:7}
.rock-moving-light{left:calc(var(--world-origin) + var(--world-width)*.25);bottom:0;width:15vh;z-index:3}
.moving-light-glow{position:absolute;left:42%;top:21%;width:30%;height:22%;border-radius:50%;background:#f1d4c561;box-shadow:0 0 15px 6px #eacfaa35}
.theatre-beam{position:absolute;top:21.6%;width:25%;height:77%;background:linear-gradient(#fff6e725,transparent);clip-path:polygon(49% 0,51% 0,100% 100%,0 100%);transform-origin:50% 0;filter:blur(12px);animation:theatre-sweep 10s ease-in-out infinite;pointer-events:none;opacity:.35}
.beam-one{left:13.3%}.beam-two{left:48.9%;animation-delay:-5s}
@keyframes theatre-sweep{0%,100%{rotate:-6deg}50%{rotate:6deg}}
.rock-story.lights-cued .theatre-beam{opacity:.9}.rock-story.lights-cued .rock-logo>img{filter:drop-shadow(0 0 16px #efe8c7aa) drop-shadow(0 0 45px #e4d7b75a)}
.low-haze{position:absolute;left:-10vh;bottom:0;width:45vh;height:9vh;background:radial-gradient(ellipse,#cfb8bc15,transparent 70%);pointer-events:none}
/* Page 15 — sauce remains the red accent, food separated into floating layers. */
.mambo-sign{left:calc(var(--world-origin) + var(--world-width)*.01);bottom:-1vh;height:78vh!important;width:auto;z-index:1}
.scene img.mambo-sign{filter:grayscale(.8) contrast(1.08)}
.mambo-title{left:calc(var(--world-origin) + var(--world-width)*.52);top:10vh;z-index:5}
.mambo-title strong{font-size:9vh}
.mambo-bottles{left:calc(var(--world-origin) + var(--world-width)*.32);bottom:-1vh;width:calc(var(--world-width)*.34);z-index:4}
.scene img.mambo-bottles{filter:grayscale(.7) contrast(1.08)}
.mambo-chicken{left:calc(var(--world-origin) + var(--world-width)*.25);top:31vh;width:16vh;z-index:3}
.mambo-nugget{left:calc(var(--world-origin) + var(--world-width)*.8);top:31vh;width:24vh;z-index:6}
.mambo-nugget .gentle-float{animation-delay:-3s}
.mambo-back-nugget{left:calc(var(--world-origin) + var(--world-width)*.67);bottom:12vh;width:10vh;z-index:2;opacity:.6}
.mambo-packet{left:calc(var(--world-origin) + var(--world-width)*.68);top:46vh;width:21vh;z-index:7}
.scene .mambo-packet img{filter:drop-shadow(0 0 16px #c51c242b)}
.packet-motion{display:block;animation:prop-hover 8s ease-in-out infinite}
.mambo-story.is-dipping .mambo-nugget .gentle-float{animation:mambo-dip 2s ease-in-out both}
@keyframes mambo-dip{0%,100%{transform:translate(0,0)}48%,65%{transform:translate(calc(var(--world-width)*-.12),15vh) rotate(-12deg)}}
.mambo-story.is-dipping .packet-motion{filter:drop-shadow(0 0 18px #e42d4666)}
/* Page 16 — throne and dressing-room objects, no cropped floating room backdrop. */
.queen-mirror{left:calc(var(--world-origin) + var(--world-width)*.39);bottom:3vh;height:91vh!important;width:auto;z-index:0;opacity:.45}
.queen-freedia{left:calc(var(--world-origin) + var(--world-width)*.12);bottom:-2vh;height:81vh!important;width:auto;z-index:5}
.queen-title{left:calc(var(--world-origin) + var(--world-width)*.58);top:11vh;z-index:6}
.queen-title strong{font-size:9vh}.queen-title .editorial-kicker{color:#d41f24}
.queen-logo{left:calc(var(--world-origin) + var(--world-width)*.43);top:43vh;width:calc(var(--world-width)*.34);z-index:3;opacity:.82}
.queen-column{bottom:-8vh;width:calc(var(--world-width)*.2);z-index:2}
.queen-column-left{left:calc(var(--world-origin) - var(--world-width)*.08)}
.queen-column-right{left:calc(var(--world-origin) + var(--world-width)*.87)}
.queen-box{left:calc(var(--world-origin) + var(--world-width)*.71);bottom:-1vh;width:calc(var(--world-width)*.2);z-index:4}
.queen-hand-mirror{left:calc(var(--world-origin) + var(--world-width)*.56);bottom:9vh;width:20vh;rotate:-16deg;z-index:7}
.queen-crown{left:calc(var(--world-origin) + var(--world-width)*.76);top:15vh;width:26vh;z-index:8}
.crown-motion{position:relative;display:block;animation:prop-hover 9s ease-in-out infinite}
.crown-motion i{position:absolute;width:2px;height:2px;background:#fff;box-shadow:0 0 6px 2px #fff9;opacity:.5;top:35%;left:21%;animation:gem-glint 6s ease-in-out infinite}
.crown-motion i:nth-of-type(2){left:49%;top:25%;animation-delay:-2s}.crown-motion i:nth-of-type(3){left:77%;top:41%;animation-delay:-4s}
.crown-motion i::before,.crown-motion i::after{content:'';position:absolute;background:#fff8;left:0;top:-4px;width:1px;height:10px}.crown-motion i::after{rotate:90deg}
@keyframes gem-glint{0%,30%,55%,100%{opacity:.12;scale:.6}42%{opacity:.9;scale:1.3}}
.queen-story.is-shining .crown-motion i{animation:royal-glint 1.6s ease-out both}
@keyframes royal-glint{0%,100%{opacity:.1;scale:.5}40%{opacity:1;scale:2.6}}
/* Page 17 — mixing room with original judges and plaques. */
.rhythm-foam{left:calc(var(--world-origin) + var(--world-width)*.15);top:-5vh;width:calc(var(--world-width)*.7);height:110vh!important;object-fit:cover!important;opacity:.27;mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);z-index:0}
.rhythm-record{top:17vh;width:22vh;z-index:2;box-shadow:0 6px 20px #0008}
.rhythm-record-left{left:calc(var(--world-origin) + var(--world-width)*.14)}
.rhythm-record-right{left:calc(var(--world-origin) + var(--world-width)*.75)}
.rhythm-judges{left:calc(var(--world-origin) + var(--world-width)*.22);bottom:-4vh;width:calc(var(--world-width)*.59);z-index:5}
.rhythm-logo{left:calc(var(--world-origin) + var(--world-width)*.52);top:13vh;width:calc(var(--world-width)*.33);translate:-50% 0;z-index:7}
.scene .rhythm-logo img{filter:drop-shadow(0 0 10px #ffffff77) drop-shadow(0 0 30px #ffffff35)}
.rhythm-year{left:calc(var(--world-origin) + var(--world-width)*.04);top:65vh;z-index:3}
.rhythm-camera{left:calc(var(--world-origin) + var(--world-width)*.83);bottom:-3vh;width:28vh;z-index:6}
.camera-tally{position:absolute;left:43%;top:14%;width:4px;height:4px;border-radius:50%;background:#c82b30;box-shadow:0 0 8px #f02b3766;animation:tally-pulse 4s ease-in-out infinite}
@keyframes tally-pulse{0%,100%{opacity:.5}50%{opacity:.9}}
.rhythm-signal{left:calc(var(--world-origin) + var(--world-width)*.22);top:44vh;width:calc(var(--world-width)*.6);height:17vh!important;z-index:3;opacity:.3}
.rhythm-signal canvas{display:block;width:100%;height:100%}.rhythm-story.beat-active .rhythm-signal{opacity:.8}
.rhythm-story.beat-active .rhythm-logo img{filter:drop-shadow(0 0 15px #fff9) drop-shadow(0 0 42px #cf273744)}
/* Page 18 — actual helicopter rotor frames, whole-unit flight and attached search cone. */
.axel-helicopter{left:calc(var(--world-origin) + var(--world-width)*.04);top:12vh;width:calc(var(--world-width)*.39);height:26vh!important;z-index:2}
.helicopter-flight{position:relative;display:block;width:100%;height:100%;animation:helicopter-hover 9s ease-in-out infinite}
.axel-helicopter canvas{width:100%;height:100%;object-fit:contain;display:block}
@keyframes helicopter-hover{0%,100%{transform:translate(0,0) rotate(-.8deg)}50%{transform:translate(2vh,-1vh) rotate(.8deg)}}
.axel-goff{left:calc(var(--world-origin) + var(--world-width)*.19);bottom:-12vh;height:69vh!important;width:auto;z-index:3}
.axel-shaq{left:calc(var(--world-origin) + var(--world-width)*.68);bottom:-2vh;height:72vh!important;width:auto;z-index:4}
.axel-eddie{left:calc(var(--world-origin) + var(--world-width)*.27);bottom:-3vh;width:calc(var(--world-width)*.5);z-index:7}
.axel-logo{left:calc(var(--world-origin) + var(--world-width)*.66);top:8vh;width:calc(var(--world-width)*.36);translate:-50% 0;z-index:6}
.scene .axel-logo img{filter:drop-shadow(0 0 13px #e32b3333) drop-shadow(0 0 36px #c4212520)}
.axel-searchlight{position:absolute;left:20%;top:75%;width:70%;height:53vh!important;z-index:-1;pointer-events:none;opacity:.16}
.axel-searchlight span{display:block;width:100%;height:100%;transform-origin:15% 0;clip-path:polygon(14% 0,16% 0,100% 100%,0 100%);background:linear-gradient(#dbe6f044,transparent);filter:blur(12px);animation:search-sweep 12s ease-in-out infinite}
@keyframes search-sweep{0%,100%{rotate:-9deg}50%{rotate:8deg}}
.axel-story.search-active .axel-searchlight{opacity:.7}
/* Page 19 — the original handwritten title; headlines become animated paper props. */
.jamie-person{left:calc(var(--world-origin) + var(--world-width)*.045);bottom:-2vh;width:calc(var(--world-width)*.51);z-index:7}
.jamie-piano{left:calc(var(--world-origin) + var(--world-width)*.47);bottom:-1vh;width:calc(var(--world-width)*.4);z-index:1}
.jamie-guitar{left:calc(var(--world-origin) + var(--world-width)*.85);bottom:-1vh;width:calc(var(--world-width)*.17);z-index:4}
.jamie-logo{left:calc(var(--world-origin) + var(--world-width)*.65);top:9vh;width:calc(var(--world-width)*.43);translate:-50% 0;z-index:6}
.scene .jamie-logo img{filter:drop-shadow(0 0 12px #dd22223d) drop-shadow(0 0 36px #c6252528);animation:jamie-neon 8s ease-in-out infinite}
@keyframes jamie-neon{0%,100%{opacity:.9}50%{opacity:1}}
.jamie-headline{width:calc(var(--world-width)*.25);z-index:3;animation:paper-drift 10s ease-in-out infinite}
.headline-one{left:calc(var(--world-origin) + var(--world-width)*.12);top:12vh;rotate:-8deg}
.headline-two{left:calc(var(--world-origin) + var(--world-width)*.39);top:48vh;rotate:4deg;animation-delay:-3s}
.headline-three{left:calc(var(--world-origin) + var(--world-width)*.79);top:40vh;rotate:-5deg;animation-delay:-7s}
@keyframes paper-drift{0%,100%{translate:0 0}50%{translate:0 -1vh}}
.jamie-answer{left:calc(var(--world-origin) + var(--world-width)*.57);top:44vh;font-family:Georgia,serif;font-size:3vh;letter-spacing:.1em;opacity:0;z-index:5;transition:opacity .5s}
.jamie-story.truth-revealed .jamie-answer{opacity:1}.jamie-story.truth-revealed .jamie-headline{opacity:.08;transition:opacity .6s}.jamie-story.truth-revealed .jamie-logo img{filter:drop-shadow(0 0 18px #f22b3266) drop-shadow(0 0 48px #cf1c2455)}
@media(max-aspect-ratio:1/1){
 .new-story{--world-width:166vh;--world-origin:0px}
 .new-story .editorial-title{width:92vw}
 .new-story .rock-logo,.new-story .rhythm-logo,.new-story .axel-logo,.new-story .jamie-logo{width:88vw}
 .jeen-title strong{font-size:6vh}.jeen-title{left:calc(var(--world-width)*.56);top:26vh}.jeen-title .editorial-kicker{font-size:11px}
 .rock-logo{left:calc(var(--world-width)*.48)}
 .mambo-title{left:calc(var(--world-width)*.5)}
 .queen-title{left:calc(var(--world-width)*.30)}
 .queen-logo{left:calc(var(--world-width)*.32);width:86vw;top:47vh}
 .axel-logo{left:calc(var(--world-width)*.52)}
 .jamie-logo{left:calc(var(--world-width)*.34)}
 .rock-year,.rhythm-year{top:65vh}
 .mambo-title strong{font-size:7vh}.queen-title strong{font-size:6.5vh}
 .new-story .new-credit{font-size:10px}.new-story .art-cue{font-size:9px}
 .jeen-directors{height:73vh!important}
}
@media(prefers-reduced-motion:reduce){
 .new-story *,.new-story *::before,.new-story *::after{animation:none!important;transition:none!important}
 .queen-story.is-shining .crown-motion i{opacity:1}.mambo-story.is-dipping .packet-motion{filter:drop-shadow(0 0 18px #e42d4666)}
}