.story-frames{display:grid;isolation:isolate}.story-frames>section{grid-area:1/1;align-self:start;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .7s ease;min-width:0;width:100%}.story-frames>section.is-active{visibility:visible;opacity:1;pointer-events:auto;z-index:1}.story-controls{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:16px 5% 24px;border-bottom:1px solid #ffffff15}.story-controls button,.story-controls a{font:inherit;font-size:12px;color:#aaaab4;background:none;border:0;padding:10px;cursor:pointer;text-decoration:none}.story-controls button[aria-pressed=true]{color:#b2bfff;border-bottom:2px solid #b2bfff}.story-controls a{color:#b2bfff;margin-left:12px}@media(prefers-reduced-motion:reduce){.story-frames>section{transition:none}}/* Only the active scene contributes height, eliminating the tallest-slide gap. */
.story-frames{display:block;position:relative;overflow:hidden}
.story-frames>section{position:absolute!important;top:0;left:0}
.story-frames>section.is-active{position:relative!important;animation:story-reveal .5s ease}
.story-controls{padding:6px 5% 10px;gap:8px}
.story-controls button,.story-controls a{padding:7px 10px}
@keyframes story-reveal{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.story-frames>section.is-active{animation:none}}
.approved-story .story-frames>.hero{min-height:calc(100svh - 130px)}
.approved-story .story-animation+#back-to-creating{padding-top:20px}
/* A measured shared height keeps controls stationary without clipping content. */
.story-frames{height:var(--story-frame-height,auto)}
.story-frames>section.is-active{position:absolute!important}
/* Common footer baseline across all six scenes. */
.story-frames{padding-bottom:48px;box-sizing:content-box}
.approved-story .story-frames>section .number{position:fixed!important;visibility:hidden}
.story-scene-footer{height:38px;display:flex;align-items:center;justify-content:flex-end;padding:0 6%;color:#82828c;font-size:12px;letter-spacing:.15em;margin-top:-38px;position:relative;z-index:3;pointer-events:none}
.story-controls{padding-top:6px}
@media(max-width:850px){.story-scene-footer{font-size:9px;padding:0 5%}.approved-story .story-frames>section .number{display:none!important}}
/* Center each existing composition inside the shared scene area. */
.story-frames>section{top:calc((var(--story-frame-height) - 0px)/2)!important;translate:0 -50%}
.approved-story .story-frames #return-costs,.approved-story .story-frames #collection-waiting{gap:18px}
@media(max-width:850px){.approved-story .story-frames>section{gap:14px!important}.approved-story .story-frames .collection-stage,.approved-story .story-frames .growth-stage,.approved-story .story-frames .launch-main{gap:14px!important}}
/* Bottom-align compositions near the shared scene label. */
.story-frames>section{top:auto!important;bottom:20px!important;translate:none}
.approved-story .story-frames>section{padding-bottom:20px!important}
/* Start every scene directly beneath the header instead of bottom-offsetting it. */
.story-frames>section{top:0!important;bottom:auto!important;translate:none}
.approved-story .story-frames>.hero{padding-top:24px!important}
.story-question{margin:0;padding:24px 6% 10px;color:#b2bfff;font-size:clamp(28px,3.4vw,52px);font-weight:600;line-height:1.15;letter-spacing:-.035em}
/* Size to the current composition, not the tallest hidden scene. */
.story-frames{padding-bottom:0;height:var(--story-frame-height);transition:height .35s ease}
.story-scene-footer{margin-top:0;height:30px}
.story-controls{padding-top:0;padding-bottom:8px}
@media(prefers-reduced-motion:reduce){.story-frames{transition:none}}
/* Fixed presentation area: image dimensions adapt, controls never shift. */
.story-frames{transition:none}
.approved-story .story-frames>section{height:var(--story-frame-height)!important;min-height:0!important;max-height:var(--story-frame-height);box-sizing:border-box;padding-top:20px!important;padding-bottom:20px!important;overflow:hidden}
.approved-story .story-frames .hero .art{inset:0 0 0 22%}
.approved-story .story-frames #launch-workload .launch-main{height:calc(var(--story-frame-height) - 40px);min-height:0;max-height:none}
.approved-story .story-frames #growth-costs .growth-stage{height:calc(var(--story-frame-height) - 40px);width:75%;margin-top:0;margin-bottom:0}
.approved-story .story-frames #growth-costs figure{height:100%;transform:none}
.approved-story .story-frames #growth-costs img{height:100%;object-fit:contain}
.approved-story .story-frames #return-costs{justify-content:center;gap:16px}
.approved-story .story-frames #return-costs img{max-height:calc(var(--story-frame-height) - 190px);width:100%;object-fit:contain}
.approved-story .story-frames #collection-waiting{justify-content:center;gap:12px}
.approved-story .story-frames #collection-waiting .collection-stage,.approved-story .story-frames #collection-waiting .collection-description{transform:none}
.approved-story .story-frames #collection-waiting img{max-height:calc(var(--story-frame-height) - 190px);object-fit:contain}
.approved-story .story-frames #possibilities figure{height:calc(var(--story-frame-height) - 40px)}
.approved-story .story-frames #possibilities img{height:100%;object-fit:contain}
@media(max-width:850px){
.approved-story .story-frames>section{justify-content:center!important;gap:12px!important}
.approved-story .story-frames .hero .art{inset:auto;height:calc(var(--story-frame-height) - 210px);aspect-ratio:auto;flex:none}
.approved-story .story-frames #possibilities figure{height:auto!important}
.approved-story .story-frames #possibilities img,.approved-story .story-frames #launch-workload img,.approved-story .story-frames #growth-costs img,.approved-story .story-frames #return-costs img,.approved-story .story-frames #collection-waiting img{max-height:calc(var(--story-frame-height) - 270px)!important;object-fit:contain!important}
.approved-story .story-frames #launch-workload .launch-main,.approved-story .story-frames #growth-costs .growth-stage{height:auto!important}
.approved-story .story-frames #launch-workload .launch-tasks{height:130px;flex:none}
.approved-story .story-frames #launch-workload .launch-task svg{height:85px}
}
/* Smaller opening artwork, with typography and the shared frame unchanged. */
.approved-story .story-frames .hero .art{scale:.8;transform-origin:center center}
/* Compact phone slideshow: reserve predictable room for copy and media. */
@media(max-width:850px){
.approved-story .story-frames>section{padding:14px 5%!important;justify-content:flex-start!important;gap:10px!important}
.approved-story .story-frames h1,.approved-story .story-frames h2{font-size:clamp(26px,6.8vw,36px)!important;line-height:1.12!important}
.approved-story .story-frames p{font-size:14px!important;line-height:1.4!important}
.approved-story .story-frames .hero .art{height:calc(var(--story-frame-height) - 165px);min-height:180px;scale:1;background-size:contain;background-position:center;flex:none}
.approved-story .story-frames .hero .cue{font-size:11px;margin:0}
.approved-story .story-frames #possibilities img,.approved-story .story-frames #growth-costs img,.approved-story .story-frames #return-costs img{max-height:calc(var(--story-frame-height) - 190px)!important}
.approved-story .story-frames #collection-waiting img{max-height:calc(var(--story-frame-height) - 230px)!important}
.approved-story .story-frames #collection-waiting .collection-bottom{font-size:24px;line-height:1.15}
.approved-story .story-frames #launch-workload img{max-height:calc(var(--story-frame-height) - 295px)!important}
.approved-story .story-frames #launch-workload .launch-tasks{height:110px!important}
.approved-story .story-frames #launch-workload .launch-task svg{height:72px}
.approved-story .story-frames #launch-workload .launch-task p{font-size:11px!important;margin-top:3px!important}
.story-controls{gap:2px;padding:4px 3% 8px}.story-controls button{min-width:38px;min-height:40px;padding:6px;font-size:11px}.story-controls a{font-size:11px;margin-left:0;padding:6px}
.story-scene-footer{height:24px;font-size:9px}.story-question{padding:24px 5% 10px;font-size:30px}
}

/* Prepared images switch atomically: transparent edges must not reveal another scene. */
.story-frames>section{visibility:hidden;opacity:0;transition:none!important;animation:none!important;z-index:0}
.story-frames>section.is-active{visibility:visible;opacity:1;z-index:1}
