:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#edf0ef;background:#18232d;--accent:#f4bb65}*{box-sizing:border-box}body{margin:0}header,main,footer{max-width:1280px;margin:auto}header{padding:28px 42px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff16}.brand{color:inherit;text-decoration:none;font-size:18px;font-weight:650;display:flex;gap:12px;align-items:center}.mark{color:var(--accent);font-size:30px}.badge,.eyebrow,.notes article>span{font-size:11px;letter-spacing:2px;font-weight:650}.badge{color:#a8b4ba}main{padding:72px 42px 36px;display:grid;grid-template-columns:.88fr 1.12fr;gap:44px}.intro{padding-top:28px}.eyebrow{color:var(--accent);margin:0 0 18px}h1{font-size:clamp(42px,4.5vw,66px);line-height:1.07;letter-spacing:-3px;font-weight:600;margin:24px 0}p{line-height:1.7}.lede{color:#b7c3c9;max-width:390px;font-size:17px}.button,button{background:var(--accent);color:#20262b;border:0;border-radius:7px;font:inherit;font-weight:650;cursor:pointer}.button{display:inline-flex;gap:32px;text-decoration:none;padding:15px 20px;margin-top:16px}.caption{font-size:12px;color:#95a6b1;margin-top:22px}.workbench{border:1px solid #ffffff19;background:#1e2c37;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px #08131d50;scroll-margin-top:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:24px 26px}.panel-head .eyebrow{font-size:10px;margin:0 0 5px}h2{font-size:20px;margin:0;font-weight:550}.status{font-size:11px;color:#b7c3c9;display:flex;align-items:center;gap:7px}.status i{width:6px;height:6px;background:#9bc9a5;border-radius:50%}.drawing{background:radial-gradient(ellipse at center,#334552,#1e2c37 72%)}svg{display:block;width:100%;height:auto}.controls{padding:20px 24px;border-top:1px solid #ffffff15;display:flex;gap:18px;align-items:center;flex-wrap:wrap}label{font-size:12px;color:#b7c3c9;display:flex;align-items:center;gap:9px}input{width:100px;accent-color:var(--accent)}output{min-width:10px;color:#edf0ef}select{background:#273947;border:1px solid #ffffff25;border-radius:5px;color:#edf0ef;padding:7px}button{font-size:12px;padding:10px 13px;margin-left:auto}.demo-note{font-size:11px;color:#95a6b1;margin:0;padding:0 24px 18px}.notes{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:42px;border-top:1px solid #ffffff19;margin-top:24px;padding-top:34px}.notes article>span{color:#899eab;font-size:10px}h3{font-size:17px;font-weight:550;margin:13px 0}.notes p{font-size:13px;color:#a7b8c2;margin:0}footer{display:flex;justify-content:space-between;padding:26px 42px 36px;color:#8196a4;font-size:11px}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #fff;outline-offset:5px}@media(max-width:850px){main{grid-template-columns:1fr;padding-top:35px;gap:25px}.intro{padding:0}h1{letter-spacing:-2px}.lede{max-width:550px}.notes{gap:24px}.badge{font-size:9px;letter-spacing:1px}}@media(max-width:560px){header,footer{padding:20px}.brand{font-size:15px}.badge{max-width:115px;text-align:right;line-height:1.7}main{padding:28px 20px}.notes{grid-template-columns:1fr;gap:25px}.panel-head{padding:20px}.controls{gap:12px;padding:16px}button{margin-left:0}footer{gap:20px;line-height:1.7}}