:root{color-scheme:dark;font:15px/1.4 system-ui,sans-serif;background:#071416;color:#e7f4ee}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% 0,#12343a,#071416 60%)}.wrap,.lab{max-width:1100px;margin:auto;padding:32px 22px}.back{color:#92dfd0;text-decoration:none}.lede{color:#9db9b6;max-width:650px}.card{display:grid;gap:6px;max-width:360px;margin-top:30px;padding:22px;border:1px solid #28545a;border-radius:14px;background:#102528;color:inherit;text-decoration:none}.card strong{font-size:20px}.card span{color:#a9c3bf}.editor{display:grid;grid-template-columns:minmax(320px,1fr) 330px;gap:24px;margin-top:24px}.stage{padding:16px;border:1px solid #28545a;border-radius:14px;background:#0a1c1f}.stage canvas{display:block;width:min(100%,600px);height:auto;margin:auto;border-radius:8px;background:repeating-conic-gradient(#122a2c 0 25%,#0d2224 0 50%) 0/24px 24px}.stage-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}button,select,input,textarea{font:inherit;color:inherit;background:#102b2d;border:1px solid #35666a;border-radius:7px;padding:8px}button{cursor:pointer}button:hover{background:#194044}aside{display:grid;align-content:start;gap:12px}.control{display:grid;grid-template-columns:1fr auto;gap:7px;margin:9px 0}.control input[type=range]{grid-column:1/-1;width:100%;padding:0}.control output{color:#8fd7ca}.export{border-top:1px solid #28545a;padding-top:12px;display:grid;gap:8px}.export textarea{min-height:170px;width:100%;font:12px ui-monospace,monospace}label{display:grid;gap:5px;color:#b7d0cc}h1{font-size:clamp(30px,5vw,48px);margin:14px 0 4px}@media(max-width:750px){.editor{grid-template-columns:1fr}.lab{padding:20px 14px}}
