/* Keep the story animated on phones, using a stable small viewport height. */
html:has(.story-scroll){scroll-padding-top:var(--nav)}
.story-scroll.mobile-story{height:240svh}
.mobile-story .story-sticky{position:sticky;top:var(--nav);height:calc(100svh - var(--nav));min-height:0;padding:18px 0 10px;display:flex;flex-direction:column;align-items:center;gap:10px;overflow:hidden}
.mobile-story .story-inner{display:grid;grid-template-columns:1fr;grid-template-rows:clamp(166px,25svh,208px) minmax(0,1fr);gap:12px;align-items:stretch;flex:1;min-height:0;width:calc(100% - var(--gutter)*2);max-height:640px}
.mobile-story .story-copy{display:block;min-height:0;height:100%}
.mobile-story .story-chapter{position:absolute;inset:0;display:flex;justify-content:center;opacity:0;visibility:hidden;transform:translateX(12px);pointer-events:none;transition:opacity .3s ease,transform .45s ease,visibility 0s}
.mobile-story .story-chapter.active{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.mobile-story .story-chapter .eyebrow{font-size:10px;letter-spacing:.12em}
.mobile-story .story-chapter h2{font-size:clamp(32px,8.8vw,40px);line-height:1.08;max-width:none;margin:12px 0}
.mobile-story .story-chapter p{font-size:13px;line-height:1.6;max-width:none}
.mobile-story .story-board{height:100%;min-height:0;aspect-ratio:auto;padding:15px;display:flex;flex-direction:column;border-radius:calc(12px*(1 - var(--scene,0)));overflow:hidden}
.mobile-story .board-caption{font-size:10px;line-height:1.4;gap:10px}
.mobile-story .board-caption>span:first-child{max-width:17ch}
.mobile-story .board-caption>span:last-child{text-align:right}
.mobile-story .evidence-canvas{height:auto;min-height:0;flex:1;margin-top:12px}
.mobile-story .scene-panel{display:grid;grid-template-rows:auto minmax(0,1fr);visibility:hidden;transform:translateX(18px);transition:opacity .3s ease,transform .45s ease,visibility 0s}
.mobile-story .scene-panel.active{visibility:visible;transform:translateX(0)}
.mobile-story .scene-panel h3{font-size:22px;line-height:1.1;max-width:none;margin-bottom:12px}
.mobile-story .evidence-records{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:8px;min-height:0}
.mobile-story .evidence-record{grid-template-columns:1fr;gap:2px;padding:9px 11px;align-content:center}
.mobile-story .evidence-record strong{font-size:21px;line-height:1.1}
.mobile-story .record-meta{font-size:10px;line-height:1.3;letter-spacing:.025em}
.mobile-story .record-note{font-size:11px;line-height:1.35;max-width:none}
.mobile-story .record-open{display:none}
.mobile-story .scene-0 .evidence-record:nth-child(2){margin-left:5px}
.mobile-story .scene-0 .evidence-record:nth-child(3){margin-left:10px}
.mobile-story .scene-1 .evidence-records{padding-left:13px}
.mobile-story .evidence-route{top:45px;height:calc(100% - 45px);width:13px}
.mobile-story .board-footer{display:none}
.mobile-story .story-markers{position:static;bottom:auto;left:auto;right:auto;width:calc(100% - var(--gutter)*2);margin:0 auto;gap:10px;flex:0 0 auto;display:flex}
.mobile-story .story-markers button{min-height:44px;font-size:10px;line-height:1.4;padding:10px 0}
@media(max-height:740px){
 .mobile-story .story-inner{grid-template-rows:166px minmax(0,1fr);gap:9px}
 .mobile-story .story-sticky{padding-top:12px;padding-bottom:6px;gap:8px}
 .mobile-story .story-chapter h2{font-size:32px;margin:9px 0}
 .mobile-story .story-chapter p{font-size:12px;line-height:1.5}
 .mobile-story .story-board{padding:11px}
 .mobile-story .scene-panel h3{font-size:20px;margin-bottom:9px}
 .mobile-story .evidence-canvas{margin-top:8px}
 .mobile-story .record-note{display:none}
 .mobile-story .evidence-record{padding:7px 10px}
 .mobile-story .evidence-record strong{font-size:20px}
 .mobile-story .evidence-records{gap:6px}
}
.landscape-story .story-inner{grid-template-columns:1fr 1.1fr;grid-template-rows:minmax(0,1fr);gap:25px}
.landscape-story .story-chapter h2{font-size:30px}
.landscape-story .story-chapter p{font-size:12px;max-width:38ch}
.landscape-story .story-board{padding:11px}
.landscape-story .board-caption{font-size:9px}
.landscape-story .scene-panel h3{font-size:20px}
.landscape-story .record-note{display:none}
.landscape-story .evidence-record strong{font-size:19px}
@media print{
 .story-scroll.mobile-story{height:auto}
 .mobile-story .story-sticky{position:static;height:auto;overflow:visible}
 .mobile-story .story-inner{display:block;max-height:none}
 .mobile-story .story-copy{height:auto}
 .mobile-story .story-chapter,.mobile-story .scene-panel{position:static;opacity:1;visibility:visible;transform:none;display:block;margin-bottom:25px}
 .mobile-story .evidence-canvas{height:auto}
 .mobile-story .record-note{display:block}
 .mobile-story .story-markers{display:none}
}

@media(max-height:620px){.mobile-story:not(.landscape-story) .board-caption{display:none}.mobile-story:not(.landscape-story) .evidence-canvas{margin-top:0}}
