:root{--ink:#17334f;--muted:#526b80;--teal:#067b75;--blue:#2858c6;--purple:#7750ac;--line:#d8e4eb;--bg:#f4f8fa;font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}*{box-sizing:border-box}body{margin:0}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2.5rem,4.5vw,4.6rem);line-height:1.07;letter-spacing:-.045em}h2{font-size:1.7rem;line-height:1.25;letter-spacing:-.025em}h3{font-size:1.1rem;line-height:1.4}a{color:var(--blue);text-underline-offset:4px}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);padding:9px 14px;font-weight:650;min-height:42px}button:hover{border-color:var(--teal);background:#edf8f6}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--teal);border-color:var(--teal);color:#fff}button.primary:hover{background:#05665f}button.danger{color:#a12f37}:focus-visible{outline:3px solid #ba5d0c;outline-offset:3px}input,select,textarea{width:100%;border:1px solid #b4c7d6;border-radius:8px;padding:10px 12px;background:white;color:var(--ink)}textarea{min-height:100px;resize:vertical}label{display:block;font-size:13px;font-weight:700;margin:12px 0 5px}.check{display:flex;align-items:start;gap:10px;font-weight:500}.check input{width:auto;margin-top:7px}fieldset{border:1px solid var(--line);border-radius:10px;margin:12px 0}legend{font-weight:700;padding:0 6px}.skip{position:absolute;left:-1000px}.skip:focus{left:0;background:#fff;z-index:50;padding:12px}.topbar{padding:18px 3%;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);background:#fff}.brand{font-weight:850;font-size:24px;letter-spacing:-1px;color:var(--ink);text-decoration:none;line-height:1.1}.brand span{color:var(--teal)}.brand small{display:block;font-size:9px;letter-spacing:2px;margin-top:8px;color:var(--muted)}nav,.actions,.pills{display:flex;gap:8px;align-items:center;flex-wrap:wrap}nav button{border:0;font-size:13px}nav a{font-size:13px;margin-left:8px}main{max-width:1680px;margin:auto;padding:30px 3% 60px;min-height:80vh}.eyebrow{text-transform:uppercase;letter-spacing:2px;color:var(--teal);font-size:11px;font-weight:800;margin-bottom:14px}.muted,small{color:var(--muted)}.hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:50px;padding:35px 0}.hero em{color:var(--teal);font-style:normal}.hero p.lede{font-size:18px;max-width:600px}.hero-art{min-height:370px;background:radial-gradient(ellipse,#e2f2ef,transparent 70%);position:relative}.hero-art svg{width:100%;height:370px}.panel,.card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:24px}.panel{margin-bottom:20px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.card{display:flex;flex-direction:column;align-items:start;gap:9px}.card h3,.card p{margin-bottom:0}.card button{margin-top:auto}.badge{display:inline-block;border-radius:20px;padding:4px 10px;background:#e6f4ef;color:#16685d;font-size:11px;font-weight:700}.badge.purple{background:#f0e9fa;color:#7048a0}.head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:20px 0}.head h1,.head h2{margin:0}.head h1{font-size:2rem}.inline{display:flex;gap:10px;align-items:end}.inline>div{flex:1}.split{display:grid;grid-template-columns:1fr 1fr;gap:16px}.details{margin-top:16px}summary{cursor:pointer;font-weight:650}details p{margin-top:12px}.work{display:grid;grid-template-columns:215px minmax(0,1fr) 350px;gap:16px;align-items:start}.explorer,.lesson{padding:18px;min-width:0}.explorer h2,.lesson h2{font-size:1.2rem}.explorer button{font-size:12px}.explorer label{font-size:12px}.explorer .outline-list{max-height:300px;overflow:auto}.outline-list button{width:100%;text-align:left;display:block;margin:5px 0;font-size:12px}.outline-list button small{display:block;font-size:10px}.canvas-wrap{min-width:0;background:#fff;border:1px solid var(--line);border-radius:17px;overflow:hidden}.canvas-wrap:fullscreen{width:100%;height:100%;padding:12px;background:var(--bg)}.canvas-wrap:fullscreen .canvas{height:calc(100vh - 150px)}.toolbar{padding:12px;display:flex;flex-wrap:wrap;gap:7px;border-bottom:1px solid var(--line)}.toolbar button{font-size:12px;min-height:38px;padding:7px 10px}.toolbar select{width:auto;max-width:190px;font-size:12px}.canvas{height:620px;background-color:#f9fbfc;background-image:radial-gradient(#dbe5ec 1px,transparent 1px);background-size:20px 20px;touch-action:none;overflow:hidden}.canvas svg{display:block}.canvas g[role=button]{cursor:pointer}.canvas g[role=button]:focus{outline:none}.canvas g[role=button]:focus rect{stroke:#b15a0c;stroke-width:5}.canvas g[data-edge]:focus line{stroke:#b15a0c}.legend{padding:12px;font-size:10px;display:flex;gap:10px;flex-wrap:wrap;border-top:1px solid var(--line)}.canvas-help{padding:0 12px 12px;font-size:11px;color:var(--muted)}.lesson{max-height:900px;overflow:auto}.lesson .badge{margin:0 4px 8px 0}.lesson p,.lesson li{font-size:13px}.lesson h3{margin-top:22px}.lesson button{font-size:12px}.lesson details{border-top:1px solid var(--line);padding:12px 0}.lesson summary{font-size:13px}.callout{background:#eef7f4;border-left:3px solid var(--teal);padding:14px;border-radius:0 9px 9px 0;margin:14px 0}.warning{background:#fff4df;border-color:#a76a12}.quiz{border:1px solid var(--line);border-radius:12px;padding:14px;margin:12px 0}.quiz label{font-size:12px}.feedback{padding:12px;background:#edf4ff;border-radius:8px;font-size:12px;margin-top:10px}.tabs{display:none}.progressbar{height:7px;background:#e6edf1;border-radius:10px;margin:10px 0;overflow:hidden}.progressbar i{display:block;background:var(--teal);height:100%;transition:width .3s}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:20px 0}.stats strong{display:block;font-size:1.9rem}.guide{max-width:900px;margin:auto}.guide details{background:white;border:1px solid var(--line);padding:18px;border-radius:12px;margin:12px 0}.cycle{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}.cycle span{font-size:11px;background:#e5edf2;border-radius:5px;padding:4px 7px}.cycle .active{background:var(--teal);color:white}dialog{border:1px solid var(--line);border-radius:20px;max-width:880px;width:calc(100% - 32px);max-height:90vh;padding:26px;color:var(--ink);box-shadow:0 30px 100px #102a4540}dialog::backdrop{background:#142c4750;backdrop-filter:blur(3px)}dialog h2{padding-right:40px}dialog .close{position:absolute;right:16px;top:16px}dialog .card{margin:12px 0}dialog pre{white-space:pre-wrap;overflow-wrap:anywhere}.error{background:#fff0ed;color:#842d25;border:1px solid #ddb5af;padding:13px;border-radius:10px;margin:12px 0}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);max-width:90vw;background:var(--ink);color:white;padding:12px 20px;border-radius:12px;z-index:100;font-size:14px}footer{border-top:1px solid var(--line);padding:24px 3%;font-size:12px;color:var(--muted);display:flex;gap:20px;flex-wrap:wrap}footer span{margin-left:auto}#print-summary{display:none}.empty{padding:30px;background:#edf3f5;border-radius:12px;margin:20px 0}.code{white-space:pre-wrap;background:#102b46;color:white;padding:12px;border-radius:9px;font:12px/1.6 ui-monospace,monospace;overflow-wrap:anywhere}.timeline li{margin:10px 0}.resource-list{padding-left:20px;overflow-wrap:anywhere}[hidden]{display:none!important}@media(max-width:1250px){.work{grid-template-columns:180px minmax(0,1fr) 310px;gap:12px}.canvas{height:600px}.explorer,.lesson{padding:14px}.toolbar select{max-width:145px}.topbar{flex-wrap:wrap}}@media(max-width:1000px){.work{grid-template-columns:190px minmax(0,1fr)}.lesson{grid-column:1/-1;max-height:none}.canvas{height:560px}.hero{gap:20px}.hero h1{font-size:3.5rem}}@media(max-width:700px){main{padding:22px 4% 40px}.topbar{padding:18px 4%}nav{gap:0}nav button,nav a{font-size:12px;padding:9px}.hero{grid-template-columns:1fr;padding:5px 0 20px}.hero h1{font-size:2.8rem}.hero-art{min-height:260px}.hero-art svg{height:260px}.grid{grid-template-columns:1fr}.split{grid-template-columns:1fr}.inline{flex-wrap:wrap}.inline>div{flex-basis:100%}.head{align-items:start;flex-direction:column}.panel{padding:19px}.work{display:block}.tabs{display:flex;gap:8px;margin:14px 0}.tabs button{flex:1;font-size:12px}.work [data-panel]{display:none}.work [data-panel].visible{display:block}.canvas{height:470px}.lesson{max-height:none}.stats{grid-template-columns:1fr 1fr}.toolbar button{min-height:42px}.toolbar select{max-width:100%}.lesson details{padding:16px 0}dialog{padding:22px 18px}.canvas-help{font-size:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}@media print{.topbar,#main,footer,dialog,#toast{display:none!important}#print-summary{display:block;color:black}#print-summary svg{max-width:100%;height:auto;page-break-after:always}#print-summary pre{font:11pt/1.5 Georgia,serif;white-space:pre-wrap;overflow-wrap:anywhere}body{background:#fff}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(min-width:701px){.explorer{max-height:900px;overflow:auto}}
