@charset "UTF-8";
:root{font-family:'Helvetica Neue',Arial,sans-serif;font-synthesis:none;background:#f4f3ef;color:#222922;--green:#102620;--ivory:#e9eadb;--muted:#6b7467;--line:#d0d3c7}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:5px}button{font:inherit;color:inherit;cursor:pointer}button,a,canvas{outline-offset:5px}button:focus-visible,a:focus-visible{outline:2px solid #708068}canvas:focus-visible{outline:2px solid #e3e8bf;outline-offset:-5px}h1,h2,p{margin:0}h1,h2{font-weight:400;letter-spacing:-.055em}em{font-family:Georgia,'Times New Roman',serif;font-weight:400}button{border:0;background:none}button:disabled{cursor:default}.skip{position:fixed;top:-100px;left:20px;z-index:10;background:#fff;padding:12px}.skip:focus{top:10px}.bar{display:flex;justify-content:space-between;align-items:center;padding:27px 4.8vw;border-bottom:1px solid var(--line);gap:24px;font-size:12px}.bar>a:nth-child(2){margin-left:auto;text-decoration:none}.brand{font-size:26px;font-weight:600;letter-spacing:-1.7px;text-decoration:none;white-space:nowrap}.brand span{color:#657753}.bar>span{color:var(--muted);margin-left:30px}.intro{margin:0 4.8vw;padding:78px 0 54px}.eyebrow{font:11px/1.5 'SFMono-Regular',Consolas,monospace;letter-spacing:.03em;color:var(--muted)}h1{font-size:clamp(52px,7.1vw,108px);line-height:1.04;margin-top:26px}h1 em{font-size:.97em}.intro-bottom{display:flex;align-items:flex-end;justify-content:space-between;margin-top:30px;gap:30px}.intro-bottom>p{font-size:18px;line-height:1.5}.intro-bottom>span{font:11px/1.6 'SFMono-Regular',Consolas,monospace;color:var(--muted)}.study{margin:0 4.8vw;background:var(--green);color:var(--ivory)}.study-top{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:26px 32px 22px}.variants{display:flex;gap:35px}.variants button{font-size:17px;padding:0 0 6px;color:#9aab91;position:relative}.variants button>span{font:9px/1.5 monospace;margin-right:11px;vertical-align:middle}.variants button[aria-pressed=true]{color:var(--ivory)}.variants button[aria-pressed=true]:after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:#afba9d}.state{font:10px/1.5 monospace;color:#a1ae97;white-space:nowrap}.surface{position:relative;aspect-ratio:1.6;overflow:hidden;scroll-margin-top:24px}.surface canvas,.surface img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.surface canvas{opacity:0;touch-action:pan-y}.cellular-enhanced .surface canvas{opacity:1}.cellular-enhanced .surface img{visibility:hidden}.surface-caption{position:absolute;left:32px;bottom:30px;font:10px/1.6 monospace;color:#bfcaad;pointer-events:none}.study-bottom{margin:0 32px;border-top:1px solid #47614d;display:flex;justify-content:space-between;gap:40px;padding:25px 0;align-items:flex-start}.study-bottom>p{font-size:14px;line-height:1.6;max-width:540px;color:#c5cdb7}.transport{display:flex;gap:28px;white-space:nowrap}.transport button{font-size:12px;padding:4px 0}.interaction{margin:0 32px;padding:23px 0 28px;border-top:1px solid #47614d;display:grid;grid-template-columns:auto 1fr auto;gap:25px 35px;align-items:center}.draw{font-size:14px;text-align:left;padding:8px 0}.draw:after{content:' ↗';margin-left:15px}.draw[aria-pressed=true]:after{content:' ×'}.tools{display:flex;gap:24px;opacity:.7;justify-self:center}.cellular-drawing .tools{opacity:1}.tools button{font-size:12px;padding:8px 0;color:#bec8ad}.tools button>span{margin-left:14px}.tools button[aria-pressed=true]{border-bottom:1px solid #a8b79a;color:var(--ivory)}.pulse{font-size:12px;padding:8px 0;text-align:right}.draw-help{grid-column:1/-1;font-size:11px;line-height:1.6;color:#a6b79b;max-width:750px}.study:not(.cellular-enhanced) .study-top button,.study:not(.cellular-enhanced) .transport,.study:not(.cellular-enhanced) .interaction{pointer-events:none;opacity:.4}.no-script{font-size:14px;padding:0 32px 30px;line-height:1.5}.notes{margin:0 4.8vw;padding:95px 0 100px;display:grid;grid-template-columns:1fr 1fr;gap:70px}.notes h2{font-size:clamp(35px,4.2vw,64px);line-height:1.08;margin-top:26px}.notes-copy{padding-top:35px;max-width:630px;font-size:16px;line-height:1.65;color:#576150}.notes-copy p+p{margin-top:20px}.notes-copy a{display:inline-block;margin-top:26px;font-size:12px;color:#293c28}footer{margin:0 4.8vw;padding:28px 0 40px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:30px;align-items:center}footer>p{font:19px/1.5 Georgia,serif;color:var(--muted)}footer>a:last-child{font-size:12px}
@media(min-width:1800px){.intro,.study,.notes,footer{max-width:1650px;margin-inline:auto}.bar{padding-inline:max(4.8vw,calc((100vw - 1650px)/2))}.surface{aspect-ratio:1.8}}
@media(max-width:800px){.bar{padding:23px 24px}.bar>span{display:none}.intro{padding:54px 0 35px}.intro,.study,.notes,footer{margin-inline:24px}h1{font-size:clamp(49px,9.1vw,72px);max-width:620px}.intro-bottom{align-items:flex-start}.intro-bottom>p{font-size:16px}.intro-bottom>span{font-size:10px;flex-shrink:0}.study-top{padding:22px;gap:14px}.variants{gap:21px}.variants button{font-size:15px}.variants button>span{margin-right:5px}.surface{aspect-ratio:1.3}.surface-caption{left:22px;bottom:20px}.study-bottom{margin-inline:22px;gap:25px}.study-bottom>p{font-size:13px}.transport{gap:20px}.interaction{margin-inline:22px;grid-template-columns:1fr 1fr;gap:20px}.tools{justify-self:end}.pulse{justify-self:start;grid-row:2;text-align:left}.draw-help{grid-row:3}.notes{padding:65px 0 70px;gap:35px}.notes-copy{font-size:14px}footer>p{display:none}}
@media(max-width:520px){.bar{padding:20px}.brand{font-size:24px}.intro,.notes,footer{margin-inline:20px}.intro{padding:44px 0 31px}h1{font-size:51px;line-height:1.04;max-width:360px}.intro-bottom{display:block;margin-top:25px}.intro-bottom>p{font-size:15px}.intro-bottom>span{display:block;margin-top:21px;font-size:10px}.intro-bottom>span br{display:none}.intro-bottom>span br:after{content:' · '}.study{margin-inline:0}.study-top{padding:22px 20px;flex-wrap:wrap;row-gap:15px}.variants{justify-content:space-between;width:100%;gap:16px}.variants button{font-size:15px}.state{font-size:9px}.surface{aspect-ratio:1.04}.surface-caption{font-size:9px;bottom:18px;left:20px}.study-bottom{margin-inline:20px;flex-direction:column;gap:18px;padding-block:23px}.transport{gap:27px}.interaction{margin-inline:20px;grid-template-columns:1fr;gap:19px}.draw{font-size:14px}.tools{justify-self:start;grid-row:2;gap:27px}.pulse{grid-row:3}.draw-help{grid-row:4;font-size:10px}.notes{grid-template-columns:1fr;padding:55px 0;gap:0}.notes h2{font-size:41px}.notes-copy{padding-top:25px;font-size:15px}footer{padding:25px 0 30px;gap:15px}footer>a:last-child{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}