@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap');
:root{--bg:#faf8f2;--ink:#223c37;--muted:#53645e;--green:#23695c;--line:#d7dfd6;--wash:#eef2e9;--gold:#9a572e}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif;font-size:17px;line-height:1.7}a{color:var(--green);text-underline-offset:5px}a:hover{color:var(--gold)}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:5px}.wrap{width:min(1160px,calc(100% - 64px));margin:auto}header{max-width:1360px;margin:auto;padding:28px 38px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{font-size:12px;letter-spacing:.12em;font-weight:700;text-decoration:none}.brand span{letter-spacing:0;font-weight:400;padding-left:12px}nav{display:flex;gap:26px;font-size:14px}nav a{text-decoration:none}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;padding-top:85px;padding-bottom:75px;align-items:center}.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:700;color:var(--green);margin:0 0 26px}h1,h2{font-family:'Libre Caslon Display',Georgia,serif;font-weight:400;letter-spacing:-.035em;line-height:1.02;margin:0 0 28px}h1{font-size:clamp(54px,5.8vw,83px)}h1 em{font-weight:400;color:var(--green)}h2{font-size:clamp(40px,4.5vw,59px)}h3{font-size:21px;line-height:1.35;margin:15px 0}p{margin:0 0 20px;color:var(--muted)}.lead,.large{font-size:21px;line-height:1.55;color:var(--ink)}.actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin:30px 0;font-size:14px;font-weight:600}.button{padding:13px 22px;background:var(--green);color:white;text-decoration:none;border-radius:4px;display:inline-flex;gap:26px}.button:hover{background:#184c43;color:white}.byline,.small{font-size:13px}.hero-art{margin:0}.hero-art svg{width:100%;height:auto}figcaption{font-size:14px;text-align:center;color:var(--ink)}figcaption span{font-size:11px;color:var(--muted)}.strip{border-block:1px solid var(--line);padding:18px 0;font-size:12px}.strip .wrap{display:flex;justify-content:space-between;gap:20px}.strip span{color:var(--muted)}.section{padding-top:85px;padding-bottom:85px}.split{display:grid;grid-template-columns:1fr 1.15fr;gap:80px}.steps,.evidence{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:40px}.steps article{border-top:1px solid var(--line);padding-top:22px}.steps article>span{color:var(--gold);font-family:Georgia,serif;font-size:28px}.steps p,.evidence p{font-size:15px}aside{padding:22px 26px;border-left:3px solid var(--green);background:var(--wash);font-size:15px;color:var(--muted)}aside strong{display:block;color:var(--ink)}details{border-block:1px solid var(--line);margin-top:35px;padding:20px 0}summary{cursor:pointer;font-size:16px;font-weight:600;min-height:28px}details[open] summary{margin-bottom:24px}.equation{overflow-x:auto;padding:10px 0;color:var(--ink)}.tinted{background:var(--wash)}.lab{background:var(--bg);border:1px solid var(--line);padding:24px;text-align:center;border-radius:8px}.loop{width:240px;height:240px;border:2px solid #95b4a9;position:relative;margin:28px auto 45px}.vertex,.edge{position:absolute;z-index:1;border:0;min-width:44px;min-height:44px;background:var(--bg);color:var(--green);transform:translate(-50%,-50%);border-radius:50%}.vertex{font-size:27px}.edge{border:1px solid var(--line);font-size:18px;font-weight:700}.edge.negative{color:#9a472a;background:#f6e8da}.v0{left:0;top:0}.v1{left:100%;top:0}.v2{left:100%;top:100%}.v3{left:0;top:100%}.e0{left:50%;top:0}.e1{left:100%;top:50%}.e2{left:50%;top:100%}.e3{left:0;top:50%}.product{position:absolute;inset:65px 0;display:grid;place-content:center}.product span{font-size:10px;letter-spacing:.1em}.product strong{font-family:Georgia,serif;font-size:44px;font-weight:400}.lab p{font-size:13px;min-height:44px;margin:0}.reset{background:transparent;border:1px solid var(--green);color:var(--green);border-radius:4px;padding:8px 20px;min-height:44px}.phases{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:35px 0}.phases article{padding:30px;border:1px solid var(--line);border-radius:6px}.phases svg{width:100%;height:160px}.phases p{font-size:15px}.tag{font-size:10px;letter-spacing:.08em;font-weight:700;color:var(--green)}.evidence a{font-size:13px}.scope{margin-top:40px;background:var(--bg)}.scope h3{margin-top:0}.scope p{margin-bottom:0}.resources{max-width:850px;text-align:center}.resources .actions{justify-content:center}.resources .small{margin-top:30px}footer{padding-block:30px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:12px}.skip{position:absolute;top:-100px;left:20px;background:white;padding:10px;z-index:5}.skip:focus{top:10px}@media(max-width:800px){header{padding:20px 24px;flex-wrap:wrap}nav{gap:20px;flex-wrap:wrap}.brand span{display:none}.wrap{width:calc(100% - 40px)}.hero{grid-template-columns:1fr;padding-top:50px;gap:25px}.hero-art{max-width:440px;margin:auto}.split{grid-template-columns:1fr;gap:20px}.section{padding-block:55px}.steps,.evidence{grid-template-columns:1fr;gap:20px}.phases{grid-template-columns:1fr}.strip .wrap{display:block}.strip span{display:block;margin-top:8px}.actions{gap:18px}footer{flex-wrap:wrap}.lab{padding:20px 12px}.loop{width:210px;height:210px}.product{inset:50px 0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.paper-button{display:inline-flex;margin:0 0 24px;font-size:14px}.animation-section{padding-top:70px;padding-bottom:70px}.animation-figure{margin:0}.animation-video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#172d2b;border:1px solid var(--line);border-radius:6px}.animation-figure figcaption{font-size:13px;text-align:left;color:var(--muted);margin-top:12px}.animation-section .split{align-items:center}

/* Let intrinsic video dimensions shrink inside the one-column mobile grid. */
.animation-section .split>*{min-width:0}.animation-figure{width:100%;max-width:100%;min-width:0}.animation-video{width:100%;max-width:100%;height:auto}

/* Responsive teaching scenes: all motion is explicitly started and pausable. */
.split>*{min-width:0}.story-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:14px 0}.story-controls button{font-size:13px;padding:7px 12px}.reset:disabled{opacity:.55;cursor:default}.vertex{width:56px;height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;line-height:1.1;border:1px solid var(--line)}.compass-arrow{font-size:24px}.local-label{font-size:11px}.edge{transition:background-color .35s,box-shadow .35s}.edge.changed{box-shadow:0 0 0 5px #c0daca}.lab #feedback{min-height:100px;margin-top:8px}.lab .small{font-size:12px;margin-top:12px}.growth-controls{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:30px 0 12px}.growth-controls>div{flex:1 1 260px}.growth-controls label{display:block;font-size:14px;color:var(--ink);margin-bottom:8px}.growth-controls input{display:block;width:100%;min-height:36px;accent-color:var(--green)}.phases #area-grid,.phases #perimeter-grid{width:100%;height:auto;aspect-ratio:1}.question-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:28px}.question-pair figure{margin:0;padding:24px;border:1px solid var(--line);border-radius:6px;min-width:0}.question-pair svg{display:block;width:100%;height:auto;max-height:260px}.question-pair figcaption{text-align:left;font-size:13px;color:var(--muted)}.question-pair h3{margin-top:0}.video-chapters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}.video-chapters button{background:var(--bg);border:1px solid var(--line);color:var(--green);border-radius:4px;padding:9px 12px;font-size:12px;min-height:44px}.video-chapters button[aria-pressed=true]{background:var(--green);color:white}.motion-note{font-size:13px;padding:12px;border-left:3px solid var(--gold)}
@media(max-width:800px){.question-pair{grid-template-columns:minmax(0,1fr)}.story-controls button{flex:1 1 42%}.lab #feedback{min-height:118px}.growth-controls{gap:12px}.growth-controls>div{flex-basis:100%}.phases article{padding:20px}.video-chapters button{flex:1 1 30%;padding:8px 5px}.loop{margin-top:36px}}
@media(prefers-reduced-motion:reduce){.edge{transition:none}.edge.changed{box-shadow:none}}