:root{--page-width:var(--content-width)}.hero{max-width:720px;padding:3.5rem 0 2.5rem}.hero h1{letter-spacing:-.025em;margin-bottom:.75rem;font-size:clamp(2rem,4.5vw,2.75rem)}.hero .lead{color:var(--fg-muted);margin:0;font-size:1.12rem}.layout{grid-template-columns:220px minmax(0,1fr);align-items:start;gap:3rem;display:grid}.toc-wrap{position:sticky;top:76px}.toc{margin:0;padding:0;font-size:.9rem;list-style:none}.toc a{color:var(--fg-muted);gap:.6rem;padding:.22rem 0;text-decoration:none;display:flex}.toc a:hover{color:var(--fg)}.toc-number{font-family:var(--font-mono);color:var(--fg-faint);padding-top:.08rem;font-size:.8rem}.chapters{flex-direction:column;display:flex}.chapter{border-top:1px solid var(--border);grid-template-columns:3rem minmax(0,1fr);padding:2rem 0;scroll-margin-top:60px;display:grid}.chapter:first-child{border-top:0;padding-top:0}.chapter-number{font-family:var(--font-mono);color:var(--fg-faint);padding-top:.2rem;font-size:.95rem}.chapter h2{margin:0 0 .35rem}.chapter .summary{max-width:680px;color:var(--fg-muted);margin:0}.concepts{max-width:680px;color:var(--fg-faint);margin:.5rem 0 0;font-size:.85rem}.demos{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.75rem;margin-top:1.25rem;display:grid}.demo{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-elev);color:var(--fg);padding:.9rem 1rem 1rem;text-decoration:none;transition:border-color .12s;display:block}.demo:hover{border-color:var(--border-strong)}.demo h3{margin:0 0 .3rem;font-size:.98rem}.demo:hover h3{color:var(--accent)}.demo p{color:var(--fg-muted);margin:0;font-size:.86rem;line-height:1.5}@media (width<=860px){.layout{grid-template-columns:minmax(0,1fr)}.toc-wrap{display:none}}@media (width<=560px){.hero{padding-top:2.25rem}.chapter{grid-template-columns:minmax(0,1fr)}.chapter-number{padding:0 0 .25rem}}