/* Viewport-based stage: centred booth, reserved control dock, no stretched assets. */
.cinema{height:100svh;min-height:0;--dock:70px;--stage:calc(100svh - var(--header) - var(--dock))}
.layer{bottom:var(--dock)}
.experience{height:650svh}
.opening-copy{left:5%;top:20px;width:90%;text-align:center}
.launch{margin-bottom:14px}
h1{font-size:clamp(38px,4.4vw,68px);max-width:none;line-height:1.04;letter-spacing:-.06em}
h1 br{display:none}
.booth-assembly{--booth-width:min(calc((var(--stage) - 155px)*.75),calc(100vw - 48px));width:var(--booth-width);height:auto;aspect-ratio:1086/1448;left:calc((100% - var(--booth-width))/2);right:auto;bottom:4px}
.outside-aside{display:none}
.scene-nav{left:50%;transform:translateX(-50%);bottom:12px;margin:0;padding:0;gap:24px;background:white}
.scene-nav button{min-width:48px;min-height:44px;font-size:11px;padding:10px 4px}
.motion-toggle{bottom:20px;right:var(--gutter);min-height:36px;padding:8px;font-size:10px}
.camera-unit{top:10px}
.camera-unit .lens{width:60px;height:60px}
.camera-unit .lens i{top:13px;left:19px}
.touchscreen{inset:105px auto 12px;left:50%;width:min(calc(100% - 48px),960px);margin-left:calc(min(calc(100% - 48px),960px)/-2);border-width:8px}
.choose-content{gap:30px;padding:20px 5%}
.choose-copy h2{font-size:clamp(30px,3.6vw,52px);max-width:8em}
.filter-buttons{margin:22px 0;gap:12px}
.filter-buttons button{min-width:52px;min-height:44px;font-size:11px}
.filter-thumb{width:42px}
.next-button{min-height:44px;padding:12px 20px;font-size:13px}
.frame-preview{width:clamp(100px,calc((var(--stage) - 210px)/2.5),190px);flex-shrink:0}
.portrait-screen{inset:0;left:50%;width:min(100%,var(--stage));transform-origin:50% 50%;margin-left:calc(min(100%,var(--stage))/-2);border-width:10px 10px 36px}
.capture{background:#efefef}
.photo-full{width:max(100%,calc(var(--stage) - 46px));height:auto;aspect-ratio:1}
.capture-bottom{bottom:0;height:30px;padding:0 12px;font-size:10px}
.pose-copy{bottom:9%;padding:16px;max-width:65%}
.pose-copy h2{font-size:clamp(28px,3.6vw,48px)}
.print-copy{left:5%;top:16px;width:90%;text-align:center}
.print-copy h2{font-size:clamp(30px,4vw,58px);max-width:none}
.print-copy h2 br{display:none}
.print-copy p{font-size:12px;max-width:none;margin-top:12px}
.printer{left:50%;transform:translateX(-50%);top:125px;width:calc((var(--stage) - 155px)/4.65);height:calc(100% - 125px)}
.paper{padding:6px 6px 9px}.paper .photo-cell{aspect-ratio:1;margin-bottom:5px}
.print-star{font-size:90px;top:48%;right:22%;bottom:auto}
.motion-reduced .cinema,.motion-reduced .experience{height:100svh;min-height:0}
@media(min-width:701px) and (max-width:1100px){
 :root{--header:68px}
 .experience{height:610svh}
 .opening-copy{top:28px}h1{font-size:clamp(44px,5vw,58px)}
 .booth-assembly{--booth-width:min(calc((var(--stage) - 180px)*.75),70vw)}
 .touchscreen{width:calc(100% - 64px);margin-left:calc((100% - 64px)/-2);top:115px;bottom:25px}
 .print-star{right:14%}
}
@media(max-width:700px){
 .cinema{--dock:86px}.experience{height:570svh}
 .opening-copy{left:22px;top:18px;width:calc(100% - 44px)}
 .launch{font-size:10px;margin-bottom:12px}
 h1{font-size:clamp(34px,9vw,48px);line-height:1.03}
 .booth-assembly{--booth-width:min(calc((var(--stage) - 145px)*.75),calc(100vw - 32px));bottom:0}
 .scene-nav{bottom:32px;gap:15px}.scene-nav button{font-size:10px;min-width:46px}
 .motion-toggle{bottom:2px;right:50%;transform:translateX(50%);min-height:28px;font-size:9px;padding:4px}
 .camera-unit{top:8px}.camera-unit .lens{width:48px;height:48px}.camera-unit .lens i{top:9px;left:14px;width:7px;height:7px}
 .touchscreen{inset:88px auto 8px;left:50%;width:calc(100% - 28px);margin-left:calc((100% - 28px)/-2);border-width:6px}
 .screen-heading{height:38px;padding:0 10px}.screen-heading>.brand-letters{width:86px}
 .choose-content{height:calc(100% - 38px);gap:14px;padding:14px}
 .choose-copy{min-width:0}.choose-copy h2{font-size:clamp(26px,7vw,34px)}
 .choose-copy>p{font-size:10px;max-width:150px}
 .filter-buttons{gap:5px;margin:18px 0}.filter-buttons button{font-size:8px;padding:4px;min-width:35px}
 .filter-thumb{width:28px}.next-button{font-size:11px;padding:10px 13px}
 .frame-preview{width:30%;max-width:135px;min-width:72px;padding:5px;gap:4px}
 .photo-full{width:max(100%,calc(var(--stage) - 46px))}
 .pose-copy h2{font-size:28px}.pose-copy{padding:12px}
 .print-copy{top:14px}.print-copy h2{font-size:28px}.print-copy p{font-size:10px;margin-top:10px}
 .printer{top:100px;width:calc((var(--stage) - 130px)/4.65);height:calc(100% - 100px)}
 .print-star{font-size:60px;right:8%}
}
/* Short landscape screens use a compact two-column composition. */
@media(max-height:560px) and (orientation:landscape){
 :root{--header:52px}.cinema{--dock:56px}.experience{height:650svh}
 .opening-copy{width:40%;left:4%;top:22%;text-align:left}h1{font-size:clamp(28px,4vw,44px)}.launch{font-size:10px}
 .booth-assembly{--booth-width:calc((var(--stage) - 8px)*.75);left:calc(65% - var(--booth-width)/2)}
 .scene-nav{bottom:6px;gap:16px}.scene-nav button{font-size:10px}.motion-toggle{right:15px;bottom:12px;transform:none;font-size:8px}
 .camera-unit{left:5%;top:35%;width:70px}.camera-unit .lens{width:48px;height:48px}
 .touchscreen{inset:8px 4% 8px 21%;width:auto;margin:0;border-width:5px}
 .screen-heading{height:30px}.choose-content{height:calc(100% - 30px);padding:8px 5%;gap:18px}
 .choose-copy h2{font-size:27px}.choose-copy>p{margin-top:5px}.filter-buttons{margin:9px 0;gap:6px}.filter-thumb{width:25px}.filter-buttons button{font-size:8px;min-width:34px;padding:3px;gap:5px}
 .next-button{min-height:34px;padding:7px 14px;font-size:10px}.frame-preview{width:calc((var(--stage) - 70px)/2.5);min-width:65px}
 .print-copy{top:25%;left:5%;width:42%;text-align:left}.print-copy h2{font-size:32px}.printer{top:12px;left:69%;width:calc((var(--stage) - 35px)/4.65);height:calc(100% - 12px)}
 .print-star{right:9%;font-size:60px}.capture-bottom{font-size:8px}.pose-copy h2{font-size:24px}
}

html:has(body.motion-reduced){scroll-behavior:auto}
.experience{overflow-anchor:none}