/* The direct experience owns its scroll. The homepage keeps its existing layout. */
html:not(.curated-story) body.low-motion #flight{height:534svh!important}
html:not(.curated-story) #flight .flight-sticky{position:sticky!important;top:0;height:100svh;min-height:0;overflow:clip}
html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) .flight-heading{top:clamp(48px,12svh,120px)!important;bottom:auto!important;left:5vw;right:auto;width:28vw;max-width:400px}
html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #flight-title{font-size:clamp(36px,4vw,58px)!important;line-height:1.06!important;max-width:none;margin-top:20px;text-wrap:balance}
html:not(.curated-story) #flight[data-scene="0"]:not(.presentation-mode):not(.recording-tour) #flight-title{font-size:clamp(30px,3vw,48px)!important;word-spacing:.12em;text-wrap:initial}
html:not(.curated-story) #flight .flight-heading .edition-label{display:none}
html:not(.curated-story) #flight .flight-description{font-size:14px;line-height:1.5;max-width:29ch;margin-top:20px}
html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #aircraft-3d{inset:0 0 100px 33%!important;width:67%!important;height:calc(100% - 100px)!important;transform:none}
html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #aircraft-3d:after{background:linear-gradient(90deg,var(--studio-background),transparent 6%),linear-gradient(0deg,var(--studio-background),transparent 9%)}
html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #aircraft-3d>canvas{mask:none!important;-webkit-mask:none!important}
html:not(.curated-story) #flight .inspection-toggle{top:24px;right:5vw;bottom:auto;min-height:44px}
html:not(.curated-story) #flight .scroll-fact{left:5vw;right:auto;top:auto;bottom:146px;max-width:26vw}
html:not(.curated-story) #flight .scroll-fact>strong{font-size:26px}
html:not(.curated-story) #flight .inspect-current-detail{min-height:44px;box-sizing:border-box;display:flex;align-items:center;width:max-content;pointer-events:auto}
html:not(.curated-story) #flight .inspect-current-detail[hidden]{display:none}
html:not(.curated-story) #flight :is(.chapter-progress,.flight-scroll,#film-time){display:none!important}
html:not(.curated-story) #flight .cinema-timeline{left:5vw;right:5vw;bottom:56px;width:auto;gap:16px;grid-template-columns:auto minmax(0,1fr);height:44px}
html:not(.curated-story) body.low-motion #flight .cinema-timeline{grid-template-columns:minmax(0,1fr)}
html:not(.curated-story) body.low-motion :is(#play-flight,#replay-arrival){display:none!important}
html:not(.curated-story) #flight #flight-scrub{width:100%;max-width:none;min-height:44px;margin:0}
html:not(.curated-story) #flight #flight-scrub{appearance:none;-webkit-appearance:none;background:transparent;color:var(--studio-ink)}
html:not(.curated-story) #flight #flight-scrub::-webkit-slider-runnable-track{height:2px;background:color-mix(in srgb,var(--studio-ink) 28%,transparent);border:0;border-radius:0}
html:not(.curated-story) #flight #flight-scrub::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:12px;margin-top:-5px;border:0;border-radius:50%;background:var(--studio-ink)}
html:not(.curated-story) #flight #flight-scrub::-moz-range-track{height:2px;background:color-mix(in srgb,var(--studio-ink) 28%,transparent);border:0}
html:not(.curated-story) #flight #flight-scrub::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--studio-ink)}
html:not(.curated-story) #flight #flight-scrub:focus-visible{outline:2px solid currentColor;outline-offset:0}
html:not(.curated-story) #flight .scene-nav{left:5vw;right:5vw;bottom:8px;gap:12px}
html:not(.curated-story) #flight .scene-nav button{min-height:44px;padding:8px 10px;display:flex;align-items:center;gap:8px;border-top:0;font-size:12px}
html:not(.curated-story) #flight .scene-nav button[aria-current]{background:var(--studio-ink,#242424);color:var(--studio-background,#f3f3f1)!important}
html:not(.curated-story) #flight.flight-stage[data-tone] .scene-nav button[aria-current="step"],html:not(.curated-story) #flight.flight-stage[data-tone] .scene-nav button[aria-current="step"] *{color:var(--studio-background,#f3f3f1)!important}
html:not(.curated-story) #flight .scene-nav button:focus-visible{outline:2px solid currentColor;outline-offset:2px}
html:not(.curated-story) #flight .return-tour{left:5vw;bottom:108px;min-height:44px;background:var(--studio-ink);color:var(--studio-background);border-color:var(--studio-ink)}
html:not(.curated-story) #flight.inspector-open #return-tour{visibility:hidden}
html:not(.curated-story) #flight:not(.scroll-story-active) :is(.scene-nav,.cinema-timeline){visibility:hidden}
html:not(.curated-story) #flight:not(.scroll-story-active) #return-tour{left:5vw;right:auto;bottom:20px;min-height:44px}
html:not(.curated-story) #flight #payload-tour-caption{bottom:112px;right:5vw;left:auto}
/* Keep optional choices in the close-up, with one entry point in the scroll. */
html:not(.curated-story) #flight.scroll-story-active #payload-configurator{left:5vw;right:auto;bottom:114px;width:max-content;padding:0;border:0;background:transparent;box-shadow:none}
html:not(.curated-story) #flight.scroll-story-active #payload-configurator :is(.payload-choices,.payload-summary,.payload-actions){display:none}
html:not(.curated-story) #flight.scroll-story-active #payload-configurator .payload-closeup{min-height:44px;padding:10px 0;border:0;border-bottom:1px solid currentColor;margin:0;background:transparent;color:var(--studio-ink)}
@media(max-width:700px){
 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) .flight-heading{top:24px!important;left:20px;right:20px;width:auto;max-width:none}
 html:not(.curated-story) #flight .flight-heading .eyebrow{min-height:44px;align-items:center}
 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #flight-title{font-size:clamp(30px,8.5vw,42px)!important;line-height:1.07!important;margin-top:14px;max-width:100%;text-wrap:initial}
 html:not(.curated-story) #flight .flight-description{font-size:12px;line-height:1.45;max-width:34ch;margin-top:12px}
 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #aircraft-3d{inset:220px 0 186px!important;width:100%!important;height:calc(100% - 406px)!important}
 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #aircraft-3d:after{background:linear-gradient(180deg,var(--studio-background),transparent 6%,transparent 94%,var(--studio-background))}
 html:not(.curated-story) #flight .inspection-toggle{top:24px;right:20px;padding:8px 12px;font-size:11px}
 html:not(.curated-story) #flight .scroll-fact{left:20px;right:20px;bottom:110px;width:auto;max-width:none;gap:5px;min-height:58px;justify-content:center}
 html:not(.curated-story) #flight .scroll-fact>span{display:none}
 html:not(.curated-story) #flight .scroll-fact>strong{font-size:21px;max-width:48%}
 html:not(.curated-story) #flight .scroll-fact>small{font-size:8px;max-width:48%}
 html:not(.curated-story) #flight .inspect-current-detail{position:absolute;right:0;bottom:5px;max-width:46%;font-size:11px}
 html:not(.curated-story) #flight :is(.scene-nav,.cinema-timeline){left:16px;right:16px}
 html:not(.curated-story) #flight .scene-nav{gap:3px}
 html:not(.curated-story) #flight .scene-nav button{padding:5px 2px;gap:4px;flex-direction:column;font-size:10px;line-height:1.15}
 html:not(.curated-story) #flight .scene-nav button .scene-name-short{font-size:10px}
 html:not(.curated-story) #flight .return-tour{left:20px;bottom:110px}
 html:not(.curated-story) #flight:not(.scroll-story-active) #return-tour{left:20px;bottom:16px}
 html:not(.curated-story) #flight #payload-tour-caption{left:20px;right:20px;bottom:182px;width:max-content;max-width:calc(100% - 40px);font-size:10px}
 html:not(.curated-story) #flight #aircraft-inspector{top:80px!important;bottom:106px;max-height:calc(100svh - 186px)}
 html:not(.curated-story) #flight.scroll-story-active #payload-configurator{left:20px;bottom:112px;max-width:calc(100% - 40px)}
}
@media(max-height:600px) and (orientation:portrait){
 html:not(.curated-story) #flight .flight-description{display:none!important}
 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #aircraft-3d{top:165px!important;height:calc(100% - 325px)!important;bottom:160px!important}
}
@media(max-height:560px) and (orientation:landscape){
 /* A narrow landscape screen cannot use the stacked portrait viewport. */
 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #aircraft-3d{inset:0 0 100px 33%!important;width:67%!important;height:calc(100% - 100px)!important}
 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #aircraft-3d:after{background:linear-gradient(90deg,var(--studio-background),transparent 6%),linear-gradient(0deg,var(--studio-background),transparent 9%)}
 html:not(.curated-story) #flight #aircraft-inspector{top:16px!important;bottom:16px;left:auto;right:16px;width:min(390px,60vw);max-height:calc(100svh - 32px)}
 html:not(.curated-story) #flight .inspector-heading{padding:4px 12px}
 html:not(.curated-story) #flight .inspector-heading h2{margin:0;font-size:20px}
 html:not(.curated-story) #flight #inspection-motion-note{margin:0;padding:4px 12px;font-size:10px;line-height:1.4}
 html:not(.curated-story) #flight .inspector-tabs{padding:0 12px}
 html:not(.curated-story) #flight .inspector-panel{padding:12px}

 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) .flight-heading{top:24px!important;left:24px;width:28vw}
 html:not(.curated-story) #flight:not(.presentation-mode):not(.recording-tour) #flight-title{font-size:clamp(26px,3.5vw,36px)!important;margin-top:12px}
 html:not(.curated-story) #flight .inspection-toggle{top:16px;right:24px}
 html:not(.curated-story) #flight .flight-description{display:none!important}
 html:not(.curated-story) #flight #payload-tour-caption{bottom:106px}
 html:not(.curated-story) #flight .scene-nav button{min-height:44px;font-size:11px}
 /* Close-ups hide the chapter strip, so retain their explicit way back. */
 html:not(.curated-story) #flight:not(.scroll-story-active):has(.engine-study-nav:not([hidden])) #return-tour:not([hidden]){display:block}
}

/* Keep loading and recovery actions clear of the short-screen chapter strip. */
html:not(.curated-story) #flight .model-status{top:auto;bottom:72px;left:24px;right:24px;max-width:320px;text-align:left;box-sizing:border-box}
html:not(.curated-story) #flight .model-retry{top:auto;bottom:16px;left:24px;max-width:calc(100% - 48px)}

/* Two useful next steps, after the final parked composition. */
.scroll-finale[hidden],html.curated-story .scroll-finale{display:none!important}
.scroll-finale{position:absolute;z-index:6;left:5vw;bottom:132px;width:28vw;max-width:410px;color:var(--studio-ink)}
.scroll-finale>div{display:flex;gap:8px;flex-wrap:wrap}
.scroll-finale button,.scroll-finale a,.scroll-finale select{min-height:44px;border:1px solid currentColor;padding:10px 12px;font:12px sans-serif;color:inherit;background:var(--studio-background);text-decoration:none;box-sizing:border-box;cursor:pointer}
.scroll-finale label{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:11px sans-serif;margin-top:12px}
.scroll-finale :focus-visible{outline:2px solid #c85417;outline-offset:3px}
html:not(.curated-story) #flight.scroll-finale-active .scroll-fact{display:none}
@media(max-width:700px){.scroll-finale{left:20px;right:20px;bottom:108px;max-width:none;width:auto}.scroll-finale>div{display:grid;grid-template-columns:1fr 1fr}.scroll-finale label{margin-top:6px;justify-content:space-between}.scroll-finale select{max-width:64%}.scroll-finale a,.scroll-finale button{font-size:11px;display:flex;align-items:center;justify-content:center;text-align:center}}
@media(max-height:550px) and (min-width:701px){.scroll-finale{left:20px;bottom:108px;width:30vw}.scroll-finale label{display:none}.scroll-finale a,.scroll-finale button{font-size:10px;padding:7px}}
@media(max-height:550px) and (max-width:700px){.scroll-finale{left:14px;right:14px;bottom:100px}.scroll-finale label{display:none}.scroll-finale>div{max-width:60%}.scroll-finale a,.scroll-finale button{font-size:10px;padding:7px}}

/* Keep the cutaway below the compact toolbar in phone landscape. */
@media(max-height:550px) and (orientation:landscape){html.curated-story #flight[data-scroll-detail="shell"] #aircraft-3d{transform:none}}
.scroll-finale>.finale-finish{display:block;margin-top:12px}
.scroll-finale select[hidden],#panel-view select[hidden],#panel-view label[hidden]{display:none!important}
.scroll-finale:has(.livery-picker){max-height:calc(100svh - 290px);overflow:auto;overscroll-behavior:auto;scroll-padding:4px;padding:3px}
@media(max-height:550px){.scroll-finale:has(.livery-picker){left:50%;right:14px;width:auto;bottom:100px;max-height:calc(100svh - 180px)}.scroll-finale>.finale-finish{display:block;margin-top:6px}.scroll-finale>div{max-width:none}}
/* The landscape ending gives the aircraft and finish controls separate columns. */
@media(max-height:550px) and (orientation:landscape){
 html:not(.curated-story) #flight.scroll-finale-active:not(.presentation-mode):not(.recording-tour) #aircraft-3d{inset:32px 50% 100px 0!important;width:50%!important;height:calc(100% - 132px)!important}
 html:not(.curated-story) #flight.scroll-finale-active:not(.presentation-mode):not(.recording-tour) #aircraft-3d:after{background:linear-gradient(270deg,var(--studio-background),transparent 6%),linear-gradient(0deg,var(--studio-background),transparent 9%)}
 html:not(.curated-story) #flight.scroll-finale-active:not(.presentation-mode):not(.recording-tour) .flight-heading{top:18px!important;width:42vw}
 html:not(.curated-story) #flight.scroll-finale-active .flight-heading .eyebrow{min-height:0}
 html:not(.curated-story) #flight.scroll-finale-active:not(.presentation-mode):not(.recording-tour) #flight-title{font-size:22px!important;margin-top:8px;max-width:14ch}
}
