/* Keep the existing neutral frame, light typography and live terminal plane. */
body:has(> [role=note] a[href="/__lab"])>[role=note]{position:relative!important}
.heroEyebrow{display:block;font-size:12px;line-height:1.5;margin-bottom:22px;color:var(--text)}
.heroL h1{font-size:clamp(42px,4.1vw,76px);font-weight:300;letter-spacing:-1.8px;line-height:1.06;max-width:13ch}
.heroL .lede{max-width:37ch;font-size:16px;line-height:1.65}
.heroGo{bottom:clamp(90px,14vh,144px)}
.starterReplay{position:absolute;left:var(--pad);bottom:36px;z-index:4;display:inline-flex;align-items:center;gap:12px;padding:4px 0;background:none;border:0;color:var(--text);font:11px var(--sans);cursor:pointer}
.starterReplay:hover{text-decoration:underline;text-underline-offset:5px}
.starterReplay[hidden]{display:none}
.starterReplay:focus-visible,.cmdKey:focus-visible{outline:1px solid var(--vio);outline-offset:5px}
.cmdKey{background:none;color:var(--text);font-family:var(--sans);cursor:pointer}
/* The header stays usable while the introduction types. */
html.preboot .top::before,html.preboot .top .topIn{clip-path:none}
html.preboot .heroEyebrow,html.preboot .starterReplay,html.preboot .poster-transport{visibility:hidden}
html.preboot .heroL{width:min(580px,calc(100vw - 80px))}
html.preboot .heroL h1{max-width:none;font-size:clamp(32px,3.4vw,56px);line-height:1.16}
html.preboot .cmdBox::before{inset:-30px -32px -84px;border-radius:4px;background:#0b0b0b;box-shadow:none}
html.preboot .caret{display:none}
html.preboot .cmdKey{top:calc(100% + 18px)}
html.booting .heroL{transition:transform 1000ms cubic-bezier(.65,0,.3,1)}
html.booting .cmdBox::before{border-radius:4px}
html.booting .top::before,html.booting .top .topIn{animation:none}
.mission-meaning{padding:72px 0}
.mission-meaning>header{max-width:760px}
.mission-meaning h2{font-size:clamp(30px,3.7vw,52px);line-height:1.1;letter-spacing:-1.4px;margin:20px 0}
.mission-meaning header>p{font-size:17px;line-height:1.6;max-width:58ch}
.meaning-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:48px}
.meaning-grid article{border-top:1px solid var(--hair2);padding-top:20px}
.meaning-grid article>b{font-size:12px;font-weight:400}
.meaning-grid h3{font-size:18px;font-weight:400;margin:20px 0 12px}
.meaning-grid p{font-size:13px;line-height:1.7;margin:0}
.meaning-links{display:flex;flex-wrap:wrap;gap:24px;margin-top:32px;font-size:12px}
.meaning-links a{text-decoration:underline;text-underline-offset:5px}
@media(max-width:1100px){.meaning-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:980px){
 .heroL h1{font-size:clamp(38px,7vw,62px);max-width:18ch}
 .heroL .lede{max-width:56ch;font-size:14px}
 .heroGo{bottom:auto}
 .starterReplay{position:relative;left:auto;bottom:auto;order:4;align-self:flex-start;margin:20px var(--pad) 0}
 html.preboot .heroL{position:absolute;left:40px;top:calc(40svh - 80px);margin:0;transform:none!important;width:calc(100vw - 80px)}
 html.preboot .heroL h1{font-size:clamp(32px,6vw,48px);max-width:none}
}
@media(max-width:560px){
 .heroL h1{font-size:39px;letter-spacing:-1.4px;max-width:15ch}
 .heroEyebrow{font-size:11px;margin-bottom:17px}
 .heroGo{gap:8px}.heroGo .go,.heroGo .ghost{width:auto;font-size:11px;padding:0 12px}
 .mission-meaning{padding:44px 0}.mission-meaning header>p{font-size:15px}.meaning-grid{gap:28px 20px;margin-top:30px}.meaning-grid h3{font-size:16px}.meaning-grid p{font-size:12px}
 html.preboot .heroL{left:34px;width:calc(100vw - 68px)}
 html.preboot .cmdBox::before{inset:-24px -16px -82px}
}
@media(max-width:380px){.meaning-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.heroL,.bootCover{animation:none!important;transition:none!important}.starterReplay{display:none}}
/* The typed title keeps its final measure, so unfolding never rewraps the words. */
@media(min-width:981px){
 .heroL{--tTop:calc(var(--hdr) + clamp(36px,8vh,100px));transition:none}
 html.preboot .heroL{width:min(610px,42vw)}
 html.preboot .heroL h1{font-size:clamp(42px,4.1vw,76px);line-height:1.06;max-width:13ch}
}
@media(max-width:980px){html.preboot .heroL{left:var(--pad);width:calc(100vw - var(--pad)*2)}html.preboot .heroL h1{font-size:clamp(38px,7vw,62px);line-height:1.06;max-width:18ch}}
@media(max-width:560px){html.preboot .heroL h1{font-size:39px;max-width:15ch}}
@media(max-width:980px){
 .heroGo{order:1;margin:24px var(--pad) 0}
 .heroStage{order:2}
 .poster-transport{order:3}
}
/* The starter and late market data must not pull the reading position. */
body[data-zena-surface="landing"]{overflow-anchor:none}
