:root{--ink:#1d2e29;--green:#173f35;--soft:#edf2e8;--lime:#d7f080;--line:#dce5d9;--muted:#62746a}*{box-sizing:border-box}body{margin:0;background:#f8f9f3;color:var(--ink);font-family:system-ui,sans-serif;line-height:1.6}a{text-decoration:none;color:inherit}button{cursor:pointer;font:inherit}h1,h2,h3{line-height:1.08;letter-spacing:-.045em}h1{font-size:clamp(3rem,6vw,5.8rem);margin:20px 0}h2{font-size:clamp(2rem,4vw,3.3rem)}h3{font-size:1.35rem}.wrap{width:min(1150px,calc(100% - 48px));margin:auto}.header{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center}.nav{display:flex;gap:35px;align-items:center}.brand{font-weight:800;letter-spacing:-.05em;white-space:nowrap}.brand b{background:var(--green);color:var(--lime);padding:8px;border-radius:6px;margin-right:8px}.links{display:flex;gap:28px;flex:1;font-size:.9rem;font-weight:650}.links a:hover{color:#418160}.button{display:inline-block;background:var(--green);color:white;border:0;border-radius:5px;padding:13px 19px;font-weight:700;font-size:.88rem}.button.alt{background:transparent;color:var(--green);border:1px solid #9cb5a4}.button.bright{background:var(--lime);color:var(--green)}.hero{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:90px 0}.hero p,.muted{color:var(--muted)}.eyebrow{text-transform:uppercase;color:#4d8669;letter-spacing:.12em;font:700 .72rem ui-monospace,monospace}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.hero-art{background:#e0ead8;border-radius:8px;min-height:360px;padding:50px 30px;position:relative}.window{background:white;border:1px solid #cbdac9;border-radius:7px;box-shadow:0 20px 50px #6480692c}.bar{padding:12px 18px;border-bottom:1px solid #e5ece4;font:12px monospace;color:#8e9c91}.code{padding:26px;color:#416b55;font:14px/2 monospace;white-space:pre-wrap}.sticker{position:absolute;bottom:20px;right:12px;background:var(--lime);padding:12px 20px;font-weight:700;border-radius:5px}.section{padding:75px 0}.white{background:white}.dark{background:var(--green);color:white}.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{display:block;background:#fff;border:1px solid var(--line);border-radius:7px;padding:26px}.card:hover{border-color:#90b59f}.card p{color:var(--muted)}.chip{display:inline-block;border:1px solid #b9ceba;border-radius:30px;padding:4px 10px;font:700 .68rem monospace;color:#437458}.arrow{display:block;margin-top:25px;color:#377c5a;font-weight:700}.pagehead{padding:70px 0 45px}.pagehead p{max-width:650px;color:var(--muted);font-size:1.1rem}.row{display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:20px;border-top:1px solid var(--line);padding:25px 0}.row h3,.row p{margin:5px 0}.row p{color:var(--muted)}.layout{display:grid;grid-template-columns:220px 1fr;gap:60px;padding:55px 0 90px}.sidebar{border-right:1px solid var(--line);padding-right:25px}.sidebar a{display:block;padding:10px;color:var(--muted)}.sidebar a.current{background:#e3eee0;color:var(--green);font-weight:700}.article{max-width:750px}.article h1{font-size:clamp(2.7rem,5vw,4.4rem)}.article h2{font-size:2rem;margin-top:45px}.article p{color:#53665c}.snippet{white-space:pre-wrap;overflow:auto;background:#203b34;color:#e1f3dd;border-radius:6px;padding:22px;font:14px/1.8 monospace}.callout{background:#e7f1de;border-left:4px solid #80ad75;padding:20px}.editor{display:grid;grid-template-columns:1fr 1fr;min-height:500px;border:1px solid var(--line);border-radius:7px;overflow:hidden}.edit{display:flex;flex-direction:column;background:#203b34}.editorbar{display:flex;justify-content:space-between;align-items:center;background:#2a493e;color:#e7f2e8;padding:12px 18px;font:12px monospace}.editorbar button{border:0;border-radius:4px;padding:8px 12px;font-weight:700}.run{background:var(--lime);color:var(--green)}textarea{flex:1;width:100%;min-height:430px;resize:vertical;border:0;background:#203b34;color:#e4f5df;padding:20px;font:14px/1.7 monospace}iframe{border:0;width:100%;min-height:470px;height:100%;background:white}.aboutgrid{display:grid;grid-template-columns:1fr 1fr;gap:60px}.footer{background:#122e27;color:#d6e4d6;padding:50px 0 25px}.foot{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}.footlinks{display:flex;gap:25px}.footer small{display:block;color:#a0b9a7;border-top:1px solid #405b4d;margin-top:40px;padding-top:20px}a:focus-visible,button:focus-visible,textarea:focus-visible{outline:3px solid #d68b61;outline-offset:3px}@media(max-width:760px){.hero,.aboutgrid,.layout,.editor{grid-template-columns:1fr}.hero{gap:25px;padding:55px 0}.grid{grid-template-columns:1fr}.layout{gap:20px}.sidebar{border:0;border-bottom:1px solid var(--line);display:flex;overflow:auto}.sidebar a{white-space:nowrap}.nav{gap:15px}.links{gap:14px;justify-content:flex-end}.nav>.button{display:none}.brand{font-size:.86rem}.wrap{width:calc(100% - 32px)}.row{grid-template-columns:40px 1fr}.row .button{grid-column:2;justify-self:start}}