/* Story reading scale: metadata stays readable without competing with narration. */
#hud{font-size:14px;line-height:1.5;letter-spacing:.055em;top:108px;color:#b5bcaf;max-width:calc(100% - 2 * var(--gut))}
#hud i{width:5px;height:5px;flex-shrink:0}
.embedded-label{display:flex;align-items:center;gap:9px;font:13px/1.4 var(--mono);letter-spacing:.06em;color:#b5bcaf;white-space:nowrap}
.embedded-label span+span:before{content:'/';margin-right:9px;color:#727a6c}
.story-embedded .site-header{height:84px;padding-right:calc(var(--gutter) + 172px)}
.story-embedded .site-header .header-actions{gap:12px}
.site-header #motionBtn,.site-header #langBtn{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid #464c43;background:#090a0a;color:#e7e8e2;font:14px/1 var(--sans)}
.site-header #motionBtn{font-size:18px}
.site-header #motionBtn:hover,.site-header #langBtn:hover{background:#1c211a;border-color:#89937f}
.eyebrow,.chapter-kicker,.cap p:before{font-size:12px;line-height:1.5;letter-spacing:.09em}
.hero-description{font-size:16px}.hero-cta{font-size:14px}
.story-hero-caption,.story-hero-bottom,.rail-label{font-size:12px;line-height:1.6;letter-spacing:.04em;color:#aeb7a5}
.chapter-rail a{min-height:44px;font-size:13px;color:#aeb7a5}.chapter-rail a b{font-size:12px;color:inherit}
.chapter-rail,body.light-ui .chapter-rail{background:inherit}
.chapter-rail[hidden]{display:none!important}
.gapline,.note,.gnote{font-size:14px;line-height:1.65}
.term pre{font-size:13px}.install-mini code{font-size:12px}
.lab,.lab.screen span{font-size:12px}.lab.layer,.lab.evidence,.lab.scene-note span{font-size:11px;letter-spacing:.035em}
@media(max-width:760px){
 .story-embedded .site-header{height:72px;padding-right:calc(var(--gutter) + 108px);gap:8px}
 .story-embedded .site-header .header-actions{gap:8px}
 .embedded-label{flex-direction:column;align-items:flex-start;gap:1px;font-size:11px;letter-spacing:.025em}
 .embedded-label span+span:before{display:none}
 #hud{top:94px;font-size:12px;line-height:1.5;overflow:visible}
 #hud span{white-space:normal;overflow:visible}
 .eyebrow,.chapter-kicker,.cap p:before{font-size:11px}
 .hero-description{font-size:15px}.hero-cta{font-size:14px}
 .story-hero-caption{font-size:11px}.story-hero-bottom{font-size:11px;gap:18px}
 .story-hero-bottom>span:last-child{max-width:155px}
 .chapter-rail{gap:4px}.chapter-rail a{font-size:12px;gap:3px}.chapter-rail a b{font-size:11px}
 .lab,.lab.screen span,.lab.layer,.lab.evidence,.lab.scene-note span{font-size:10px;letter-spacing:0}
 .term pre{font-size:12px}
}
.site-header #motionBtn:focus-visible,.site-header #langBtn:focus-visible{outline:2px solid #bac4ae;outline-offset:-5px}

@media(max-width:760px){html[lang=en] .chapter-rail{gap:0}html[lang=en] .chapter-rail a{min-width:0;text-align:center;line-height:1.35}}
@media(max-width:360px){html[lang=en] .chapter-rail a{font-size:11px}}

/* The sixth act is an six-beat scroll demonstration, not a control panel. */
#gal{height:700vh;min-height:4700px}
#gal .demo-stick{padding-top:156px;padding-bottom:100px;justify-content:space-between}
.demo-heading{max-width:720px}.demo-heading .chapter-kicker{margin-bottom:16px}
.demo-heading h2{font-size:clamp(28px,3.4vw,46px);line-height:1.25}
.demo-caption{width:430px;max-width:100%;align-self:flex-start}
.demo-step{display:flex;gap:22px;font:12px/1.5 var(--fm);color:#aeb7a5;letter-spacing:.06em}
.demo-caption h3{font-size:26px;margin:10px 0}.demo-caption>p{font-size:14px;line-height:1.7;color:#b5bcaf;max-width:410px}
.demo-caption .demo-scroll{font-size:12px;margin-top:12px;color:#aeb7a5}
body.gallery-paper .demo-heading,body.gallery-paper .demo-caption{color:#1c2018}
body.gallery-paper .demo-step,body.gallery-paper .demo-caption>p,body.gallery-paper #hud{color:#434c3c}
#rw{height:240vh;min-height:1400px}#rw .stick{justify-content:center}
.rwbig{font-size:clamp(40px,7vw,100px);line-height:1.2;text-shadow:none}.rwtc{font-size:18px;line-height:1.5;color:#bcc5b4}
@media(max-width:760px){
 #gal{height:700svh;min-height:4400px}#gal .demo-stick{padding-top:145px;padding-bottom:90px}
 .demo-heading .chapter-kicker{margin-bottom:12px}.demo-heading h2{font-size:28px;max-width:310px}
 .demo-caption h3{font-size:22px}.demo-caption>p{font-size:13px;max-width:320px}.demo-caption .demo-scroll{font-size:11px}
 #rw{height:230svh;min-height:1200px}.rwbig{font-size:42px}.rwtc{font-size:14px}
}

#rw .stick{background:radial-gradient(ellipse at center,rgba(8,9,9,.8),rgba(8,9,9,.35) 35%,transparent 70%)}

body.gallery-paper .embedded-label{color:#434c3c}