:root{color-scheme:light}*{box-sizing:border-box}body{margin:0;background:#f7faf9;color:#253e46;font:15px/1.65 Georgia,serif}main{max-width:920px;margin:auto;padding:22px}.eyebrow,h2,.controls,.presets,.method,#status{font-family:system-ui,-apple-system,sans-serif}.eyebrow{font-size:10px;color:#08747d;letter-spacing:.08em;text-transform:uppercase;margin:0 0 5px}h2{font-size:23px;line-height:1.3;margin:0 0 10px;letter-spacing:-.035em}.intro{margin:0;max-width:800px}.controls{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:18px;padding:17px;background:#eaf3f1;border:1px solid #d4e4e2;border-radius:8px;margin:18px 0 12px;font-size:12px}.controls label{display:grid;grid-template-columns:1fr auto;gap:7px;min-width:0;font-weight:600}.controls output{color:#08747d;font-variant-numeric:tabular-nums}.controls input{width:100%;grid-column:1/-1;margin:3px 0;min-height:25px;accent-color:#08747d}.controls span{grid-column:1/-1;font-size:10px;font-weight:400;color:#61787d;line-height:1.5}.presets{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}.presets button{background:white;border:1px solid #aac6c8;color:#08747d;border-radius:5px;padding:7px 10px;font:600 11px/1.5 system-ui,sans-serif;min-height:34px;cursor:pointer}.presets button[aria-pressed=true]{background:#08747d;color:white}.panel{border:1px solid #d4e4e2;background:#fff;border-radius:8px;overflow:hidden}canvas{display:block;width:100%;aspect-ratio:1.09;cursor:crosshair;touch-action:none}input:focus-visible,button:focus-visible,canvas:focus-visible{outline:3px solid #c89650;outline-offset:3px}#status{font-size:12px;min-height:20px;color:#536c73;margin:12px 0 8px;font-variant-numeric:tabular-nums}.method{font-size:11px;color:#61787d;line-height:1.7;margin:0}@media(max-width:650px){main{padding:17px 11px}.controls{grid-template-columns:1fr 1fr;padding:13px;gap:15px}.controls label:first-child{grid-column:1/-1}h2{font-size:21px}}@media(max-width:360px){.controls{grid-template-columns:1fr}.controls label{grid-column:1/-1}.controls span{font-size:11px}}