/* Shared reading layout, matching the established foundations pages. */
:root{--max:1160px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--body);font:16px/1.7 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button{cursor:pointer}a{color:var(--mint);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,p{margin-top:0}h1,h2,h3{color:var(--text);line-height:1.16;letter-spacing:-.035em}h1{font-size:clamp(2.05rem,3.4vw,3.05rem);margin-bottom:14px}h2{font-size:clamp(1.55rem,2.2vw,2rem);margin-bottom:13px}h3{font-size:1.13rem;margin-bottom:7px}strong{color:var(--text)}code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}code{font-size:.91em;color:var(--body)}::selection{background:var(--panel);color:var(--text)}:focus-visible{outline:2px solid var(--mint);outline-offset:3px}.wrap{max-width:var(--max);margin-inline:auto;padding-inline:34px}.skip{position:absolute;top:-100px;left:14px;background:var(--text);color:var(--bg);padding:8px 13px;z-index:10}.skip:focus{top:12px}
.kicker,.eyebrow,.lab-label,.mini-label{font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--mint)}.eyebrow{display:block;margin-bottom:9px}.topline{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-block:21px;font-size:12px;color:var(--muted)}.topline a{color:var(--muted)}.topline a:hover{color:var(--mint)}.rule{height:1px;background:var(--panel)}.overview{padding-top:40px;padding-bottom:70px}.overview>p{max-width:760px}.lead{font-size:18px;line-height:1.58}.quiet{font-size:14px;color:var(--muted)}.lesson-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin:28px 0 40px}.lesson-card{display:flex;flex-direction:column;min-height:260px;padding:27px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--body);transition:transform .2s,border-color .2s}.lesson-card:hover{border-color:var(--line);transform:translateY(-3px);text-decoration:none}.lesson-card h2{margin:11px 0;font-size:1.7rem}.lesson-card p{font-size:15px;max-width:440px}.lesson-card span:last-child{color:var(--mint);font-size:13px;font-weight:750;margin-top:auto}.overview-note{max-width:820px;border-top:1px solid var(--line);padding-top:25px}.overview-note h2{font-size:1.35rem}.overview-note p{font-size:14px}
.lesson-shell{display:grid;grid-template-columns:155px minmax(0,1fr);gap:56px;align-items:start}.side{position:sticky;top:24px;padding-top:17px}.side p{font-size:10px;letter-spacing:.13em;color:var(--dim);font-weight:800}.side a{display:block;border-left:1px solid var(--line);padding:9px 11px;color:var(--muted);font-size:12px;line-height:1.32}.side a:hover{color:var(--mint);border-color:var(--mint);background:var(--panel);text-decoration:none}.article{min-width:0;padding-bottom:90px}.article-head{max-width:830px;padding:26px 0 15px;border-top:1px solid var(--line)}.article-head>p{font-size:17px;line-height:1.58;max-width:770px}.route{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:9px 0 30px;max-width:820px}.route span{border:1px solid var(--line);background:var(--panel);color:var(--body);padding:5px 9px;border-radius:6px;font-size:11px;font-weight:750}.route b{font-size:12px;color:var(--dim);font-weight:400}.reading{max-width:800px}.reading section{margin:0 0 36px;scroll-margin-top:25px}.reading p{margin-bottom:15px;line-height:1.78}.reading li{margin-bottom:7px}.reading ul,.reading ol{padding-left:22px}.callout{border-left:3px solid var(--orange);background:var(--panel);color:var(--body);padding:15px 19px;margin:22px 0;font-size:14px}.callout strong{color:var(--body)}.two-up{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:20px 0}.concept-card{border:1px solid var(--line);border-radius:9px;background:var(--panel);padding:17px}.concept-card span{display:block;color:var(--mint);font-size:10px;letter-spacing:.12em;font-weight:800;margin-bottom:6px}.concept-card p{font-size:13px;line-height:1.6;margin-bottom:0}.trace{border:1px solid var(--line);background:var(--panel);border-radius:9px;margin:20px 0;overflow:hidden}.trace-row{display:grid;grid-template-columns:155px minmax(0,1fr);gap:15px;padding:9px 15px;border-top:1px solid var(--line);font-size:13px}.trace-row:first-child{border-top:0}.trace-row strong{font-weight:700}.trace-row>span{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--body);overflow-wrap:anywhere}
.lab{max-width:850px;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:24px;margin:29px 0 42px;scroll-margin-top:25px}.lab h2{font-size:1.62rem;margin:5px 0 8px}.lab>p{font-size:14px;color:var(--muted);max-width:720px}.lab-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin:22px 0}.field{display:block;border:1px solid var(--line);border-radius:8px;background:var(--panel2);padding:11px 13px}.field>span{display:flex;justify-content:space-between;gap:10px;font-size:12px;font-weight:700;color:var(--body)}.field>span>output{color:var(--mint);font:700 13px ui-monospace,SFMono-Regular,Menlo,monospace}.field input[type=range]{display:block;width:100%;margin-top:11px;accent-color:var(--mint)}.field input[type=number],.field select{width:100%;margin-top:8px;background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:6px;padding:7px 9px}.lab-actions{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0}.lab-actions button{border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--mint);padding:9px 13px;font-size:13px;font-weight:750}.lab-actions button:hover{background:var(--panel)}.lab-actions button.primary{background:var(--mint);color:var(--body)}.lab-actions button:disabled{opacity:.45;cursor:not-allowed}.readouts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:15px 0}.readout{border:1px solid var(--line);border-radius:8px;background:var(--panel2);padding:11px;min-width:0}.readout>span{display:block;color:var(--muted);font-size:10px;letter-spacing:.08em;text-transform:uppercase;line-height:1.3}.readout strong{display:block;color:var(--text);font:700 17px ui-monospace,SFMono-Regular,Menlo,monospace;margin-top:6px;overflow-wrap:anywhere}.lab-status{border-top:1px solid var(--line);padding-top:12px;margin:15px 0 0!important;color:var(--body)!important;font-size:13px!important;min-height:58px}.note-line{font-size:12px;color:var(--muted)}
.code-card{max-width:810px;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--panel);margin:21px 0 27px}.code-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 15px;font-size:12px;font-weight:700;color:var(--text)}.code-card-head a{font-weight:650;white-space:nowrap}.code-card pre{background:var(--panel);color:var(--body);margin:0;padding:15px 17px;overflow:auto;font-size:12px;line-height:1.7;tab-size:4}.code-card p{font-size:13px;line-height:1.65;padding:14px 16px;margin:0}.check{max-width:810px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:0 15px;margin:20px 0}.check summary{cursor:pointer;color:var(--text);font-weight:700;font-size:14px;padding:13px 0}.check p{border-top:1px solid var(--line);padding:12px 0 15px;margin:0;font-size:14px}.definitions{max-width:810px;border-top:1px solid var(--line);padding-top:22px;margin:44px 0 30px}.definitions h2{font-size:1.6rem}.definitions dl{margin:0}.definitions dl>div{display:grid;grid-template-columns:165px minmax(0,1fr);gap:14px;padding:10px 0;border-top:1px solid var(--line)}.definitions dt{font-weight:750;color:var(--text);font-size:13px}.definitions dd{margin:0;font-size:13px;line-height:1.6}.source-note{max-width:810px;border-top:1px solid var(--line);padding-top:16px;color:var(--muted);font-size:12px}.bottom-nav{display:grid;grid-template-columns:1fr 1fr;gap:9px;max-width:810px;margin:33px 0}.bottom-nav a{border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:13px 16px;font-weight:750;font-size:13px}.bottom-nav a:last-child{text-align:right}.footer{border-top:1px solid var(--line);padding:24px 0 38px;color:var(--muted);font-size:12px}.footer .wrap{display:flex;justify-content:space-between;gap:12px}
@media(max-width:850px){.lesson-shell{grid-template-columns:125px minmax(0,1fr);gap:25px}.wrap{padding-inline:24px}.readouts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.wrap{padding-inline:19px}.overview{padding-top:25px}.lesson-grid,.lesson-shell{display:block}.lesson-card{min-height:220px;margin-bottom:11px}.side{display:none}.article-head{padding-top:20px}.article-head>p{font-size:16px}.lab{padding:17px}.lab-grid,.two-up{grid-template-columns:1fr}.readouts{grid-template-columns:repeat(2,1fr)}.trace-row{grid-template-columns:1fr;gap:2px}.definitions dl>div{display:block}.definitions dt{margin-bottom:3px}.bottom-nav{grid-template-columns:1fr}.bottom-nav a:last-child{text-align:left}.footer .wrap{display:block}.footer span{display:block}}
@media(max-width:430px){.code-card-head{align-items:flex-start;flex-direction:column}.lab-actions button{flex-grow:1}.readout strong{font-size:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important}}


.article .code-card pre{font-size:14px}
.lab-plots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0 6px}
.plot-card{margin:0;border:1px solid var(--line);border-radius:9px;background:var(--panel-2);padding:8px 8px 4px}
.plot-card figcaption{font-size:14px;color:var(--muted);padding:4px 6px 0}
.train-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:14px 0 4px;font-size:13px}
.train-controls label{white-space:nowrap}
.train-controls output{font:700 13px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--blue);min-width:3ch;text-align:right}
.train-controls input[type=range]{flex:1;min-width:160px;accent-color:var(--blue)}
.train-controls button{border:1px solid var(--blue);border-radius:7px;background:var(--blue);color:var(--on-accent);padding:8px 14px;font-size:13px;font-weight:750;min-width:9.5em}
@media(max-width:760px){.lab-plots{grid-template-columns:1fr}}