:root{--ink:#243a31;--green:#235c45;--muted:#627469;--paper:#fafbf7;--line:#dbe2d9;--orange:#c66438}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.7 system-ui,-apple-system,Segoe UI,sans-serif}a{color:var(--green);text-underline-offset:4px}button,input{font:inherit}button,.button{cursor:pointer;border:1px solid #bccdc1;background:#fff;border-radius:7px;padding:10px 17px;color:var(--green);font-weight:650;text-decoration:none;display:inline-block}button:hover,.button:hover{background:#e7efe6}button:disabled{opacity:.55;cursor:not-allowed}button[aria-pressed=true],.button{background:var(--green);color:white}button[aria-pressed=true]:hover,.button:hover{background:#194632;color:white}:focus-visible{outline:3px solid #c66438;outline-offset:4px}.top{position:sticky;top:0;z-index:5;background:#fafbf7f5;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:20px 4%;gap:20px;height:78px}.top>span{font:11px ui-monospace,monospace;letter-spacing:2px}.brand{font-size:21px;letter-spacing:1px;text-decoration:none}.brand b{color:var(--orange)}#progress{position:absolute;bottom:-1px;left:0;width:0;height:3px;background:var(--orange)}.layout{max-width:1480px;margin:auto;display:grid;grid-template-columns:230px minmax(0,1fr);gap:50px;padding:0 4%}aside{position:sticky;top:98px;align-self:start;max-height:calc(100vh - 115px);overflow:auto;padding:20px 18px 20px 0;border-right:1px solid var(--line)}nav{display:grid;gap:2px}nav a{font-size:13px;padding:5px 9px;text-decoration:none;border-radius:5px;color:#56685d}nav a:hover,nav a.active{background:#e7eee3;color:#214f3b}nav a.active{font-weight:750}.offline{border-top:1px solid var(--line);margin-top:18px;padding:20px 9px 0;font-size:12px;color:var(--green)}.offline small{color:var(--muted)}main{min-width:0}.eyebrow{font:11px/1.5 ui-monospace,monospace;letter-spacing:2px;font-weight:700;color:var(--green);margin:0 0 18px}h1,h2,h3{line-height:1.15;letter-spacing:-.035em}h1{font-size:clamp(42px,4.7vw,70px);margin:20px 0}h1 em{font-style:normal;color:var(--orange)}h2{font-size:clamp(27px,3vw,39px);margin:0 0 23px}h3{font-size:20px;margin:0 0 14px}p{margin:12px 0 18px}.lead{font-size:20px;line-height:1.55}.hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:32px;padding:70px 0 50px;border:0}.hero p:not(.eyebrow){max-width:490px}.hero .button{margin:8px 0 22px}.hero .button span{padding-left:30px}.hero-art{border:1px solid #d1dbd0;background:#eef2e9;transform:rotate(-2deg);border-radius:12px;overflow:hidden}.hero-art svg{display:block;width:100%}.art-label{display:block;padding:17px;font:10px ui-monospace,monospace;letter-spacing:2px}.terminal{background:#233d30;color:#e2ebd9;font:12px/1.9 ui-monospace,monospace;padding:20px}.terminal span{color:#bdde90}.terminal i{color:#e9a15e}.tags{display:flex;gap:8px;flex-wrap:wrap}.tags span{font-size:11px;padding:4px 10px;border:1px solid var(--line);border-radius:4px}.intro-strip{border-block:1px solid var(--line);display:flex;gap:20px;justify-content:space-between;padding:23px 0;font-size:12px}.intro-strip b{margin-left:8px}section{padding:62px 0;border-bottom:1px solid var(--line)}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:24px 0}.cards article{border:1px solid var(--line);background:#fff;padding:23px;border-radius:9px}.cards p{font-size:15px;margin-bottom:0}.callout{background:#eaf0e5;border-left:3px solid #64875a;padding:19px 23px;border-radius:0 7px 7px 0;margin:25px 0}.callout p{margin:7px 0 0}.warning{background:#fff2e5;border-color:#d69a53}.think{background:#edf0f6;border-color:#778ca8}.flow{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:28px 0;font-size:14px}.flow span{padding:12px;background:#edf0e8;border:1px solid var(--line);border-radius:5px}.spools{display:flex;align-items:center;justify-content:space-around;gap:15px;padding:25px;background:#eef2e9;border-radius:9px;flex-wrap:wrap}.spools span{font-size:68px;line-height:1;color:var(--spool)}.spools small{display:block;font-size:12px;line-height:2;color:var(--ink)}.table-wrap{overflow-x:auto;margin:24px 0}table{border-collapse:collapse;width:100%;font-size:14px;text-align:left}th,td{border-bottom:1px solid var(--line);padding:14px}thead{background:#eaf0e5}tbody th{font-family:monospace}code{font: .9em ui-monospace,Consolas,monospace;background:#e9eee5;padding:2px 4px;border-radius:3px}pre{position:relative;background:#20342c;color:#eef4e8;padding:48px 22px 22px;border-radius:8px;overflow:auto;font-size:13px;line-height:1.8;tab-size:4}pre:before{content:attr(data-lang);position:absolute;top:12px;left:22px;font:11px ui-monospace,monospace;letter-spacing:1px;color:#c7db99}pre[data-lang=Python]{border-top:3px solid #deb765}pre[data-lang=OpenSCAD]{border-top:3px solid #8bbba7}pre code{background:none;padding:0;font-size:inherit;color:inherit;white-space:pre}.copy{position:absolute;top:8px;right:10px;padding:2px 9px;font-size:11px;background:#354d40;color:#e5eddf;border-color:#6b7d70}.tok-number{color:#ffd397}.tok-string{color:#c8dda0}.tok-keyword{color:#9cd5e2}.tok-comment{color:#acbbae}.lab{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;background:#eff2ea;padding:28px;border:1px solid var(--line);border-radius:10px;margin:25px 0}.lab>div,.lab>pre{min-width:0}.lab svg{width:100%;max-height:290px}label{display:block;font-size:14px;font-weight:600}input[type=range]{width:100%;accent-color:var(--green);display:block;margin:14px 0 22px;cursor:pointer}.muted{font-size:12px;color:var(--muted)}.shape-buttons{display:flex;flex-wrap:wrap;gap:8px}.process li,li{margin-bottom:10px}#hints .callout{margin:12px 0}#show-solution{margin-top:14px}.pipeline{background:#223e30;color:#e4f0df;display:flex;flex-direction:column;align-items:center;padding:35px;border-radius:10px;font:17px ui-monospace,monospace}.pipeline b{color:#b9cf94;padding:7px}.challenge{padding:38px;background:#edf1e5;border-radius:12px;margin:40px 0;border:1px solid #d5dfc9}.challenge .cards article{background:#f8faf4}details{border:1px solid var(--line);padding:17px 20px;border-radius:7px;margin:20px 0}summary{cursor:pointer;font-weight:650}#maze{display:grid;grid-template-columns:repeat(9,1fr);gap:3px;max-width:360px;margin:auto}#maze span{aspect-ratio:1;background:#fff;text-align:center;font-weight:bold}#maze .wall{background:#426c53;border-bottom:5px solid #294735}fieldset{border:1px solid var(--line);border-radius:8px;padding:22px;margin:24px 0}legend{font-weight:700;padding:0 8px}fieldset label{font-weight:400;display:flex;align-items:center;gap:12px;padding:9px;border-radius:5px}fieldset label:hover{background:#edf1e8}input[type=radio]{accent-color:var(--green);width:17px;height:17px;flex-shrink:0}.feedback{font-size:14px;margin:10px 0 0}.correct{color:#205c36}.incorrect{color:#9c3a23}#score{font-size:21px;font-weight:700}footer{padding:60px 0;color:var(--muted)}footer h3{color:var(--ink)}.skip{position:fixed;top:-100px;left:10px;z-index:20;background:#fff;padding:12px}.skip:focus{top:10px}[hidden]{display:none!important}@media(max-width:1100px){.layout{grid-template-columns:190px minmax(0,1fr);gap:28px}.hero{grid-template-columns:1fr}.hero-art{max-width:420px;transform:none}.hero{padding-top:40px}.lab{gap:18px;padding:18px}}@media(max-width:760px){.top{height:65px;padding:14px 5%}.top>span{display:none}.layout{display:block;padding:0 5%}aside{position:relative;top:0;max-height:none;border-right:0;padding:18px 0 10px}aside .eyebrow,.offline{display:none}nav{display:flex;overflow-x:auto;padding-bottom:12px}nav a{white-space:nowrap;background:#eef2e9}.hero{padding-top:28px;gap:25px}h1{font-size:52px}.hero-art{max-width:100%;width:100%}.lab{grid-template-columns:1fr}.intro-strip{flex-direction:column;gap:6px}section{padding:42px 0}.challenge{padding:22px}.spools span{font-size:48px}.flow button{flex:1 1 120px}.top>a:last-of-type{font-size:13px}html{scroll-padding-top:80px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}@media print{.top,aside,button,.hero-art,.skip{display:none}.layout{display:block}section{break-inside:avoid;padding:20px 0}body{background:white;color:black}pre{white-space:pre-wrap}pre code{white-space:pre-wrap}.lab{display:block}}
:root{overflow-wrap:break-word}
@media(min-width:761px) and (max-width:1000px){.lab{grid-template-columns:1fr}.hero-art{width:100%}}
#maze{grid-template-columns:repeat(9,minmax(0,1fr))}
