/* Readability study. This stylesheet is exported only to preview. */
body[data-readability]{--reading-body:1.25rem;--reading-small:1rem;--reading-label:.875rem;--reading-lead:1.5rem;--muted:#4e6255;font-size:var(--reading-body);line-height:1.6}
body[data-readability] :is(button,input,select,textarea){font-family:inherit}
body[data-readability] #main :is(h1,h2,h3,h4){text-wrap:balance;overflow-wrap:break-word}
body[data-readability] #main h1{font-size:clamp(3rem,2rem + 5vw,7rem);line-height:1.06;letter-spacing:-.055em}
body[data-readability] #main h2{font-size:clamp(2rem,1.35rem + 2.3vw,4rem);line-height:1.15;letter-spacing:-.04em}
body[data-readability] #main h3{font-size:clamp(1.5rem,1.25rem + .6vw,1.875rem);line-height:1.25;letter-spacing:-.025em}
body[data-readability] #main h4{font-size:1.25rem;line-height:1.35}
body[data-readability] #main :is(p,li,dd){font-size:var(--reading-body);line-height:1.65;letter-spacing:normal}
body[data-readability] #main p+p{margin-top:1em}
body[data-readability] #main :is(.label,.micro,.micro-label,.section-label,.boundary-readout-label,.result-name){font-size:var(--reading-label);line-height:1.6;letter-spacing:.025em}
body[data-readability] #main :is(.text-link,.minor-link,.plain-link,.solid-link){font-size:var(--reading-small);line-height:1.5;min-height:2.75rem;gap:1.5rem}
body[data-readability] :is(.desktop-nav a,.header-contact,.menu-open-button,.menu-top button,.top nav,.commercial-footer nav,.footer-top nav,.footer-location,.footer-bottom,.footer-bottomline,.site-footer nav){font-size:var(--reading-small);line-height:1.5}
body[data-readability] :is(.desktop-nav a,.header-contact,.menu-open-button,.top nav a,.site-footer nav a){min-height:2.75rem;align-content:center}
body[data-readability] .desktop-nav{gap:1.5rem}
body[data-readability] .header-contact{margin-left:1rem;gap:1rem}
body[data-readability] .footer-location{line-height:1.7}
body[data-readability] :is(.footer-bottom,.footer-bottomline){gap:1rem;flex-wrap:wrap}
body[data-readability] :is(.skip-link,.skip):not(:focus){top:-10rem;transform:none!important}
body[data-readability] :is(.skip-link,.skip):focus{top:1rem;transform:none!important}
body[data-readability] #site-menu :is(nav span,p){font-size:var(--reading-label)}
body[data-readability] #main :is(.page-deck,.essay-heading>p,.commercial-hero .lead,.section-intro,.case-hero .deck,.guide-cover>p:not(.micro)){font-size:var(--reading-lead);line-height:1.55;max-width:52ch}
body[data-readability] #main .hero-description>p{font-size:var(--reading-lead);line-height:1.5;max-width:30ch}
body[data-readability] #main .hero-description>span{font-size:var(--reading-small);line-height:1.6;max-width:36ch}
body[data-readability] #main .hero-baseline{font-size:var(--reading-label);line-height:1.5;gap:1rem;flex-wrap:wrap}
body[data-readability] #main .scroll-cue{font-size:var(--reading-label)}
body[data-readability] #main .hero-copy .label{font-size:var(--reading-label);max-width:32ch}
body[data-readability] #main :is(.prose,.case-story article){max-width:65ch;font-size:var(--reading-body);line-height:1.65}
body[data-readability] #main .prose :is(p,li){line-height:1.7}
body[data-readability] #main .prose h2{font-size:clamp(1.75rem,1.4rem + 1vw,2.5rem);margin-top:1.5em}
body[data-readability] #main :is(.essay-layout .prose>p:first-child,.about-copy>p:first-child){font-size:var(--reading-lead);line-height:1.6}
body[data-readability] #main :is(.feature-brief>p,.system-record-link p,.programme-context>p,.contact-layout>div>p){max-width:45ch}
body[data-readability] #main :is(.knowledge-answer>p,.trace li,.programme-paper dd,.brief-paper dd,.project-summary dd,.delivery-list p,.lab-main-experiment p){font-size:var(--reading-body);line-height:1.6;max-width:60ch}
body[data-readability] #main :is(.project-register,.knowledge-top,.knowledge-question>span,.source-record,.source-access,.answer-source,.record-heading,.record-caption,.dossier-meta,.paper-heading,.programme-paper dt,.brief-paper dt,.project-summary dt){font-size:var(--reading-label);line-height:1.6;letter-spacing:normal}
body[data-readability] #main :is(.feature-footnote>p,.human-gate>p,.field-caption p,.reference-caveat,.contact-status>p,.form-status,.people-placeholder>p,.engage-output,.guide-toc a,.index-note,.review-notes p,.review-notes li,.exhibit-steps p,.case-story .margin-note){font-size:var(--reading-small);line-height:1.6}
body[data-readability] #main :is(.project-register small,.feature-footnote>span,.knowledge-answer .micro-label,.knowledge-sources .micro-label,.article-grid aside,.essay-layout aside,.journal-index,.case-story aside,.swatch span){font-size:var(--reading-label);line-height:1.6}
body[data-readability] #main :is(.scenario-bar,.scenario-bar button,.trace summary,.system-map-label,.system-map-eyebrow,.system-map-output small,.system-map-core>span){font-size:var(--reading-label);line-height:1.5}
body[data-readability] #main :is(.scenario-bar button,.study-controls button,.workload-switch button,.scenario-choices button,.ascii-controls button,.ascii-lab-controls button){font-size:var(--reading-small);min-height:2.75rem;padding:.625rem .75rem;white-space:normal}
body[data-readability] #main .scenario-bar{gap:1rem;flex-wrap:wrap}
body[data-readability] #main .scenario-bar>div{display:flex;flex-wrap:wrap;gap:.5rem}
body[data-readability] #main .knowledge-top{gap:1rem;flex-wrap:wrap}
body[data-readability] #main .knowledge-body{gap:2rem}
body[data-readability] #main .knowledge-sources{min-width:0}
body[data-readability] #main .source-record{gap:1rem;flex-wrap:wrap}
body[data-readability] #main .system-map-flow{min-width:0;gap:1rem}
body[data-readability] #main .system-source-set>div{font-size:var(--reading-small);line-height:1.5;min-height:3.5rem;gap:.5rem}
body[data-readability] #main .system-map-output p{font-size:1.5rem;line-height:1.35}
body[data-readability] #main :is(.boundary-panel-top,.boundary-node-index,.boundary-node-subtitle,.boundary-return,.boundary-footer,.architecture figcaption){font-size:var(--reading-label);line-height:1.5}
body[data-readability] #main .boundary-node-title{font-size:var(--reading-small);line-height:1.4}
body[data-readability] #main .boundary-select-hint{font-size:var(--reading-label)}
body[data-readability] #main .boundary-readout p:not(.boundary-readout-label){font-size:var(--reading-body);line-height:1.65;max-width:58ch}
body[data-readability] #main .boundary-readout h3{font-size:1.75rem;line-height:1.25}
body[data-readability] #main :is(.ascii-topline,.ascii-topline>span,.ascii-topline>a,.ascii-phases,.ascii-status-row p,.ascii-note-links,.ascii-lab-controls label,.wisp-topline,.wisp-status-row p,.wisp-arrival,.wisp-phases,.wisp-status,.wisp-presence-caption){font-size:var(--reading-label);line-height:1.6}
body[data-readability] #main :is(.ascii-status-row p,.wisp-status-row p){display:flex;flex-wrap:wrap;gap:.25rem 1rem}
body[data-readability] #main :is(.ascii-controls,.wisp-controls summary,.wisp-transcript summary,.wisp-topline button,.wisp-mute){font-size:var(--reading-small);line-height:1.5}
body[data-readability] #main :is(.wisp-consent,.wisp-control-note){font-size:var(--reading-small);line-height:1.6;color:#b8cabc;max-width:60ch}
body[data-readability] #main :is(.ascii-phases,.wisp-phases){color:#b8cabc;gap:1.5rem;flex-wrap:wrap;min-width:0}
body[data-readability] #main :is(.ascii-navigation-row,.ascii-status-row,.wisp-navigation-row,.wisp-status-row){gap:1.25rem;flex-wrap:wrap}
body[data-readability] #main :is(.ascii-topline,.wisp-topline){height:auto;min-height:5rem;gap:1rem;padding-block:1rem;flex-wrap:wrap}
body[data-readability] #main :is(.ascii-status-row h2,.wisp-status-row h2){font-size:1.75rem;line-height:1.25}
body[data-readability] #main :is(.study-disclosure,.plot-key,.result-path,.response-control,#quality-help,.study-data caption){font-size:var(--reading-label);line-height:1.6}
body[data-readability] #main :is(.study-data th,.study-data td,.evidence-table th,.evidence-table td){font-size:var(--reading-small);line-height:1.5;padding:.75rem}
body[data-readability] #main :is(.study-data,.evidence-table){overflow-x:auto;max-width:100%}
body[data-readability] #main :is(.result-copy,.result-path){min-height:0}
body[data-readability] #main :is(label,.form-submit,.form-submit button,.quality-control,.wisp-control-grid select,.contact-layout input,.contact-layout textarea){font-size:var(--reading-small);line-height:1.6}
body[data-readability] #main :is(label>span,.contact-layout label>span,.enquiry-section label>span){font-size:var(--reading-label);line-height:1.5}
body[data-readability] #main :is(input,select,button,summary){min-height:2.75rem}
body[data-readability] #main :is(input,textarea)::placeholder{font-size:var(--reading-small);color:#596c5e}
body[data-readability] #main .enquiry-section :is(input,textarea)::placeholder{color:#b8cabc}
body[data-readability] #main :is(.study-controls,.ascii-lab-controls,.engage-intro-links,.offer-crosslink){gap:1.5rem;flex-wrap:wrap}
body[data-readability] #main :is(.programme-paper,.brief-paper){padding:2rem}
body[data-readability] #main :is(.programme-paper dl>div,.brief-paper dl>div){gap:1rem}
body[data-readability] #main :is(.programme-path,.engage-path,.engage-deliverables){gap:2rem}
body[data-readability] #main :is(.guide-toc a,.review-notes summary){min-height:2.75rem;display:block;padding-block:.5rem}
body[data-readability] #main .exhibit-steps p{max-width:30ch}
body[data-readability] #main .exhibit-steps button{font-size:var(--reading-small);line-height:1.4}
body[data-readability] #main .guide-block :is(p,li){max-width:65ch}
body[data-readability] #main .practice-introduction{padding-block:clamp(3.5rem,7vw,7rem);border-top:1px solid var(--line)}
body[data-readability] #main .practice-topline{display:flex;justify-content:space-between;gap:1.5rem;margin-bottom:3.5rem}
body[data-readability] #main .practice-topline>span{font-size:var(--reading-label);color:var(--muted)}
body[data-readability] #main .practice-layout{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(3rem,8vw,8rem)}
body[data-readability] #main .practice-position h2{font-size:clamp(2.5rem,1.4rem + 3vw,4.25rem);max-width:16ch;margin-bottom:1.75rem}
body[data-readability] #main .practice-position p{max-width:43ch;color:var(--muted)}
body[data-readability] #main .practice-sequence{margin:0;padding:0;list-style:none}
body[data-readability] #main .practice-sequence li{display:grid;grid-template-columns:2rem 1fr;gap:1.25rem;padding:1.75rem 0;border-top:1px solid var(--line)}
body[data-readability] #main .practice-sequence li:first-child{padding-top:0;border-top:0}
body[data-readability] #main .practice-number{font:var(--reading-label)/1.6 var(--mono);padding-top:.4rem;color:var(--muted)}
body[data-readability] #main .practice-sequence h3{margin-bottom:.65rem;font-size:1.75rem}
body[data-readability] #main .practice-sequence p{max-width:46ch;color:var(--muted)}
body[data-readability] #main .practice-next{display:flex;justify-content:space-between;align-items:baseline;gap:2rem;border-top:1px solid var(--line);margin-top:3rem;padding-top:1.5rem}
body[data-readability] #main .practice-next p{font-size:var(--reading-small);color:var(--muted)}
@media(max-width:1100px){
 body[data-readability] .site-header{gap:1.5rem}
 body[data-readability] .desktop-nav{gap:1rem}
 body[data-readability] .header-contact{margin-left:0}
 body[data-readability] #main .knowledge-body{grid-template-columns:1fr}
 body[data-readability] #main .knowledge-sources{display:block}
 body[data-readability] #main .source-record{margin-top:.5rem}
 body[data-readability] #main .source-access{display:block;margin-top:.75rem}
 body[data-readability] #main .programme-spread{gap:2rem}
}
@media(max-width:900px){
 body[data-readability] .desktop-nav,body[data-readability] .header-contact{display:none}
 body[data-readability] .menu-open-button{display:block;margin-left:auto}
 body[data-readability] #main .boundary-path{display:grid;grid-template-columns:1fr;gap:1rem}
 body[data-readability] #main .boundary-node{display:grid;grid-template-columns:4rem 1fr;column-gap:1rem;text-align:left;min-height:7rem;padding:1rem}
 body[data-readability] #main .boundary-node img{grid-column:1;grid-row:1/4;width:4rem;height:4rem;align-self:center}
 body[data-readability] #main .boundary-node :is(.boundary-node-index,.boundary-node-title,.boundary-node-subtitle){grid-column:2;margin:0}
 body[data-readability] #main .boundary-connection{display:none}
 body[data-readability] #main .boundary-panel-top{flex-wrap:wrap;gap:.75rem}
 body[data-readability] #main .boundary-select-hint{max-width:none}
 body[data-readability] #main :is(.architecture figcaption,.boundary-footer){flex-wrap:wrap;gap:1rem}
 body[data-readability] #main .system-map-flow{display:grid;grid-template-columns:1fr}
 body[data-readability] #main .system-map-wire{display:none}
 body[data-readability] #main .system-map-core{margin-block:1rem}
 body[data-readability] #main .practice-layout{grid-template-columns:1fr;gap:2.5rem}
 body[data-readability] #main .practice-position h2{max-width:20ch}
 body[data-readability] #main .practice-position p{max-width:55ch}
 body[data-readability] #main .practice-topline{margin-bottom:2rem}
}
@media(max-width:700px){
 body[data-readability]{--reading-body:1.125rem;--reading-lead:1.25rem;--gutter:24px}
 body[data-readability] #main .hero{min-height:54rem;height:auto;padding-top:8rem;padding-bottom:4rem;display:flex;flex-direction:column}
 body[data-readability] #main .hero-copy{position:relative;top:auto}
 body[data-readability] #main .hero h1{font-size:clamp(2.75rem,1.6rem + 6vw,4rem);line-height:1.08}
 body[data-readability] #main .hero-copy .label{margin-bottom:1.5rem}
 body[data-readability] #main .formation-art{position:relative;inset:auto;width:100%;margin:-1.5rem 0 -2rem;aspect-ratio:1}
 body[data-readability] #main .hero-description{position:relative;inset:auto;max-width:none}
 body[data-readability] #main .hero-description>p{max-width:none}
 body[data-readability] #main .hero-baseline{position:relative;inset:auto;margin-top:2rem;font-size:var(--reading-label)}
 body[data-readability] #main .hero-baseline>span:nth-child(2){display:none}
 body[data-readability] #main .practice-topline{display:block}
 body[data-readability] #main .practice-topline>span{display:block;margin-top:.75rem}
 body[data-readability] #main .practice-position h2{font-size:clamp(2.125rem,1.25rem + 4vw,3rem)}
 body[data-readability] #main .practice-sequence li{grid-template-columns:1.5rem 1fr;gap:1rem}
 body[data-readability] #main .practice-sequence h3{font-size:1.5rem}
 body[data-readability] #main .practice-next{display:block}
 body[data-readability] #main .practice-next .text-link{margin-top:.5rem;width:100%;max-width:30rem}
 body[data-readability] #main .practice-next .text-link span{flex-shrink:0}
 body[data-readability] #main :is(.programme-paper,.brief-paper){padding:1.5rem}
 body[data-readability] #main :is(.programme-paper dl>div,.brief-paper dl>div){grid-template-columns:1fr;gap:.35rem}
 body[data-readability] #main :is(.scenario-bar,.knowledge-top,.record-heading,.record-caption,.dossier-meta,.paper-heading){gap:.75rem;flex-wrap:wrap}
 body[data-readability] #main .knowledge-body{padding:1.5rem;gap:1.5rem}
 body[data-readability] #main .knowledge-sources{padding:1.25rem}
 body[data-readability] #main .knowledge-answer h3{font-size:1.75rem;max-width:none}
 body[data-readability] #main .knowledge-question>p{font-size:1.5rem}
 body[data-readability] #main :is(.source-record,.source-access,.answer-source,.human-gate>p){font-size:var(--reading-label)}
 body[data-readability] #main :is(.ascii-navigation-row,.wisp-navigation-row){display:flex;flex-direction:column;align-items:flex-start}
 body[data-readability] #main :is(.ascii-status-row,.wisp-status-row){display:block}
 body[data-readability] #main :is(.ascii-controls,.ascii-phases,.wisp-phases){gap:1rem}
 body[data-readability] #main :is(.ascii-stage,.wisp-stage){min-height:58rem;max-height:none}
 body[data-readability] #main :is(.ascii-topline>a,.wisp-topline button){margin-left:0}
 body[data-readability] #main :is(.ascii-lab-controls,.study-controls){display:flex;align-items:flex-start;gap:1rem}
 body[data-readability] #main .ascii-lab-controls label{margin-left:0;flex-wrap:wrap}
 body[data-readability] #main .workload-switch{gap:.5rem;flex-wrap:wrap}
 body[data-readability] #main .response-control{max-width:none}
 body[data-readability] #main .study-data table{min-width:34rem}
 body[data-readability] #main .evidence-table{display:block}
 body[data-readability] #main :is(.contact-layout,.form-row,.enquiry-grid){min-width:0}
 body[data-readability] #main :is(.section-topline,.control-title,.journal-index,.feature-footnote){flex-wrap:wrap;gap:1rem}
 body[data-readability] #main .section-topline .text-link{margin-left:0}
 body[data-readability] #main .boundary-panel{padding:1.25rem}
 body[data-readability] #main .boundary-node-title{font-size:var(--reading-small)}
 body[data-readability] #main .boundary-readout{padding:1.5rem 0}
 body[data-readability] #main .guide-cover h1{max-width:100%}
 body[data-readability] .top{gap:1rem;flex-wrap:wrap}
 body[data-readability] .top nav{max-width:none;gap:1rem;flex-wrap:wrap}
 body[data-readability] .site-footer .footer-bottom{display:flex;flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){body[data-readability] #main .formation{height:auto;min-height:0}}
body[data-readability] #main .ascii-lab-controls>div{display:flex;flex-wrap:wrap;gap:.5rem;max-width:100%}
body[data-readability] #main .plot-axis-note{color:#b8cabc}
body[data-readability] #main .hero{max-height:none}
body[data-readability] #main .guide-cover{height:auto;min-height:0}
/* Let larger text determine the height instead of fitting it into fixed slots. */
body[data-readability] #main{overflow-wrap:anywhere}
body[data-readability] #main :where(div,article,section,form,figure,ol,ul){min-width:0}
body[data-readability] .site-header{height:auto;min-height:6.875rem;padding-block:1.5rem;flex-wrap:wrap}
body[data-readability].page-home .site-header{position:relative;inset:auto}
body[data-readability] #main .hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);grid-template-rows:auto auto auto;align-content:center;gap:2rem 0;padding-block:4rem;min-height:calc(100svh - 6.875rem);height:auto}
body[data-readability] #main .hero-copy{position:relative;inset:auto;grid-column:1/-1;grid-row:1}
body[data-readability] #main .hero-description{position:relative;inset:auto;grid-column:1;grid-row:2;max-width:none}
body[data-readability] #main .hero-baseline{position:relative;inset:auto;grid-column:1/-1;grid-row:3;margin-top:0}
body[data-readability] #main .wisp-stage{height:auto;min-height:58rem;max-height:none;overflow:visible}
body[data-readability] #main .wisp-presence{min-height:22rem;flex:1 0 22rem}
body[data-readability] #main .plot-axis-bottom>span:first-child{color:#b8cabc}
body[data-readability] #main .about-mark{overflow:hidden}
body[data-readability] #main :is(.enquiry-section input,.enquiry-section textarea){width:100%;max-width:100%}
@media(max-width:900px){
 body[data-readability] #main .system-map-core{grid-column:auto}
 body[data-readability] #main .system-map-output>div{position:static;display:flex;flex-wrap:wrap;gap:1rem;margin-top:1rem}
 body[data-readability] #main .study-bottom{grid-template-columns:1fr;gap:1.5rem}
 body[data-readability] #main .system-map-label{gap:1rem;flex-wrap:wrap}
 body[data-readability] #main .system-map-label>span:last-child{max-width:none;text-align:left}
}
@media(max-width:700px){
 body[data-readability] #main .hero{display:flex;min-height:0;padding-block:2rem 3rem;gap:1.5rem}
 body[data-readability] #main .formation-art{order:1;margin-block:-1.5rem}
 body[data-readability] #main .hero-description{order:2}
 body[data-readability] #main .hero-baseline{order:3}
 body[data-readability] #main .study-controls{display:grid;grid-template-columns:1fr}
 body[data-readability] #main .quality-control{width:100%}
 body[data-readability] #main .enquiry-section .form-row{grid-template-columns:1fr}
 body[data-readability] #main :is(.system-map,.programme-paper,.brief-paper){max-width:100%}
}
body[data-readability] #main details:not([open])>:not(summary){display:none}
body[data-readability] #main :is(.programme-paper,.brief-paper){transform:none}
@media(max-width:700px){
 body[data-readability] .footer-top{grid-template-columns:1fr;gap:2rem}
 body[data-readability] .footer-location{text-align:left}
 body[data-readability] #main .exhibit-visual{display:none}
 body[data-readability] #main .exhibit-steps{grid-template-columns:1fr}
 body[data-readability] #main .exhibit-steps p{max-width:none}
}
body[data-readability] #main .study-plot{overflow-x:auto;max-width:100%;padding-bottom:1rem}
body[data-readability] #main .study-plot :is(svg,.plot-axis-title,.plot-axis-bottom){min-width:50rem}
body[data-readability] #main .reading-chart-hint{font-size:var(--reading-small);line-height:1.6;margin-bottom:1rem;max-width:50ch}
body[data-readability] #main .exhibit-visual{overflow-x:auto}
body[data-readability] #main .exhibit svg{min-width:68.75rem}
@media(max-width:1100px){body[data-readability] #main .exhibit-visual{display:none}}
body[data-readability] #main .ascii-stage{height:auto;max-height:none;overflow:visible}
body[data-readability] #main .ascii-canvas-wrap{min-height:22rem}
body[data-readability] #main .ascii-is-pinned .ascii-stage,
body[data-readability] #main .wisp-is-pinned .wisp-stage{height:100svh;min-height:0;max-height:none}
body[data-readability] #main .ascii-is-pinned .ascii-canvas-wrap,
body[data-readability] #main .wisp-is-pinned .wisp-presence{min-height:140px;flex:1 1 0}
body[data-readability] #main .wisp-is-pinned .wisp-scroll-track{height:150svh}
body[data-readability] #main .wisp-controls-follow .wisp-stage{overflow:hidden}
body[data-readability] #main .wisp-controls-follow .wisp-topline{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem}
body[data-readability] #main .wisp-controls-follow .wisp-topline button{max-width:9.5rem;gap:.5rem}
body[data-readability] #main .wisp-controls-follow .wisp-presence{margin-bottom:1.5rem}
body[data-readability] #main .wisp-controls-follow>.wisp-bottomline{padding-top:2rem}
body[data-readability] #main .wisp-controls-follow .wisp-stage>.wisp-conversation{flex-shrink:0;margin-bottom:1rem;min-height:0}
body[data-readability] #main .study-disclosure{white-space:normal}
body[data-readability] #main .brief-stack::before,
body[data-readability] #main .brief-stack::after{transform:none}
/* Keep the sculptural image out of the reading area at desktop sizes. */
@media(min-width:701px){
 body[data-readability] #main .hero{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:2rem}
 body[data-readability] #main .hero-copy{grid-column:1;grid-row:1}
 body[data-readability] #main .hero h1{font-size:clamp(3rem,1.5rem + 4vw,5.5rem)}
 body[data-readability] #main .formation-art{position:relative;inset:auto;grid-column:2;grid-row:1/3;align-self:center;width:100%;height:auto;aspect-ratio:1;margin:0}
 body[data-readability] #main .hero-baseline{padding-top:1rem}
}

/* The first scroll animates the held hero. Reading continues after the film. */
body[data-readability].page-home:has(.formation.is-scroll-driven) .site-header{position:absolute;inset:0 0 auto}
body[data-readability] #main .formation.is-scroll-driven{height:calc(var(--hero-stage-height,100svh) + 100svh);min-height:0}
body[data-readability] #main .formation.is-scroll-driven .hero{top:0;min-height:100svh;padding-top:calc(var(--hero-header-height,6.875rem) + 4rem)}
@media(max-width:700px){
 body[data-readability] #main .formation.is-scroll-driven .hero{padding-top:calc(var(--hero-header-height,6.875rem) + 2rem)}
}
@media(max-width:700px),(max-height:600px){
 body[data-readability] #main .formation.is-scroll-driven .formation-art{max-height:var(--hero-art-room,100svh);align-self:start}
}