:root{--paper:#eef0f2;--ink:#191b1e;--muted:#595e65;--line:#c8cdd2;--amber:#945c00;--bright:#e3a126;--screen:#202327;--progress:0;--motion-speed:5s;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:6rem}body{margin:0}a{color:inherit}button{font:inherit}::selection{background:var(--bright);color:var(--ink)}:focus-visible{outline:3px solid var(--amber);outline-offset:5px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:1rem;left:1rem;transform:translateY(-180%);z-index:20;background:var(--paper);padding:1rem}.skip-link:focus{transform:none}
.header{height:100px;padding:0 5.5%;display:flex;align-items:center;justify-content:space-between;background:var(--paper);position:relative;z-index:10}.identity{text-decoration:none;font-size:1rem;font-weight:750;letter-spacing:-.035em}.identity-dot{color:var(--amber);font-size:1.5rem}.language{display:flex;align-items:center;gap:.25rem;font-family:Consolas,'Courier New',monospace;font-size:.875rem}.language button{background:none;border:0;min-width:44px;min-height:44px;color:var(--muted);cursor:pointer}.language button[aria-pressed=true]{color:var(--ink);font-weight:700;text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:7px;text-decoration-thickness:2px}.language>span{color:var(--line)}
.opening{min-height:calc(100svh - 100px);padding:2rem 5.5% 0;display:flex;flex-direction:column;position:relative}.opening-top{display:flex;justify-content:space-between;align-items:center}.eyebrow,.edition,.present-label{font-family:Consolas,'Courier New',monospace;font-size:.8125rem;letter-spacing:.08em;font-weight:400;line-height:1.5;margin:0}.edition{color:var(--muted)}h1{font-size:clamp(6rem,16vw,17rem);line-height:.83;letter-spacing:-.075em;margin:clamp(2.5rem,7vh,5rem) 0 3rem;font-weight:800}h1>span:not(.sr-only){display:block}h1 .period{color:var(--amber)}.opening-bottom{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;padding:0 0 2.5rem}.intro-copy{font-size:1rem;line-height:1.65;margin:0;color:var(--muted)}.scroll-cue{font-size:.875rem;display:flex;align-items:center;gap:2rem;text-decoration:none}.down-arrow{font-size:1.6rem;color:var(--amber)}.opening-rule{height:1px;background:var(--line);width:100%}
.journey{position:relative;padding:0 5.5%}.journey-stage{padding:3rem 0;display:flex;flex-direction:column;justify-content:center;min-height:760px}.stage-heading{display:flex;justify-content:space-between;gap:1rem;margin-bottom:3.5rem}.present-label{color:var(--muted)}.workspace{display:grid;grid-template-columns:1fr 1.45fr;align-items:center;gap:6%;}.chapter-index{font-family:Consolas,'Courier New',monospace;font-size:.875rem;color:var(--muted);margin:0 0 1.2rem}.chapter-index>span:first-child{color:var(--amber)}.chapter-name{font-size:clamp(2rem,4.2vw,4rem);font-weight:750;letter-spacing:-.05em;margin:0 0 1.3rem}.chapter-copy{font-size:1.25rem;line-height:1.45;color:var(--muted);margin:0}.layer-stack{display:flex;gap:5px;margin-top:2rem;height:3px;max-width:200px}.layer-stack i{flex:1;background:var(--line)}.layer-stack i.on{background:var(--amber)}.monitor{margin:0;background:var(--screen);color:#e5e8eb;border:1px solid #353a40;border-radius:8px;box-shadow:0 20px 40px #191b1e12;overflow:hidden;transform:translateY(0);transition:border-color .4s}.screen-top{display:flex;justify-content:space-between;gap:1rem;padding:1.2rem 1.5rem;border-bottom:1px solid #3b4046;font-family:Consolas,'Courier New',monospace;font-size:.8125rem;color:#b5bcc4}.screen-mode{font-size:.75rem;letter-spacing:.035em}.code-window{display:flex;gap:1.5rem;padding:1.5rem;font:clamp(.8125rem,1.1vw,1rem)/1.85 Consolas,'Courier New',monospace;min-height:350px}.line-numbers{color:#777e87;text-align:right;user-select:none}.code-window pre{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;flex:1;min-width:0;font:inherit}.code-window code{font:inherit}.comment{color:#9aa3ad}.keyword{color:#e4b65f}.string{color:#e1e5e9}.literal{color:#e4b65f}.caret{display:inline-block;width:7px;height:1em;margin-left:2px;background:var(--bright);vertical-align:-.1em}.screen-caption{display:flex;justify-content:space-between;align-items:center;gap:1rem;border-top:1px solid #3b4046;padding:1rem 1.5rem;font-family:Consolas,'Courier New',monospace;font-size:.8125rem;color:#b5bcc4}.ai-badge{font-weight:bold;color:var(--bright)}
.timeline{list-style:none;padding:0;margin:3.5rem 0 0;display:grid;grid-template-columns:repeat(6,1fr);position:relative}.timeline:before{content:'';position:absolute;top:5px;left:0;right:0;height:1px;background:var(--line)}.timeline:after{content:'';position:absolute;top:5px;left:0;width:calc(var(--progress)*100%);height:2px;background:var(--amber);transform-origin:left;transition:width .2s linear}.timeline li{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;font-family:Consolas,'Courier New',monospace;font-size:.875rem;color:var(--muted)}.node{display:block;width:11px;height:11px;border:1px solid var(--muted);background:var(--paper);border-radius:50%;margin-bottom:1rem}.timeline-index{font-size:.75rem;color:var(--muted)}.timeline li.reached{font-weight:700;color:var(--ink)}.reached .node{background:var(--amber);border-color:var(--amber)}.timeline li.current .node{outline:4px solid #945c0024}.timeline .ai-node.reached{color:var(--amber)}.journey-note{font-size:.875rem;color:var(--muted);margin:2rem 0 0}
.reveal{padding:8rem 5.5% 6rem;background:var(--ink);color:var(--paper)}.reveal>.eyebrow{color:#aeb5bc}.reveal h2{font-size:clamp(2.5rem,5.8vw,6rem);line-height:1.09;letter-spacing:-.045em;font-weight:500;margin:3.5rem 0}.reveal h2>span{display:block}.premise-now{color:var(--bright);margin-top:.3em}.curiosity{display:flex;align-items:center;gap:1.2rem;margin-top:5rem}.small-plus{color:var(--bright);font-size:1.8rem;font-weight:300}.curiosity p{margin:0;font-size:clamp(1rem,1.7vw,1.5rem);letter-spacing:-.02em}.profile{padding:4rem 5.5% 5rem;display:grid;grid-template-columns:1fr 1fr;gap:6%;border-top:1px solid var(--line)}.profile-title{font-size:1.6rem;letter-spacing:-.035em;margin:.8rem 0 0}.profile-copy{font-size:1.125rem;line-height:1.7;color:var(--muted);max-width:34rem;margin:0}.profile-copy strong{color:var(--ink);font-weight:500}
/* Progressive enhancement: all content remains readable without JavaScript. */
.animated .journey{height:230svh}.animated .journey-stage{position:sticky;top:0;min-height:0;height:100svh}.animated .timeline .ai-node:not(.reached){visibility:hidden}.animated .ai-badge{opacity:0}.animated .ai-active .ai-badge{opacity:1}.animated .ai-active .monitor{border-color:var(--amber)}.animated .journey-note{opacity:0;transition:opacity .4s}.animated .ai-active .journey-note{opacity:1}.animated .monitor{animation:float var(--motion-speed) ease-in-out infinite}.animated .ai-active{--motion-speed:1.8s}.animated .reveal h2,.animated .curiosity{opacity:.12;transform:translateY(24px);transition:opacity .7s,transform .7s}.animated .reveal.is-visible h2{opacity:1;transform:none}.animated .reveal.is-visible .curiosity{opacity:1;transform:none;transition-delay:.28s}@keyframes float{50%{transform:translateY(-4px)}}
@media(min-width:1600px){.opening,.journey,.reveal,.profile{padding-left:max(5.5%,calc((100vw - 1500px)/2));padding-right:max(5.5%,calc((100vw - 1500px)/2))}}
@media(max-width:800px){.header{height:80px;padding:0 6%}.opening{padding:2rem 6% 0;min-height:calc(95svh - 80px)}h1{font-size:clamp(5rem,19vw,9rem);margin-top:12vh;margin-bottom:4rem}.opening-bottom{align-items:flex-start;flex-direction:column;gap:2rem;padding-bottom:2rem}.intro-copy{font-size:1rem}.scroll-cue{width:100%;justify-content:space-between}.journey{padding:0 6%}.journey-stage{min-height:850px;padding:2rem 0;display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto auto;align-content:center;gap:1.5rem}.stage-heading{margin:0}.present-label{display:none}.workspace{display:block}.chapter{display:none}.monitor{max-width:100%}.screen-top{padding:.9rem 1rem}.screen-mode{font-size:.75rem}.code-window{font-size:.8125rem;gap:.75rem;padding:1rem;min-height:285px;line-height:1.7}.screen-caption{padding:.8rem 1rem;font-size:.75rem}.timeline{margin:0;display:flex;flex-direction:column;gap:0}.timeline:before{top:5px;bottom:16px;left:5px;width:1px;height:auto;right:auto}.timeline:after{top:5px;left:5px;width:2px;height:calc(var(--progress)*(100% - 20px));transition:height .2s linear}.timeline li{display:grid;grid-template-columns:12px 38px 1fr;gap:1rem;align-items:center;min-height:35px;font-size:.8125rem}.node{margin:0}.timeline-index{font-size:.75rem}.journey-note{margin:0;font-size:.8125rem}.animated .journey{height:220svh}.animated .journey-stage{height:100svh;min-height:720px}.reveal{padding:5rem 6%}.reveal h2{font-size:clamp(2.4rem,7.8vw,4rem);margin:2.5rem 0;line-height:1.13}.curiosity{margin-top:3rem;gap:.7rem}.profile{padding:3rem 6%;grid-template-columns:1fr;gap:1.5rem}.profile-copy{font-size:1rem}}
@media(max-width:400px){.screen-mode{display:none}.eyebrow,.edition{font-size:.75rem}.identity{font-size:.875rem}}
@media(min-width:801px) and (max-height:800px){.opening{min-height:calc(100svh - 100px)}h1{font-size:min(16vw,26vh);margin:2rem 0;line-height:.88}.opening-bottom{padding-bottom:1.8rem}.journey-stage{padding:2rem 0}.stage-heading{margin-bottom:2rem}.code-window{min-height:290px;font-size:.8125rem;line-height:1.7}.timeline{margin-top:2rem}.journey-note{margin-top:1.5rem}}
@media(max-height:600px),(max-width:800px) and (max-height:740px){.animated .journey-stage{position:relative;height:auto;min-height:0;padding-top:3rem;padding-bottom:3rem}.animated .journey{height:auto}}
.chronology{margin-top:2.5rem}.time-span{display:flex;align-items:center;gap:1.2rem;font:700 1rem/1.4 Consolas,'Courier New',monospace;letter-spacing:.04em}.time-span time{color:var(--ink)}.time-span>span:last-child{color:var(--amber)}.time-rule{flex:1;height:9px;border-top:1px solid var(--line);background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 24px)}.chronology .timeline{margin-top:1.4rem}.chronology .timeline-index{display:none}.chronology .timeline li{min-height:0}.chronology .node{margin-bottom:.6rem}
@media(max-width:800px){.chronology{margin-top:0}.time-span{font-size:.875rem;gap:.8rem}.chronology .timeline{margin-top:1rem}.chronology .timeline li{grid-template-columns:12px 1fr;min-height:32px}.chronology .node{margin-bottom:0}}
@media(min-width:801px) and (max-height:800px){.chronology{margin-top:1.5rem}}
.opening-top,.opening-bottom{justify-content:flex-end}
.chronology .timeline{grid-template-columns:repeat(5,1fr)}
.chronology .timeline time,.milestone-date{font-size:1rem;font-weight:700;color:var(--ink)}
.milestone-note{font:400 .8125rem/1.4 Arial,Helvetica,sans-serif;color:var(--muted);max-width:160px}
.animated .reveal{min-height:115svh}
.animated .reveal .premise-now,.animated .reveal .curiosity{opacity:0;transform:translateY(24px);transition:opacity .6s,transform .6s}
.animated .reveal.second-visible .premise-now,.animated .reveal.second-visible .curiosity{opacity:1;transform:none}
@media(max-width:800px){.chronology .timeline li{grid-template-columns:12px 88px 1fr;min-height:38px}.chronology .timeline .milestone-note{grid-column:2 / -1;max-width:none;margin:-.3rem 0 .5rem}.chronology .timeline time,.milestone-date{font-size:.875rem}.animated .reveal{min-height:120svh}}
@media(prefers-reduced-motion:reduce){.animated .reveal{min-height:0}.animated .reveal .premise-now,.animated .reveal .curiosity{opacity:1;transform:none}}
/* Scroll provides the ambient movement; nothing loops while the visitor is reading. */
.animated .monitor{animation:none}.animated .timeline .ai-node:not(.reached){visibility:visible;opacity:0}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.animated .journey{height:auto}.animated .journey-stage{position:relative;height:auto;min-height:0;padding:4rem 0}.animated .reveal h2,.animated .curiosity{opacity:1;transform:none}.animated .timeline .ai-node{visibility:visible}.animated .ai-badge,.animated .journey-note{opacity:1}}


/* Hold the message itself, rather than adding empty space after it. */
.reveal{padding:0}
.reveal-content{padding:4rem 5.5% 2.5rem}
.reveal h2{margin:2.5rem 0}
.reveal .curiosity{margin-top:2.5rem}
.animated .reveal{height:auto;min-height:150svh}
.animated .reveal-content{position:sticky;top:0;min-height:100svh;display:flex;flex-direction:column;justify-content:center}
.ai-active .chapter-name{display:inline-block;background:var(--ink);color:#ffd429;font-size:clamp(4rem,6vw,6rem);line-height:1.05;padding:.08em .2em .12em;letter-spacing:-.045em;border-radius:3px}
.ai-active .ai-badge{color:#ffd429}
@media(max-width:800px){.reveal-content{padding:3rem 6% 2rem}.reveal h2{margin:2rem 0}.reveal .curiosity{margin-top:2rem}.animated .reveal{min-height:140svh}.ai-node.reached>span:last-child{color:#ffd429;background:var(--ink);padding:.2rem .5rem;justify-self:start}}
@media(max-height:650px){.animated .reveal{min-height:0}.animated .reveal-content{position:relative;min-height:0}}
@media(prefers-reduced-motion:reduce){.animated .reveal{min-height:0}.animated .reveal-content{position:relative;min-height:0}}

/* Chapter changes fade in; the initial SYSTEMS label stays immediately visible. */
.chapter-name{white-space:nowrap}
.chapter-name.typing-cursor::after{content:'|';display:inline-block;margin-left:.09em;font-weight:300;color:var(--amber);animation:chapter-cursor 1.1s step-end infinite}
@keyframes chapter-cursor{0%,49%{opacity:1}50%,100%{opacity:0}}
.ai-active .chapter-name{background:transparent;color:#edb900;padding:0;border-radius:0;text-shadow:0 1px 0 #945c0030}
@media(prefers-reduced-motion:reduce){.chapter-name.typing-cursor::after{animation:none}}

/* Evolution: retain the composition, extend its scroll runway, reserve every state. */
.viewport-metric{position:fixed;top:0;left:0;height:100svh;width:0;visibility:hidden;pointer-events:none}
.animated .journey{height:auto;min-height:360svh}
.animated .journey-stage{position:sticky;top:var(--pin-top,0px);height:auto;min-height:100svh}
.chapter-name,.ai-active .chapter-name{display:block;font-size:clamp(2rem,4.2vw,4rem);line-height:1.1;min-height:1.1em;padding:0;letter-spacing:-.05em;border-radius:0;background:transparent;text-shadow:none}
.ai-active .chapter-name{color:var(--amber)}
.chapter-name::after{content:'|';display:inline-block;visibility:hidden;margin-left:.09em;font-weight:300;color:var(--amber)}
.chapter-name.typing-cursor::after{visibility:visible}
.ai-active .ai-badge{color:var(--bright)}
.code-addition{display:inline-block;min-height:3.7em;width:100%;color:var(--bright);transition:background-color .3s;white-space:pre-wrap}
.ai-active .monitor{border-color:var(--bright)}
.ai-arrival .code-addition{background:#e3a1260d}
.ai-arrival .caret{animation:chapter-cursor .8s step-end infinite}
.screen-caption{min-height:3.75rem}
.animated .ai-active .journey-note{opacity:0}
.animated .story-complete .journey-note{opacity:1}
@media(max-width:800px){
  .animated .journey{min-height:440svh}
  .journey-stage,.animated .journey-stage{display:flex;gap:1rem;min-height:100svh;height:auto;padding:1.25rem 0;justify-content:center}
  .stage-heading{margin:0}.chronology{width:100%}.chronology .timeline{margin-top:0}
  .code-window{min-height:0;line-height:1.6;padding:.8rem 1rem}
  .screen-top{padding:.75rem 1rem}.screen-caption{min-height:3rem}
  .code-addition{min-height:3.2em}
  .chronology .timeline li{min-height:32px}
  .ai-node.reached>span:last-child{color:var(--amber);background:none;padding:0}
  .timeline li.current>span:last-child::after{content:'|';margin-left:.2em;color:var(--amber);font-weight:400;animation:chapter-cursor 1.1s step-end infinite}
  .timeline li.ai-node.current>span:last-child::after{visibility:hidden}
}
@media(prefers-reduced-motion:reduce){
  .animated .journey{min-height:0;height:auto}.animated .journey-stage{position:relative;top:auto;min-height:0;height:auto;padding:3rem 0}
  .animated .journey-note,.animated .timeline .ai-node{opacity:1}
  .chapter-name::after,.timeline li.current>span:last-child::after{animation:none}
}
/* Experience extends the existing two-column editorial profile. */
.experience{padding:5rem 6% 4rem;background:var(--paper)}
.experience-heading h2{font-size:clamp(2.5rem,5vw,4.6rem);line-height:1.05;letter-spacing:-.05em;font-weight:500;margin:1.2rem 0 1.5rem}
.experience-intro{font-size:1rem;line-height:1.65;color:var(--muted);max-width:28rem;margin:0}
.experience-chapters{min-width:0;margin-top:4rem}
.experience-chapter{padding:3rem 0;border-top:1px solid var(--line)}
.experience-chapter>.eyebrow{color:var(--amber)}
.experience-chapter h3{font-size:clamp(1.9rem,3.2vw,3rem);line-height:1.13;letter-spacing:-.04em;font-weight:500;margin:1.5rem 0}
.experience-chapter>p:not(.eyebrow){font-size:1rem;line-height:1.7;color:var(--muted);max-width:38rem;margin:1rem 0}
.flow-figure{margin:2.5rem 0 0;padding:0}
.system-flow{display:flex;justify-content:space-between;gap:.5rem;position:relative;list-style:none;padding:1.6rem 0 0;margin:0;min-width:0;font: .75rem/1.4 Consolas,'Courier New',monospace}
.system-flow::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:var(--line)}
.system-flow::after{content:'';position:absolute;left:calc(8px + var(--flow,1)*(100% - 8px));top:-3px;transform:translateX(-100%);width:8px;height:7px;background:var(--amber)}
.system-flow li{flex:1;position:relative;overflow-wrap:anywhere;color:var(--muted)}
.system-flow li::before{content:'';position:absolute;top:-1.6rem;left:0;height:5px;width:1px;background:var(--muted)}
.system-flow li:last-child{text-align:right}.system-flow li:last-child::before{left:auto;right:0}
.experience-close{border-top:1px solid var(--line);padding-top:3.5rem;margin-top:1rem}
.experience-close>p{font-size:clamp(2rem,4.5vw,4rem);line-height:1.12;letter-spacing:-.045em;margin:0 0 1.5rem;font-weight:500}
.experience-close>.eyebrow{display:block;max-width:32rem;color:var(--muted);font-size:.8125rem;letter-spacing:0}

/* About has a stable composition before its portrait or extra words appear. */
.about{background:var(--paper);position:relative;border-top:1px solid var(--line)}
.about-stage{padding:2rem 6%;display:grid;grid-template-areas:'heading' 'portrait' 'intro' 'joke';grid-template-columns:minmax(0,1fr);gap:1.25rem;align-content:center;min-height:100svh}
.about-heading{grid-area:heading;min-width:0}
.about-heading h2{margin:0 0 .6rem}
.still-human{font-size:clamp(2rem,8vw,3.5rem);font-weight:650;line-height:1.05;letter-spacing:-.045em;margin:0;min-height:1.05em}
.about-intro{grid-area:intro;min-width:0}
.about-thought{font-size:clamp(1.15rem,4.2vw,1.55rem);letter-spacing:-.02em;line-height:1.3;margin:0 0 .75rem}
.about-thought br:nth-of-type(2){display:none}
.about-learning{font-size:1rem;line-height:1.45;color:var(--muted);margin:0}
.human-cursor,.joke-cursor{color:var(--amber);font-family:Consolas,'Courier New',monospace;animation:chapter-cursor 1.3s step-end infinite}
.about-portrait{grid-area:portrait;margin:0;min-width:0;aspect-ratio:1374 / 1145;overflow:hidden}
.about-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.about-joke{grid-area:joke;font: .875rem/1.6 Consolas,'Courier New',monospace;min-height:2.8em;max-width:100%;margin:0;overflow-wrap:anywhere;align-self:end}
.animated .about{min-height:340svh}
.animated .about-stage{position:sticky;top:var(--about-pin-top,0px)}
.animated .still-human{opacity:var(--human-reveal,0);transform:translateY(calc((1 - var(--human-reveal,0))*8px))}
.animated .about-portrait img{opacity:var(--photo-reveal,0);clip-path:inset(0 calc((1 - var(--photo-reveal,0))*100%) 0 0)}
.animated .about-joke .joke-cursor{opacity:var(--joke-reveal,0)}

/* Contact repeats the black punctuation of The Next Chapter. */
.contact{padding:4rem 6% 1.5rem;background:var(--ink);color:var(--paper)}
.contact>.eyebrow{color:#b5bcc4}
.contact h2{font-size:clamp(2.5rem,7vw,7rem);font-weight:500;line-height:1.05;letter-spacing:-.045em;margin:2.5rem 0}
.contact-email{font-size:clamp(1.4rem,4vw,2.75rem);display:inline-flex;gap:.5em;align-items:center;min-height:48px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em;overflow-wrap:anywhere}
.contact a{transition:color .18s}.contact a:hover,.contact a:active{color:var(--bright)}
.contact a:focus-visible{outline-color:var(--bright)}
.contact-links{display:flex;gap:2rem;flex-wrap:wrap;margin:2.5rem 0 4rem}
.contact-links a{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;text-underline-offset:.3em}
.contact footer{border-top:1px solid #3b4046;padding-top:1.5rem;color:#b5bcc4;font-size:.8125rem}
.contact footer p{margin:0}
@media(min-width:801px){
  .experience{display:grid;grid-template-columns:1fr 1.45fr;column-gap:6%;padding:6rem 5.5% 5rem}
  .experience-heading{position:sticky;top:4rem;align-self:start}
  .experience-intro{max-width:23rem}
  .experience-chapters{margin:0}
  .experience-chapter{min-height:75svh;padding:3.5rem 0}
  .experience-chapter:first-child{border-top:0;padding-top:0}
  .experience-chapter>p:not(.eyebrow){font-size:1.125rem}
  .system-flow{font-size:.8125rem}
  .experience-close{grid-column:1 / -1;padding-top:4rem;margin-top:3rem}
  .experience-close>p{max-width:55rem}
  .about-stage{grid-template-columns:1fr 1.2fr;grid-template-areas:'heading heading' 'intro portrait' 'joke joke';column-gap:8%;row-gap:2rem;padding:3rem 5.5%;align-items:center}
  .about-heading{display:flex;align-items:baseline;gap:2rem}
  .about-heading h2{margin:0;flex:none}
  .still-human{font-size:clamp(2.5rem,5.5vw,5.5rem)}
  .about-thought{font-size:clamp(1.6rem,2.8vw,2.75rem);line-height:1.22;margin-bottom:2rem}
  .about-thought br:nth-of-type(2){display:initial}
  .about-learning{font-size:1.125rem}
  .about-portrait{width:100%;max-width:620px;justify-self:end}
  .about-joke{font-size:1rem;min-height:1.6em}
  .animated .about{min-height:300svh}
  .contact{padding:6rem 5.5% 2rem}
}
@media(min-width:801px) and (max-height:720px){.experience-heading{position:relative;top:auto}.about-stage{padding-top:2rem;padding-bottom:2rem;gap:1.5rem}.about-portrait{max-width:480px}}
@media(max-width:400px){.about-stage{gap:1rem;padding-top:1.5rem;padding-bottom:1.5rem}.about-thought{font-size:1.125rem}.about-joke{font-size:.8125rem}.system-flow{gap:.35rem}}
@media(prefers-reduced-motion:reduce){
  .experience-heading{position:relative;top:auto}
  .animated .about{min-height:0}.animated .about-stage{position:relative;top:auto;min-height:0;padding-top:3rem;padding-bottom:3rem}
  .animated .still-human,.animated .about-portrait img,.animated .about-joke .joke-cursor{opacity:1;transform:none;clip-path:none}
  .human-cursor,.joke-cursor{animation:none}
}


/* Status translations reserve two lines, preventing editor movement between AI states. */
.code-status{display:block;line-height:1.4;min-height:2.8em}

/* Reflow for enlarged text: retain normal sizes, cap large titles to the viewport. */
.experience h2,.experience h3,.contact h2,.about-thought,.contact-email{overflow-wrap:anywhere}
@media(max-width:800px){
  h1{font-size:min(clamp(5rem,19vw,9rem),21.5vw)}
  .reveal h2{font-size:min(clamp(2.4rem,7.8vw,4rem),10.5vw)}
  .experience-heading h2{font-size:min(clamp(2.5rem,5vw,4.6rem),12vw)}
  .contact h2{font-size:min(clamp(2.5rem,7vw,7rem),12vw)}
  .still-human{font-size:min(clamp(2rem,8vw,3.5rem),9.5vw)}
  .chronology .timeline li{grid-template-columns:12px minmax(4.5rem,.8fr) minmax(0,1.3fr);overflow-wrap:anywhere}
  .screen-caption{display:grid;grid-template-columns:minmax(0,1fr) auto}
}