:root{font-family:system-ui,sans-serif;color:#19212b;background:#f5f6fa}*{box-sizing:border-box}body{margin:0;padding:20px}h1{font-size:20px;margin:0 0 7px;font-weight:650;letter-spacing:-.5px}p{margin:0;font-size:13px;color:#657080;line-height:1.6}canvas{display:block;width:100%;height:auto;margin:15px 0 10px;background:#f5f6fa}label{font-size:14px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}input{accent-color:#2d55f2;min-width:180px;flex:1;min-height:38px;cursor:pointer}output{font-size:14px;line-height:1.5;display:block;margin:8px 0 14px;min-height:22px}button{background:#2d55f2;color:#fff;border:0;border-radius:7px;font:600 14px system-ui;padding:12px 22px;min-height:44px;cursor:pointer}button:hover{background:#2348db}button:focus-visible,input:focus-visible{outline:3px solid #849afa;outline-offset:4px}.model-note{margin-top:13px;font-size:12px;color:#687180;max-width:780px}.controls{background:white;padding:14px 18px;border-radius:11px}@media(max-width:500px){body{padding:14px}h1{font-size:18px}label{display:block}input{display:block;width:100%;margin-top:7px}output{font-size:13px}canvas{margin:10px 0}.model-note{font-size:11px}}