body{background:#fff}main{max-width:1200px;margin:auto;padding:0 34px}.site-header{max-width:1280px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:26px 34px;border-bottom:1px solid var(--line);gap:24px}.site-header nav{display:flex;gap:24px;flex-wrap:wrap}.site-header a{text-decoration:none;font:14px var(--sans)}.site-header .brand{font-weight:700}.intro{padding:54px 0 40px}.kicker{font:11px/1.6 var(--mono);letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}.intro>.kicker{display:flex;justify-content:space-between;gap:20px}h1{font:clamp(45px,6.6vw,80px)/1.1 var(--serif);letter-spacing:-2px;margin:27px 0 20px}.deck{font:clamp(23px,3vw,32px)/1.4 var(--serif);color:var(--accent)}.intro-copy{display:grid;grid-template-columns:1fr 1fr;gap:60px;max-width:1000px}.intro-copy p{font-size:17px;line-height:1.8}.experiment{border:1px solid #cdd9dd;background:#f9fbfb;scroll-margin-top:20px}.plate-heading{display:flex;align-items:end;justify-content:space-between;padding:25px 28px;gap:20px}.plate-heading h2{font:29px var(--serif);margin:8px 0 0}.plate-heading>.record-label{font:11px/1.7 var(--mono);text-align:right;color:var(--muted)}button{cursor:pointer;border:1px solid #b8cdd2;background:#fff;color:var(--accent);padding:11px 15px;font:13px var(--sans)}button:hover{background:#edf4f4}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--teal);outline-offset:4px}.patterns{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.patterns button{border:0;border-right:1px solid var(--line);padding:16px 24px;text-align:left;display:grid;grid-template-columns:85px 1fr;column-gap:20px;background:transparent}.patterns svg{width:85px;grid-row:1/3;align-self:center;fill:none;stroke:var(--accent);stroke-width:1.5}.patterns strong{font:15px var(--sans)}.patterns span{font:11px var(--sans);margin-top:5px;color:var(--muted)}.patterns [aria-pressed=true]{background:#eaf3f1;box-shadow:inset 0 -3px var(--teal)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 280px}.drawing{position:relative;min-width:0;background:#f8fbfb}canvas{display:block;width:100%;height:470px}.drawing-meta{position:absolute;bottom:18px;left:22px;right:22px;display:flex;justify-content:space-between;gap:20px;font:10px var(--mono);color:#607b87}.workspace aside{padding:24px;border-left:1px solid var(--line);background:white}#section{width:100%;height:140px}dl{font:12px var(--sans)}dl>div{display:flex;justify-content:space-between;gap:10px;padding:13px 0;border-top:1px solid var(--line)}dd{margin:0;color:var(--teal);text-align:right}#insight{font:14px/1.7 var(--serif);color:var(--accent)}.controls{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;padding:22px 26px;border-top:1px solid var(--line);background:#fff}.controls label{font:12px var(--sans)}.controls output{float:right;color:var(--teal)}input[type=range]{display:block;width:100%;margin-top:17px;accent-color:var(--teal)}select{display:block;width:100%;margin-top:10px;padding:8px;border:1px solid #cdd9dd;background:white;color:var(--accent);font:12px var(--sans)}.buttons{grid-column:1/-1;display:flex;gap:10px}.plate-note{font:12px/1.7 var(--sans);color:var(--muted);padding:0 26px 18px;margin:12px 0 0}.model-note{padding:12px 26px;margin:0;border-top:1px solid var(--line);font:12px/1.7 var(--sans);color:var(--teal)}.model-note.warning{color:#9a5c28;background:#fcf4e8}.section{padding:55px 0;border-bottom:1px solid var(--line);margin:0}.section h2{font:36px/1.2 var(--serif);margin:12px 0 23px}.section p{font-size:17px;line-height:1.8}.section-lead{max-width:830px}.story{display:grid;grid-template-columns:1fr 1fr;gap:64px}.diagram{padding:24px;border:1px solid var(--line);align-self:center;background:#f7faf9}.diagram svg{width:100%;height:auto}.diagram p:last-child{font:12px/1.7 var(--sans);color:var(--muted)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font:13px/1.6 var(--sans);margin:20px 0}th,td{padding:16px 12px;border-bottom:1px solid var(--line);text-align:left}caption{text-align:left;font:12px var(--mono);color:var(--muted);padding:16px 0}tr.active-fold{background:#edf5f2}td.flag{color:#9a5c28}.chart-frame{display:grid;grid-template-columns:1fr 1.8fr;gap:40px;margin-top:40px;padding:28px;background:#f7faf9;border:1px solid var(--line)}.chart-frame h3{font:25px/1.3 var(--serif)}.chart-frame p{font:14px/1.8 var(--sans)}.chart-frame svg{width:100%;align-self:center}.legend{display:flex;flex-direction:column;gap:5px}.two{color:#315f73}.four{color:#287c72}.eight{color:#a66c35}.equations{border-left:2px solid var(--teal);padding:8px 0 8px 20px;margin:25px 0}.equations p{font:17px/1.7 var(--mono);margin:8px 0}.small,.section p.small{font:12px/1.8 var(--sans);color:var(--muted)}.method-box{padding:28px;background:#f7f9f9;border:1px solid var(--line);align-self:start}.method-box h3{font:25px var(--serif);margin-top:0}.method-box li{font:16px/1.8 var(--serif);margin:15px 0}.method-box ul{padding-left:20px}.method-box p{font-size:15px}.downloads{display:grid;grid-template-columns:1fr 1fr;gap:18px}.downloads a{border:1px solid var(--line);padding:22px;text-decoration:none;font:20px var(--serif)}.downloads small{display:block;font:12px/1.7 var(--sans);color:var(--muted);margin-top:9px}footer{max-width:1200px;margin:auto;padding:28px 34px;display:flex;justify-content:space-between;gap:20px;font:12px var(--sans)}
@media(max-width:950px){.workspace{grid-template-columns:minmax(0,1fr) 230px}.patterns button{padding:16px 14px;grid-template-columns:60px 1fr;gap:8px}.patterns svg{width:60px}.story{gap:30px}.chart-frame{grid-template-columns:1fr 1.5fr;gap:20px}}
@media(max-width:720px){main{padding:0 20px}.site-header{padding:20px;align-items:start;flex-direction:column;gap:18px}.site-header nav{gap:12px 18px}.intro{padding:32px 0}.intro>.kicker{display:block}.intro>.kicker span{display:block;margin-top:10px}h1{letter-spacing:-1px}.intro-copy,.story,.chart-frame{grid-template-columns:1fr;gap:20px}.intro-copy p{margin:0}.plate-heading{padding:20px}.plate-heading>.record-label{display:none}.plate-heading h2{font-size:25px}.patterns button{display:block;text-align:center;padding:14px 6px}.patterns svg{display:block;margin:auto auto 10px;width:60px}.patterns strong{font-size:12px;display:block}.patterns span{display:block;font-size:10px}.workspace{grid-template-columns:1fr}canvas{height:380px}.workspace aside{border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:0 15px;padding:18px}.workspace aside>.kicker{grid-column:1}#section{grid-column:1;height:auto}.workspace aside dl{grid-column:2;grid-row:1/3;margin:0;font-size:10px}dl>div{padding:10px 0}#insight{grid-column:1/-1;margin:12px 0 0}.drawing-meta{font-size:9px;left:14px;right:14px}.drawing-meta span:last-child{display:none}.controls{grid-template-columns:1fr 1fr;padding:18px;gap:20px}.controls label:last-of-type{grid-column:1/-1}.buttons{flex-wrap:wrap}button{font-size:12px}.plate-note,.model-note{padding-left:18px;padding-right:18px}.section{padding:36px 0}.section h2{font-size:30px}.section p{font-size:16px}.chart-frame{padding:18px}.chart-frame h3{margin:0}.legend{flex-direction:row;flex-wrap:wrap;font-size:12px!important}.downloads{grid-template-columns:1fr}.equations p{font-size:12px}.method-box{padding:22px}.diagram{padding:15px}footer{flex-wrap:wrap;padding:25px 20px}}

canvas{height:510px}#section{height:160px}.press-controls{grid-template-columns:1fr 1fr}.press-controls>.buttons{grid-column:2;align-items:center;flex-wrap:wrap}.mesh-toggle{display:flex;gap:7px;align-items:center;font:12px var(--sans)}.parameters{font-size:12px}.parameters dd{max-width:140px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin:25px 0 40px}.metrics strong{display:block;font:34px var(--serif);color:var(--teal)}.metrics span{display:block;font:13px/1.7 var(--sans);margin-top:10px;color:var(--muted)}
@media(max-width:720px){canvas{height:390px}#section{height:auto}.press-controls{grid-template-columns:1fr}.press-controls>.buttons{grid-column:1}.metrics{gap:15px}.metrics strong{font-size:22px}.metrics span{font-size:11px}.equations p{font-size:12px}}

@media(max-width:720px){.workspace aside{display:block}#section{width:100%;height:160px}.workspace aside dl{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;font-size:12px}.workspace aside dl>div{align-items:start}.workspace aside dd{max-width:95px}}
