/* The stage, caption and controls occupy separate rows at every viewport size. */
body{min-width:0}
main,section,.hero-title-wrap>*,.story-intro>*,.press-layout>*{min-width:0}
.header{height:auto;min-height:88px;gap:24px}
.header nav{margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.hero-title-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,260px)}
.theatre{height:auto!important;display:flex;flex-direction:column;--stage-scale:1}
.stage-topline{position:relative;inset:auto;flex-shrink:0;padding:24px 28px 0;gap:15px}
.viewport{position:relative;inset:auto;flex:none;width:100%;height:clamp(330px,34vw,460px);overflow:hidden;perspective:1100px}
.world{left:50%;top:50%;margin:-240px 0 0 -500px;transform:scale(var(--stage-scale)) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transition:none}
.main-frame,.photo-wing{transition:opacity .22s ease-out}
.main-frame img{height:auto;aspect-ratio:400/267;object-fit:contain}
.theatre[data-scene="3"] .main-frame img{height:auto;aspect-ratio:595/842}
.photo-wing img{height:auto;object-fit:contain}
.scene-caption{position:relative;inset:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;padding:0 28px 22px;gap:24px;min-height:160px}
.scene-caption h2{font-size:clamp(27px,2.8vw,38px)}
.scene-caption p{max-width:530px;font-size:12px}
.scene-actions{justify-self:end;align-items:flex-end;gap:9px;min-width:0}
.auto-status{display:flex;align-items:center;gap:8px;font-size:11px;white-space:nowrap}
.auto-status i{width:5px;height:5px;background:var(--lime);border-radius:50%}
.show-duration{max-width:none;font-size:10px}
.stage-bottom{position:relative;inset:auto;margin:0 28px;padding:13px 0 17px;gap:14px}
.stage-hint{font-size:10px;max-width:none}
.stage-grain{opacity:.2}
.curtain{height:100%;width:10%}
.started .curtain-left{transform:translateX(-90%)}
.started .curtain-right{transform:translateX(90%)}
.playing .act.active i{animation:progress 6s linear forwards}
.gallery-heading{display:grid;grid-template-columns:minmax(0,1fr) auto}
.gallery-heading>p{display:none}
.gallery-viewport{height:auto;aspect-ratio:2.3;min-height:260px;max-height:470px;margin:20px 0 0;overflow:hidden}
.gallery-track{inset:15px 0 0}
.gallery-item{width:var(--gallery-card-width,480px);height:auto;aspect-ratio:3/2;top:15px;overflow:hidden}
.gallery-item img,.gallery-item.landscape img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:contain}
.gallery-ground{bottom:10px}
.gallery-caption{align-items:start}
.gallery-caption>span{line-height:1.6}
.photo-grid img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
.photo-grid button{min-width:0}
.press-stats div{min-width:0;flex:1;max-width:140px;padding:0 20px}
.press-stats{max-width:420px}
.photo-view{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:15px;padding:18px}
.photo-view img{max-width:100%;width:100%;height:auto;max-height:calc(94dvh - 170px);object-fit:contain;justify-self:center}
.reader-sheet{width:min(45dvh,calc(100vw - 180px),570px);height:auto;max-width:none;max-height:none;aspect-ratio:595/842;flex:none}
.reader-sheet img{width:100%;height:100%;max-height:none;object-fit:contain}
.book-reader{gap:24px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.sr-only:focus{position:absolute;z-index:20;left:24px;top:56px;width:auto;height:auto;clip:auto;margin:0;padding:12px;background:var(--cream);color:var(--green)}
@media(max-width:1000px){
 .hero-title-wrap{grid-template-columns:1fr}.hero-aside{display:none}
 .scene-caption{min-height:170px}
 .section-heading{flex-wrap:wrap}
}
@media(max-width:720px){
 .header{display:flex;min-height:80px;padding:14px 5%;gap:14px}
 .brand img{width:132px}
 .header nav{display:flex;grid-column:auto;grid-row:auto;gap:14px;font-size:11px}
 .hero-top{flex-wrap:wrap;row-gap:5px}
 .hero-title-wrap{padding:22px 0 27px}
 .hero-title-wrap h1{font-size:clamp(36px,8.4vw,59px);letter-spacing:-1.7px}
 .theatre{margin:0}
 .stage-topline{padding:18px 18px 0;font-size:8px}
 .viewport{height:330px;perspective:950px}
 .world{width:100%;height:100%;left:0;top:0;margin:0;transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transition:none}
 .back-wall{width:110%;height:115%;left:-5%;top:0;transform:translateZ(-90px)}
 .arch-outer{width:108%;height:110%;left:-4%;top:5%;transform:translateZ(-50px)}
 .arch-inner{width:94%;height:100%;left:3%;top:10%;transform:translateZ(-35px)}
 .chain-art{left:calc(50% - 90px);top:0;transform:translateZ(-60px) rotate(-35deg)}
 .stage-floor{width:180%;height:600px;left:-40%;top:-20px;transform:translateY(270px) rotateX(90deg)}
 .floor-line{width:120%;height:200px;left:-10%;top:230px;transform:rotateX(76deg)}
 .line-two{width:145%;left:-22%;top:220px}
 .podium,.podium-front{width:84%;height:50px;left:8%;top:auto;bottom:14px;transform:translateZ(0) rotateX(18deg)}
 .podium-front{width:74%;left:13%;bottom:6px}
 .main-frame{width:78%;left:11%;top:50%;transform:translateY(-50%) translateZ(30px);box-shadow:0 15px 30px #010b08aa}
 .main-frame img{width:100%;height:auto;aspect-ratio:400/267}
 .photo-wing{width:44%;top:25%;padding:3px;opacity:.7}
 .wing-left{left:-13%;transform:translateZ(-35px) rotateY(32deg)}
 .wing-right{right:-13%;transform:translateZ(-35px) rotateY(-32deg)}
 .floating-label{display:none}
 .frame-bottom{font-size:6px;padding:9px;letter-spacing:1px}
 .theatre[data-scene="3"] .main-frame{width:min(44%,190px);left:50%;top:50%;transform:translate(-50%,-50%) translateZ(30px)}
 .theatre[data-scene="3"] .main-frame img{height:auto;aspect-ratio:595/842}
 .theatre[data-scene="3"] .wing-left{transform:translateZ(-35px) rotateY(32deg)}
 .theatre[data-scene="3"] .wing-right{transform:translateZ(-35px) rotateY(-32deg)}
 .changing .main-frame{transform:translateY(-50%) translateZ(0);opacity:.3}
 .scene-caption{display:flex;min-height:0;padding:0 20px 21px;gap:18px;align-items:flex-start}
 .scene-caption h2{font-size:28px;margin:10px 0;line-height:1.13}
 .scene-caption p{max-width:none;font-size:12px;line-height:1.65;min-height:60px}
 .scene-actions{flex-direction:row;justify-self:auto;align-items:center;gap:12px}
 .auto-status{font-size:10px}.show-duration{font-size:9px}
 .stage-bottom{margin:0 20px;padding:12px 0 15px;align-items:center}
 .stage-hint{font-size:8px;max-width:170px}
 .curtain{display:none}
 .gallery-heading{grid-template-columns:1fr;gap:22px}
 .gallery-controls{justify-self:start}.gallery-controls .round-link{width:42px;height:42px}
 .gallery-viewport{aspect-ratio:1.4;min-height:215px;max-height:400px;margin:12px -3% 0}
 .gallery-item{top:10px}
 .gallery-caption{gap:15px;align-items:center}
 .gallery-caption>span{max-width:none;flex:1;min-width:0}
 .gallery-caption .text-button{max-width:125px;line-height:1.7;text-align:right}
 .press-stats div{padding:0 17px}
 .press-stats dt{font-size:38px}.press-stats dd{font-size:10px}
 .press-actions{align-items:flex-start}
 .book-scene{height:410px;max-width:100%;overflow:hidden}
 .book{width:min(64vw,245px)}
 .book-annotation{right:4px;font-size:7px}
 .photo-view{grid-template-columns:1fr 1fr;padding:12px;gap:12px}
 .photo-view img{grid-row:1;grid-column:1/-1;width:100%;height:auto;max-height:calc(94dvh - 220px)}
 .photo-view .round-link{position:static;grid-row:2;width:42px;height:42px}
 .photo-view .round-link:first-child{justify-self:start}.photo-view .round-link:last-child{justify-self:end}
 .dialog-bottom{align-items:start;font-size:10px;line-height:1.6}
 .book-reader{gap:8px;padding:12px 8px}
 .reader-sheet{width:min(42dvh,calc(100vw - 105px));height:auto;max-width:none;max-height:none}
 .book-reader .round-link{width:36px;height:42px;flex:none}
 .reader-tools{padding:12px;gap:9px}.reader-tools select{max-width:calc(100vw - 130px)}
 .page-transcription{padding:0 16px 16px}
}
@media(max-width:380px){
 .header{flex-wrap:wrap;gap:12px;justify-content:space-between}.header nav{margin-left:0;gap:12px;font-size:10px}
 .brand img{width:115px}.viewport{height:280px}
 .scene-caption h2{font-size:25px}.scene-caption p{font-size:11px}
 .scene-actions{flex-wrap:wrap;gap:8px}.stage-bottom{gap:8px}
 .stage-hint{max-width:140px}.stage-bottom .text-button{font-size:9px}
 .press-stats div{padding:0 14px}.press-stats dt{font-size:35px}
 .gallery-viewport{min-height:200px}
}
@media(max-height:500px) and (orientation:landscape){
 .photo-view img{max-height:calc(94dvh - 160px)}
 .photo-view{grid-template-columns:42px minmax(0,1fr) 42px}
 .photo-view img{grid-column:2;grid-row:1}
 .photo-view .round-link{grid-row:1}
 .reader-sheet{width:40dvh}
 .reader-tools a{width:auto;margin-left:auto}
}
@media(prefers-reduced-motion:reduce){.world{--tilt-x:0deg;--tilt-y:0deg}}

/* Reserve the full image height, including its logo strip, on tablets too. */
.gallery-viewport{height:var(--gallery-view-height,430px);aspect-ratio:auto;min-height:0;max-height:none}
.gallery-item{transition:none}
.gallery-ready .gallery-item{transition:transform .6s cubic-bezier(.2,.65,.2,1),opacity .4s}
@media(prefers-reduced-motion:reduce){.gallery-ready .gallery-item{transition:none}}