:root{font-family:"Helvetica Neue",Arial,sans-serif;color:#f5f0e9;background:#252423;--accent:#f37b65;--ink:#f5f0e9;--muted:#d0cac3;--gutter:5vw;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;background:#252423;color:var(--ink)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;background:none;border:0}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}header{height:100px;position:absolute;top:0;left:0;right:0;padding:30px var(--gutter);display:flex;align-items:center;justify-content:space-between;z-index:5}header img{width:170px;height:auto;filter:invert(1)}header>span{font:10px monospace;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}
.chapter{position:relative;height:100svh}.intro{height:300lvh}.held{height:400lvh}.feature{height:100lvh}.ending{height:165svh}.copy{width:350px;max-width:38vw;margin-left:var(--gutter);z-index:2}h1,h2{font-weight:650;letter-spacing:-.045em;line-height:.99;margin:0 0 25px}h1{font-size:clamp(42px,4.6vw,70px)}h2{font-size:clamp(38px,3.5vw,54px)}p{font-size:clamp(18px,1.6vw,23px);font-weight:450;letter-spacing:-.022em;line-height:1.3;margin:0;max-width:330px;color:var(--muted)}.hero-copy{position:relative;top:20svh;width:430px;max-width:39vw}.hero-description{max-width:335px}.phrase-wrap{position:relative;display:inline-block;white-space:nowrap}.phrase-dot{position:absolute;right:-.25em;bottom:0;display:block;transform-origin:0 95%}.changing-phrase .char{transform-origin:0 95%}.period{display:inline-block}.hero-actions{position:fixed;left:var(--gutter);bottom:140px;z-index:3}.hero-actions button{padding:15px 0;font-size:12px;display:flex;gap:24px;align-items:center;border-bottom:1px solid #8886}.arrow-window{position:relative;height:18px;width:12px;overflow:hidden}.arrow-window span{display:block;height:18px;line-height:18px}.held-copy{position:fixed;top:64px;opacity:0;visibility:hidden;pointer-events:none;--ink:#302c29;--muted:#5d554f;color:var(--ink)}.held-copy h2{max-width:390px}.feature-copy{position:absolute;bottom:0}.feature-heading{opacity:.5}.feature-heading h2{color:var(--accent)}.feature-links{--line:0;position:relative;margin:26px 0 0;padding:20px 0 0;list-style:none;opacity:0;visibility:hidden}.feature-links:before{content:"";position:absolute;top:0;left:0;width:100%;height:1px;background:currentColor;opacity:.4;transform:scaleX(var(--line));transform-origin:0 0}.feature-links li{font-size:12px;line-height:1.5;margin:0 0 12px;opacity:0}.feature-links a{display:inline-block;padding:4px 0;color:var(--muted)}.feature-links a:hover{color:var(--accent)}.feature-links li span{display:inline-block;margin-right:14px;color:var(--accent)}.ending-copy{position:relative;top:27svh}.restart-link{margin-top:32px;padding:14px 0;border-bottom:1px solid #8887;font-size:12px}.restart-link span{margin-left:20px}

.chapter-map{position:fixed;z-index:20;bottom:25px;left:var(--gutter);width:322px;color:var(--ink);padding:13px 15px 10px;background:inherit;border:1px solid #85807b38;border-radius:5px;backdrop-filter:blur(14px)}.marker-readout{display:flex;align-items:center;gap:9px;font:10px monospace;white-space:nowrap}.marker-readout #chapter-code{color:var(--accent)}.marker-readout #chapter-progress{margin-left:auto;opacity:.5;font-size:9px;min-width:26px}.chapter-buttons{display:flex;justify-content:space-between;margin:8px -8px 0}.chapter-buttons button{font:9px monospace;color:var(--muted);opacity:.48;position:relative;width:35px;height:30px}.chapter-buttons button[aria-current="step"]{color:var(--accent);opacity:1}.chapter-buttons button:hover{opacity:1}.chapter-track{height:1px;background:#8884;position:relative;overflow:hidden}.chapter-track span{position:absolute;inset:0;background:var(--accent);transform:scaleX(0);transform-origin:0 0}.study-controls{position:fixed;right:var(--gutter);bottom:30px;z-index:20;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:15px;font:10px monospace;color:var(--muted);max-width:320px}.study-controls button{font:inherit;padding:0}.study-controls button:hover,.study-controls a:hover{color:var(--accent)}.study-controls>span{width:100%;font-size:8px;text-align:right;opacity:.45}.light{color-scheme:light}.chapter-map .chapter-buttons button{color:inherit}.chapter-map .chapter-buttons button[aria-current="step"]{color:var(--accent)}.study-controls{color:inherit}.reduced .feature-heading{opacity:1!important}.reduced .feature-links{--line:1!important}.reduced .feature-links li{opacity:1!important}.reduced .changing-phrase .char{opacity:1!important;transform:none!important}
@media(min-width:1700px){:root{--gutter:calc((100vw - 1530px)/2)}.copy{max-width:430px;width:430px}}
/* Mobile follows the reference: a compact top text area above a persistent stage. */
@media(max-width:899px){
 :root{--gutter:16px}
 .copy{width:calc(100vw - 32px);max-width:none}
 header{height:56px;padding:16px}
 header img{width:139px}header>span{font-size:8px}
 .hero-copy{display:flow-root;top:72px;width:calc(100vw - 32px);max-width:none}
 h1{font-size:40px;font-weight:700;line-height:.865;letter-spacing:normal;margin:10px 0 .365em}
 .hero-copy h1 br{display:none}
 h2{font-size:32px;font-weight:700;line-height:.865;letter-spacing:normal;margin-bottom:.365em}
 p{font-size:16px;font-weight:600;line-height:1.25;letter-spacing:normal;max-width:none}
 .hero-description{max-width:none}
 .held-copy{top:16px}
 .held-copy h2{font-weight:800;line-height:.95;letter-spacing:-.4px;margin-bottom:20px;max-width:none}
 .feature{padding:0}
 .feature-copy{position:fixed;top:16px;bottom:auto;opacity:0;visibility:hidden}
 .feature-links{display:none}
 .hero-actions{bottom:25svh}
 .chapter-map{left:16px;bottom:40px;width:min(280px,calc(100vw - 32px));padding:10px 12px}
 .study-controls{left:16px;right:16px;bottom:13px;max-width:none;justify-content:flex-start;gap:16px;font-size:9px}
 .study-controls>span{display:none}
 .ending-copy{top:128px}
}