@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/cormorant-garamond-regular.woff') format('woff')}
/* Reference 03: an open editorial page, with Reference 01's Research engraving.
   Raster plates are still; independently framed SVG geometry carries the motion. */
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/eb-garamond-regular.woff') format('woff')}
@font-face{font-family:"EB Garamond";font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/eb-garamond-italic.woff') format('woff')}
:root{--paper:#f7f5ef;--sheet:#f3efe4;--ink:#231f1a;--ink2:#625b53;--mute:#766f64;--rule:#d5cec1;--sepia:#7b6d5b;--display:"Cormorant Garamond","EB Garamond",Garamond,Georgia,serif;--body:"EB Garamond",Garamond,Georgia,serif;--gutter:clamp(24px,6.7vw,104px);--max:1536px;color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:24px;scrollbar-gutter:stable}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:20px;line-height:1.4;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100svh}
main{flex:1}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit}img{max-width:100%}::selection{background:#e1d9c9}
a:focus-visible,button:focus-visible{outline:2px solid var(--sepia);outline-offset:6px}
.wrap{width:100%;max-width:var(--max);padding-inline:max(var(--gutter),env(safe-area-inset-left));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:fixed;z-index:50;left:24px;top:12px;padding:12px 20px;background:var(--paper);transform:translateY(-150%)}.skip-link:focus{transform:none}
.nav{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:28px;position:relative;z-index:10}
.wordmark{font-size:34px;line-height:1;text-decoration:none;white-space:nowrap;letter-spacing:-.025em}
.nav ul{list-style:none;display:flex;align-items:center;gap:clamp(22px,2.4vw,38px);padding:0;margin:0}
.nav nav a{font-size:17px;text-decoration:none;display:block;padding-block:14px;white-space:nowrap}
.nav nav a:hover,.nav nav a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.nav .sep{height:26px;width:1px;background:#bfb8ad;margin-inline:10px}.arr{font-size:.85em;margin-left:.2em}.dot{margin-inline:.2em}
.menu-toggle{display:none}
.eyebrow,.label{font-size:14px;font-weight:400;letter-spacing:.23em;text-transform:uppercase;margin:0;color:var(--ink2);line-height:1.5}
.eyebrow{color:var(--sepia);font-size:13px;letter-spacing:.25em}
.label{font-size:16px;text-transform:none;letter-spacing:.035em}
.lede{font-size:25px;line-height:1.32;color:var(--ink2);margin:0;max-width:23em;font-weight:400}
.links{list-style:none;display:flex;flex-wrap:wrap;gap:18px 46px;padding:0;margin:48px 0 0}
.links a{display:inline-block;text-decoration:none;font-size:22px;line-height:1.4;border-bottom:1px solid #8c8376;padding:7px 0;transition:color .2s,border-color .2s}
.links a.secondary{color:var(--ink2);border-color:#bfb8ad}.links a:hover{color:var(--sepia);border-color:currentColor}
.hero{position:relative;display:grid;grid-template-columns:51% 49%;align-items:center;min-height:808px;padding-top:20px;padding-bottom:86px}
.hero-text{position:relative;z-index:2;padding-bottom:7px}
.title{font-family:var(--display);font-size:clamp(62px,7.45vw,114px);line-height:.98;letter-spacing:-.025em;font-weight:400;margin:44px 0 27px}
.hero .title span{display:block;white-space:nowrap}.hero .lede{max-width:21em;padding-right:40px}.hero .links{margin-top:46px}
.scientific-figure{position:relative;min-width:0;margin:0;isolation:isolate}.engraving{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.art-hero{width:100%;max-width:none;justify-self:end;margin-right:-2%;margin-left:-3%;align-self:center}
.art-hero .engraving{clip-path:polygon(7% 0,76% 0,76% 22%,100% 22%,100% 100%,7% 100%);opacity:.82}
.geometry{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.hero-orbits{opacity:.13;inset:18% 8% 0;width:82%;height:68%;animation:orbit-drift 120s linear infinite;animation-play-state:paused;z-index:-1;transform-origin:center}
.in-view .hero-orbits{animation-play-state:running}
.figlabel{position:absolute;left:-2%;top:10%;font-size:21px;font-style:italic;color:var(--mute)}
.figcap{position:absolute;right:0;top:6%;font-size:12px;letter-spacing:.15em;text-transform:uppercase;line-height:1.8;color:var(--mute);margin:0}
.scroll-cue{position:absolute;bottom:39px;left:var(--gutter);text-transform:none;letter-spacing:.025em;font-size:14px;color:var(--mute);text-decoration:none;padding:10px 0}.scroll-cue span{font-size:29px;vertical-align:middle;color:var(--ink);margin-right:24px;line-height:1}
.panel{position:relative;display:grid;grid-template-columns:44% 48%;column-gap:8%;align-items:center;min-height:850px;padding-block:100px;border-top:1px solid #e6e1d7}
.panel-text{min-width:0}.num{font-size:27px;color:var(--mute);line-height:1;margin-bottom:25px;font-variant-numeric:lining-nums}.num::after{content:"";display:block;width:28px;height:1px;background:#9d9487;margin-top:12px}
.panel h2{font-family:var(--display);font-size:clamp(48px,5.1vw,78px);font-weight:400;line-height:1.04;letter-spacing:-.035em;margin:36px 0 28px}.panel .lede{max-width:21em}.panel .links{margin-top:44px;gap:18px 44px}
.question{grid-template-columns:35% 46% 15%;column-gap:2%;min-height:880px;padding-block:70px}
.question .num{font-size:76px;color:#9c9384;margin-bottom:32px}.question .num::after{width:100%;background:var(--rule);margin-top:20px}.question h2{font-size:clamp(43px,4.8vw,74px);line-height:1.09;margin-top:40px}.question .lede{font-size:22px;max-width:20em;margin-top:28px}
.art-human{width:100%;justify-self:center}.art-human .engraving{opacity:.78;clip-path:inset(0 7% 0 4%)}.human-construction{opacity:.035}
.has-entered .human-construction{animation:construction-appear 1.8s ease both;animation-play-state:paused}.has-entered.in-view .human-construction{animation-play-state:running}
.section-index{align-self:center;padding-left:8px}.section-index ol{list-style:none;margin:0;padding:0;display:grid;gap:18px}.section-index a{display:flex;align-items:baseline;gap:16px;font-size:17px;color:var(--mute);text-decoration:none;padding:5px 0 5px 20px;border-left:1px solid transparent;white-space:nowrap}.section-index a span{font-size:13px;font-variant-numeric:lining-nums}.section-index a[aria-current],.section-index a:hover{color:var(--ink);border-color:var(--ink)}
.latin{font-style:italic;font-size:26px;color:var(--mute);line-height:1.25;margin:125px 0 0 50px}
.arena{padding-bottom:190px;min-height:880px}.arena .lede{max-width:19em}.art-arena{width:100%;align-self:center;margin-top:15px}.chart-head{display:flex;justify-content:space-between;gap:15px;margin:0 2% 4px}.chart-head p{font-size:15px;letter-spacing:.015em;text-transform:none;color:var(--mute);margin:0}.chart-head p:last-child{text-align:right}.chart-head em{display:block;font-size:17px;letter-spacing:0;text-transform:none;margin-top:5px}
.forecast{width:100%;height:auto;display:block;overflow:visible;color:#9b978a}.construction{fill:none;stroke:#a99f8f;stroke-width:.7;stroke-dasharray:5 5;opacity:.5}.forecast-curves{stroke:#938977;stroke-width:.7;opacity:.65;filter:drop-shadow(0 0 .4px rgb(83 65 46 / 14%))}.forecast-curves path{stroke-dasharray:none;stroke-dashoffset:0;stroke-linecap:round;vector-effect:non-scaling-stroke}.forecast-nodes{color:#706a5e}.forecast-open{fill:var(--paper);stroke:#8c8373;stroke-width:.8}.outcome-nodes{fill:var(--paper);stroke:var(--ink);stroke-width:1;opacity:1}.outcome-nodes .solid{fill:var(--ink)}
/* A complete scientific plate, with no staged line or node reveal. */
.arena-timeline{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);padding:0;position:absolute;left:13%;right:13%;bottom:84px;margin:0;color:var(--ink2);text-align:center;font-size:20px;font-style:italic}.arena-timeline::before{content:"";position:absolute;left:16.6%;right:16.6%;height:1px;background:#aaa293;top:0}.arena-timeline::after{content:"→";position:absolute;left:84%;top:-15px;color:#9c9383;font-size:20px}.arena-timeline li{position:relative;padding-top:26px}.arena-timeline li span{position:absolute;top:-6px;left:calc(50% - 6px);width:12px;height:12px;background:var(--ink);border:1px solid var(--ink);border-radius:50%}.arena-timeline li:nth-child(2) span{background:var(--paper)}
.research{grid-template-columns:52% 40%;min-height:850px}.research h2{font-size:clamp(48px,4.8vw,74px)}.research .lede{max-width:24em}.art-research{width:78%;justify-self:center}.art-research .engraving{opacity:.92}.research-layers{position:absolute;inset:0;opacity:.16;pointer-events:none}.research-vector{display:block;width:100%;height:100%;overflow:visible}.layer-top{--settle:-8px}.layer-one{--settle:8px}.layer-two{--settle:12px}.layer-three{--settle:16px}.has-entered .research-layers .layer{animation:layer-settle 1.8s ease both;animation-play-state:paused}.has-entered.in-view .research-layers .layer{animation-play-state:running}.research-caption{font-size:17px;font-style:italic;color:var(--mute);text-align:center;white-space:nowrap;margin:24px -40px 0}
.publications{min-height:880px;grid-template-columns:43% 49%}.publications .links{gap:16px 34px}.publications .links a{font-size:21px}
.paper-stack{container-type:inline-size;position:relative;display:block;width:80%;aspect-ratio: .71;margin:20px 16% 20px 0;justify-self:center;text-decoration:none;isolation:isolate}.paper-front,.paper-back{position:absolute;inset:0;background:var(--sheet);border:1px solid #d7d0c2}.paper-back-one{transform:translate(13%,4.5%);background:#f0ece1;z-index:-1}.paper-back-two{transform:translate(30%,9%);background:#eeeade;z-index:-2}.paper-back span{display:block;margin:30% 12%;height:56%;opacity:.25;background:repeating-linear-gradient(transparent 0 9px,#a69a85 9px 10px)}
.paper-front{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;row-gap:3.5%;padding:7% 10% 6%;transition:transform .45s ease;box-shadow:3px 7px 20px #6455410b}.paper-stack:hover .paper-front,.paper-stack:focus-visible .paper-front{transform:translate(-3px,-4px)}.paper-meta{display:flex;justify-content:space-between;gap:12px;text-transform:uppercase;letter-spacing:.15em;font-size:10px;color:var(--mute)}.paper-front h3{font-family:var(--body);font-weight:400;font-size:clamp(22px,2.05vw,31px);line-height:1.19;letter-spacing:-.015em;margin:9% 0 0}
/* Code-drawn orbital plate; cover metadata is real HTML, not generated image text. */
.paper-engraving{position:relative;width:112%;margin:4% -6% 0;aspect-ratio:500/480;flex-shrink:0}.paper-engraving img{display:block;width:100%;height:auto}.paper-author{text-transform:uppercase;letter-spacing:.22em;text-align:center;font-size:11px;color:var(--ink2);margin:auto 0 0;padding-top:2%}.paper-year{font-size:13px;text-align:center;color:var(--ink2);margin:5% 0 0}
.foot{border-top:1px solid var(--rule);padding-block:38px 48px;display:flex;justify-content:space-between;align-items:center;gap:20px 40px;flex-wrap:wrap}.foot .name{font-size:30px;letter-spacing:-.02em}.foot .meta{font-size:17px;color:var(--mute);margin:8px 0 0}.foot nav a{font-size:19px;text-decoration:none;padding:12px 0}.foot nav a:hover{text-decoration:underline;text-underline-offset:5px}.motion-toggle{font-size:14px;line-height:1.4;color:var(--mute);background:none;border:0;min-height:44px;padding:12px 0;cursor:pointer}
/* Shared typography for the existing clean-URL pages. */
.page{padding-block:110px 160px}.page .title{font-size:80px;margin:28px 0 36px}.page .lede{max-width:32em}.page .lede a{text-underline-offset:5px;text-decoration-thickness:1px}.pubs{list-style:none;padding:0;margin:65px 0 0;max-width:960px}.pub{padding:36px 0;border-top:1px solid var(--rule)}.pub .meta{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin:0 0 18px}.pub h2{font-weight:400;font-size:38px;line-height:1.13;margin:0 0 20px}.pub h2 a{text-decoration:none}.pub h2 a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}.pub .who{font-size:22px;line-height:1.4;color:var(--ink2);max-width:42em}.pub .links{margin-top:25px}
@keyframes orbit-drift{to{transform:rotate(360deg)}}
@keyframes construction-appear{from{opacity:0}to{opacity:.035}}
@keyframes layer-settle{from{transform:translateY(var(--settle));opacity:0}to{transform:none;opacity:1}}
.page-hidden *{animation-play-state:paused!important}
.reduce-motion *,.reduce-motion *::before,.reduce-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:no-preference){html:not(.reduce-motion){scroll-behavior:smooth}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Keep the cover typesetting inside its page at every responsive size. */
.paper-front h3{font-size:6.4cqw;margin:5% 0 0;line-height:1.2}
.paper-engraving{width:100%;height:100%;min-height:0;aspect-ratio:auto;margin:0}
.paper-engraving img{width:100%;height:100%;object-fit:contain}
.paper-meta{font-size:clamp(7px,2cqw,10px)}
.paper-author{font-size:clamp(7px,2.4cqw,11px);margin:0;padding:0}
.paper-year{font-size:clamp(8px,2.6cqw,13px);margin:0}


/* Geometric 3D plates. The engraving keeps layout stable and remains the fallback. */
.scientific-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;touch-action:pan-y pinch-zoom;cursor:grab}
.scientific-canvas:not([hidden]){display:block}
/* Soft capillary ink edges follow the same transparent drawing in both modes.
   Both scientific plates share this treatment; type and controls retain crisp edges. */
:is([data-three-d-variant="hero"],[data-three-d-variant="research"])>.scientific-canvas{filter:drop-shadow(0 .15px 1.1px rgb(83 65 46 / 26%)) drop-shadow(0 0 1.8px rgb(90 70 48 / 10%)) blur(.48px)}
/* At phone scale, keep the ink core sharp; only its faint halo softens. */
@media(max-width:759px){:is([data-three-d-variant="hero"],[data-three-d-variant="research"])>.scientific-canvas{filter:drop-shadow(0 .05px .3px rgb(83 65 46 / 12%))}}
.scientific-canvas.is-dragging{cursor:grabbing}
.scientific-canvas:focus-visible{outline:1px solid var(--sepia);outline-offset:8px}
.art-3d-ready>.engraving{opacity:0}
.art-3d-ready>.hero-orbits,.art-3d-ready>.research-layers{display:none}
.art-3d-ready .figlabel{z-index:3;pointer-events:none}
.figure-controls{position:absolute;bottom:-24px;right:4%;z-index:4;display:flex;align-items:center;gap:18px;font-size:13px;color:var(--mute)}
.figure-controls[hidden]{display:none}
.figure-controls button{font-family:var(--body);font-size:13px;min-width:44px;min-height:44px;cursor:pointer;border:0;background:none;color:var(--mute);padding:8px 6px}
.figure-controls button[aria-pressed="true"]{color:var(--ink2)}
.figure-controls button:hover,.figure-controls button:focus-visible,.motion-toggle:hover,.motion-toggle:focus-visible{color:var(--ink)}
/* Reveal drawing controls on approach; keep keyboard and touch access intact. */
@media(min-width:760px) and (hover:hover) and (pointer:fine){
  .scientific-figure .figure-controls{opacity:0;transition:opacity .18s ease}
  .scientific-figure:is(:hover,:focus-within) .figure-controls{opacity:1}
}
@media(hover:none){.figure-controls>span{display:none}}
.art-3d-ready[data-view="still"] .figure-controls>span{visibility:hidden}
.art-3d-ready[data-view="still"]>.scientific-canvas{cursor:default;pointer-events:none}
.art-research .figure-controls{right:0;bottom:-35px}

/* Responsive reading layout. Text and illustrations stay in document flow;
   the reference proportions are minimum dimensions, never fixed crop boxes. */
:root{--gutter:clamp(22px,6.7vw,104px);--stage-width:min(100vw,1536px);--stage-height:calc(var(--stage-width)*.6609);--nav-height:80px}
.skip-link{clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap;padding:0}
.skip-link:focus{clip-path:none;width:auto;height:auto;overflow:visible;padding:12px 20px}
.nav{min-height:var(--nav-height);height:auto;gap:12px 24px;flex-wrap:wrap;background:var(--paper)}
.wordmark{font-size:clamp(28px,2.2vw,34px)}
.nav nav{margin-left:auto;max-width:100%}
.nav ul{gap:4px clamp(22px,2.6vw,38px);flex-wrap:wrap;justify-content:flex-end}
.nav nav a{font-size:clamp(16px,1.2vw,18px);min-height:44px;display:flex;align-items:center}
.nav .sep{height:26px;margin-inline:4px}
.links a{min-height:44px;display:inline-flex;align-items:center;gap:.2em}
.links .arr{margin-left:0}
.homepage .hero,.homepage .panel{display:grid;grid-template-columns:minmax(0,1fr);height:auto;min-height:0;gap:36px;align-items:center;padding-block:clamp(52px,7vw,96px);border-top:0}
.homepage .hero{padding-top:clamp(32px,7vw,54px);padding-bottom:40px}
.homepage .hero-text,.homepage .panel-text{position:relative;inset:auto;width:auto;padding:0;min-width:0;z-index:3}
.homepage .hero .title{width:100%;font-size:clamp(2.375rem,7.45vw,7.125rem);line-height:1.02;letter-spacing:-.025em;margin:24px 0}
.homepage .hero .title span{display:block;white-space:normal}
.homepage .eyebrow{font-size:clamp(.6875rem,1.06vw,1rem)}
.homepage .lede{font-size:clamp(1.25rem,2.05vw,1.96875rem);line-height:1.34;max-width:26em}
.homepage .hero .lede{width:auto;max-width:24em;padding:0}
.homepage .links{margin-top:28px;gap:12px clamp(24px,3.7vw,57px)}
.homepage .links a{font-size:clamp(1.125rem,1.7vw,1.625rem);padding-block:8px;line-height:1.4}
.homepage .scientific-figure{position:relative;inset:auto;min-width:0;justify-self:center;align-self:center;margin:0}
.homepage .art-hero{width:100%;max-width:400px;margin-bottom:24px}
.homepage .art-human{width:94%;max-width:420px}
.homepage .art-arena{width:100%;max-width:560px}
.homepage .art-research{width:78%;max-width:330px;margin-bottom:30px}
.homepage .figlabel{font-size:clamp(16px,1.45vw,22px);left:0;top:10.5%}
.homepage .scroll-cue{position:relative;inset:auto;justify-self:start;margin:0;padding-block:10px;font-size:clamp(.75rem,.93vw,.875rem);min-height:44px}
.homepage .scroll-cue span{font-size:25px;margin-right:15px}
.homepage .num{font-size:clamp(1.5rem,1.8vw,1.6875rem);margin-bottom:22px}
.homepage .num::after{width:28px;margin-top:12px}
.homepage .label{font-size:clamp(.875rem,1.33vw,1.25rem);text-transform:none;letter-spacing:.025em}
.homepage .panel h2{font-size:clamp(2.375rem,5.32vw,5.125rem);line-height:1.08;letter-spacing:-.035em;margin:24px 0}
.homepage .question h2{font-size:clamp(2.375rem,5.2vw,5rem);line-height:1.09}
.homepage .question h2 span{white-space:normal}
.homepage .question .num{font-size:clamp(3.25rem,5.05vw,4.875rem);margin-bottom:25px}
.homepage .question .num::after{width:70%;max-width:190px;margin-top:18px}
.homepage .section-index{display:none}
.homepage .chart-head{margin:0 0 8px;gap:12px}
.homepage .chart-head p{font-size:clamp(.75rem,1vw,.9375rem);letter-spacing:0;text-transform:none}
.homepage .chart-head em{font-size:clamp(.8125rem,1.2vw,1.125rem);margin-top:4px}
.homepage .forecast{margin:10px 0 0;transform:none}
.homepage .arena-timeline{position:relative;inset:auto;grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;height:auto;margin:0;font-size:clamp(.875rem,1.6vw,1.5rem);line-height:1.35}
.homepage .arena-timeline li{position:relative;left:auto;width:auto;padding-top:24px;text-wrap:balance}
.homepage .arena-timeline li span{width:10px;height:10px;left:calc(50% - 5px);top:-5px}
.homepage .arena-timeline::before{left:16.67%;right:7%}
.homepage .arena-timeline::after{left:93%;top:-15px}
.homepage .research h2 br{display:none}
.homepage .paper-stack{position:relative;inset:auto;width:72%;max-width:380px;justify-self:center;align-self:center;margin:8px 0 16px;transform:translateX(-16.4%)}
.homepage .paper-back-one{inset:5.6% -13.4% 3.6% 13.4%;transform:none}
.homepage .paper-back-two{inset:11.2% -32.8% 8.1% 32.8%;transform:none}
.homepage .paper-front h3{margin:8% -8% 0 10%;font-size:6.5cqw}
.homepage .figure-controls{font-size:12px;bottom:-24px;gap:12px}
.homepage .figure-controls button{font-size:12px}
.homepage .art-research .figure-controls{bottom:-30px}

/* A compact menu is independent of the illustration layout breakpoint. */
@media(max-width:767px){
  .nav{min-height:76px;flex-wrap:wrap;gap:0;padding-block:14px}.nav nav{width:100%;padding-block:12px 6px}
  .nav ul{flex-wrap:wrap;gap:4px 25px}.nav nav a{font-size:18px;padding-block:10px}.nav .sep{display:none}
  .nav-enhanced .menu-toggle{display:flex;align-items:center;justify-content:center;gap:12px;min-width:76px;min-height:44px;background:none;border:0;color:var(--ink);padding:8px 0 8px 12px;cursor:pointer}
  .menu-word{font-size:16px}.menu-lines{width:19px;height:9px;border-block:1px solid var(--ink);position:relative}
  .menu-toggle[aria-expanded=true] .menu-lines{border:0}.menu-toggle[aria-expanded=true] .menu-lines::before,.menu-toggle[aria-expanded=true] .menu-lines::after{content:"";position:absolute;left:0;top:4px;width:19px;height:1px;background:var(--ink);transform:rotate(45deg)}.menu-toggle[aria-expanded=true] .menu-lines::after{transform:rotate(-45deg)}
  .nav-enhanced nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--rule);padding:16px var(--gutter) 24px;max-height:calc(100svh - var(--header-height,var(--nav-height)));overflow-y:auto;overscroll-behavior:contain}
  .nav-enhanced nav.is-open{display:block}.nav-enhanced nav ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 20px}
  .foot{padding-block:30px 40px;gap:24px 30px}.foot .name{font-size:27px}.foot .meta{font-size:15px}.foot nav a{font-size:18px;display:inline-block;min-height:44px}.motion-toggle{font-size:13px;min-height:44px}
  .page{padding-block:56px 90px}.page .title{font-size:clamp(42px,9vw,64px);margin:24px 0 30px}.page .lede{font-size:22px}.pubs{margin-top:44px}.pub h2{font-size:31px}.pub .who{font-size:20px}.pub .links{margin-top:22px;gap:14px 30px}
}

/* Wide phones and tablets get a compact editorial spread instead of an oversized
   single-column illustration. Both columns may grow with their text. */
@media(min-width:640px){
  .homepage .hero{grid-template-columns:51.1% 48.9%;grid-template-rows:minmax(auto,1fr) auto;gap:0;min-height:calc(var(--stage-height) - var(--nav-height));padding-top:clamp(8px,calc(80px - 7vw),36px);padding-bottom:calc(var(--stage-height)*.064)}
  .homepage .hero-text{grid-area:1/1;align-self:end}
  .homepage .hero .title{width:125%;max-width:calc(var(--stage-width) - var(--gutter)*2);line-height:.98;margin:clamp(24px,2.9vw,44px) 0 clamp(22px,1.8vw,28px)}
  .homepage .hero .lede{width:92%;max-width:21em}
  .homepage .hero .links{margin-top:clamp(28px,4.5vw,69px)}
  .homepage .art-hero{grid-area:1/2/3/3;justify-self:start;align-self:center;width:111.8%;max-width:none;margin:0}
  .homepage .figlabel{left:12%;top:3%}
  .homepage .scroll-cue{grid-area:2/1;margin-top:clamp(32px,5.3vw,82px)}
  .homepage .panel{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px clamp(24px,4vw,60px);padding-block:clamp(56px,7vw,96px)}
  .homepage .question h2 span{display:block}
  .homepage .question .num::after{width:95%;max-width:none}
  .homepage .art-human{width:110%;max-width:none}
  .homepage .art-arena{width:100%;max-width:none}
  .homepage .arena-timeline{margin-top:20px}
  .homepage .art-research{width:78%;max-width:420px;margin:0}
  .homepage .paper-stack{width:76%;max-width:none;justify-self:start;margin:0;transform:none}
}

/* Reference 03's 752 × 497 composition, expressed as flow-based grids. */
@media(min-width:1000px){
  html:has(.homepage){scroll-padding-top:var(--header-height,var(--nav-height))}
  .homepage .nav{position:sticky;top:0;padding-right:calc(var(--stage-width)*.038)}
  .homepage .hero,.homepage .panel{min-height:calc(var(--stage-height) - var(--nav-height))}
  .homepage .hero{padding-top:calc(var(--stage-height)*.008)}
  .homepage .figlabel{left:-5%;top:10.5%}
  .homepage .panel{align-content:start;align-items:start;column-gap:0;row-gap:0}
  .homepage .panel h2{line-height:1.05;margin:calc(var(--stage-width)*.023) 0 calc(var(--stage-width)*.019)}
  .homepage .num{margin-bottom:calc(var(--stage-width)*.012)}
  .homepage .num::after{width:calc(var(--stage-width)*.019);margin-top:calc(var(--stage-width)*.008)}
  .homepage .panel .links{margin-top:calc(var(--stage-width)*.0313)}
  .homepage .question{grid-template-columns:38% 46% 16%;padding-top:calc(var(--stage-height)*.04);padding-bottom:calc(var(--stage-height)*.06)}
  .homepage .question .panel-text{width:105%;margin-top:calc(var(--stage-height)*.105)}
  .homepage .question .num{margin-bottom:calc(var(--stage-width)*.0213)}
  .homepage .question .num::after{width:90.5%;margin-top:calc(var(--stage-width)*.02)}
  .homepage .question h2{line-height:1.09;margin-top:calc(var(--stage-width)*.035)}
  .homepage .art-human{align-self:start;justify-self:start;width:110%}
  .homepage .section-index{display:block;position:relative;inset:auto;align-self:start;padding:0;margin-top:calc(var(--stage-height)*.19)}
  .homepage .section-index ol{gap:calc(var(--stage-width)*.018)}
  .homepage .section-index a{font-size:clamp(.9375rem,1.57vw,1.5rem);gap:clamp(12px,1.7vw,26px);padding:8px 0 8px clamp(12px,1.6vw,24px);min-height:44px;white-space:normal}
  .homepage .section-index a span{font-size:clamp(.75rem,1.12vw,1.0625rem)}
  .homepage .arena{grid-template-columns:51.6% 48.4%;padding-top:calc(var(--stage-height)*.133);padding-bottom:calc(var(--stage-height)*.08);row-gap:calc(var(--stage-height)*.093)}
  .homepage .arena .panel-text{width:92%}.homepage .arena .lede{max-width:18em}
  .homepage .art-arena{width:104%;align-self:start;justify-self:start}
  .homepage .forecast{margin-top:calc(var(--stage-width)*-.025);transform:scaleY(1.06);transform-origin:top}
  .homepage .arena-timeline{width:calc(100% + var(--gutter)*2);margin:0 calc(var(--gutter)*-1);grid-template-columns:38.3% 13.5% 44.5%;gap:0}
  .homepage .arena-timeline::before{left:19.15%;right:15.2%}.homepage .arena-timeline::after{left:84.7%}
  .homepage .arena-timeline li span{width:14px;height:14px;top:-7px;left:calc(50% - 7px)}
  .homepage .research{grid-template-columns:64% 36%;padding-top:calc(var(--stage-height)*.029);padding-bottom:calc(var(--stage-height)*.1)}
  .homepage .research .panel-text{width:90.3%;margin-top:calc(var(--stage-height)*.103)}
  .homepage .research h2{font-size:clamp(3rem,4.8vw,4.625rem)}.homepage .research h2 br{display:initial}.homepage .research .lede{max-width:24em}
  .homepage .art-research{width:90%;max-width:none;align-self:start;justify-self:start}
  .homepage .publications{grid-template-columns:49% 51%;padding-top:calc(var(--stage-height)*.057);padding-bottom:calc(var(--stage-height)*.14)}
  .homepage .publications .panel-text{width:95%;margin-top:calc(var(--stage-height)*.077)}
  .homepage .publications .lede{max-width:18em}
  .homepage .publications .links{margin-top:calc(var(--stage-width)*.075);column-gap:calc(var(--stage-width)*.045)}
  .homepage .publications .links a{font-size:clamp(1.0625rem,1.65vw,1.5625rem)}
  .homepage .paper-stack{width:76.4%;align-self:start}
  .homepage .figure-controls{font-size:13px;bottom:-13px}.homepage .figure-controls button{font-size:13px}.homepage .art-research .figure-controls{bottom:-24px}
}

/* Short windows retain normal scrolling and keep the navigation out of the way. */
@media(min-width:768px) and (max-height:600px){
  html:has(.homepage){scroll-padding-top:24px}.homepage .nav{position:relative}
  .homepage .panel{min-height:0;padding-block:48px}.homepage .question .panel-text,.homepage .research .panel-text,.homepage .publications .panel-text{margin-top:0}
}

/* A quiet, stationary paper grain. Only the engraved geometry rotates. */
.homepage{background-image:url('/assets/svg/paper-grain.svg'),radial-gradient(ellipse at 18% 18%,#b697600b,transparent 62%),radial-gradient(ellipse at 86% 75%,#aa855b07,transparent 65%);background-size:256px 256px,100% 100%,100% 100%;background-repeat:repeat,no-repeat,no-repeat;background-attachment:scroll,fixed,fixed}
.homepage .nav,.homepage .paper-front,.homepage .paper-back{background-image:url('/assets/svg/paper-grain.svg');background-size:256px 256px}

/* Two visible primary destinations, shared by desktop and mobile. */
.nav--editorial{gap:12px 24px}
.nav--editorial nav{display:block;position:static;width:auto;padding:0;margin-left:auto;background:none;border:0}
.nav--editorial ul{flex-wrap:nowrap;gap:clamp(24px,3vw,44px)}
.nav--editorial nav a{font-size:18px}
.page-back{display:inline-flex;align-items:center;min-height:44px;font-size:17px;color:var(--mute);text-decoration:none}
.page-back:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
@media(max-width:639px){
  .nav--editorial{gap:8px 12px;padding-block:12px}
  .nav--editorial .wordmark{font-size:26px}
  .nav--editorial ul{gap:20px}
  .nav--editorial nav a{font-size:17px}
}

/* One set of peer page links; on small phones the masthead sits above it. */
@media(max-width:479px){
  .nav--editorial{flex-direction:column;align-items:flex-start;gap:6px;padding-block:16px 4px}
  .nav--editorial nav{width:100%;margin-left:0}
  .nav--editorial ul{justify-content:space-between;gap:18px}
  .nav--editorial nav a{font-size:17px;padding-block:8px}
}

/* GitHub is a site utility; keep the three research chapters together. */
.nav--editorial .header-github{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding-left:24px;position:relative;font-size:17px;white-space:nowrap;text-decoration:none;color:var(--ink2)}
.header-github::before{content:"";position:absolute;left:0;top:calc(50% - 9px);height:18px;width:1px;background:var(--rule)}
.header-github>span[aria-hidden]{font-size:.8em}
.header-github:hover{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
@media(max-width:759px){
  .nav--editorial{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 16px;padding-block:12px 0}
  .nav--editorial .wordmark{grid-column:1;grid-row:1}
  .nav--editorial .header-github{grid-column:2;grid-row:1;justify-self:end;padding-left:0;font-size:15px}
  .header-github::before{display:none}
  .nav--editorial nav{grid-column:1/-1;grid-row:2;width:100%;margin-left:0;border-bottom:1px solid rgb(213 206 193 / 65%)}
  .nav--editorial ul{justify-content:flex-start;flex-wrap:wrap;gap:0 28px}
  .nav--editorial nav a{position:relative;min-width:44px;min-height:44px;padding-block:10px;color:var(--mute)}
  .nav--editorial nav a:hover,.nav--editorial nav a[aria-current]{color:var(--ink);text-decoration:none}
  .nav--editorial nav a[aria-current]::after{content:"";position:absolute;left:0;bottom:-1px;width:24px;height:1px;background:var(--ink2)}
}
