:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#151821;color:#f7edd5}*{box-sizing:border-box}body{margin:0}main{max-width:1100px;margin:auto;padding:12px}.bar,.pad{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:8px 0}button,select{font:inherit;color:inherit;background:#30394b;border:1px solid #87909f;border-radius:5px;padding:10px;min-height:44px}button:focus-visible,select:focus-visible,canvas:focus-visible{outline:3px solid #edc96b;outline-offset:2px}canvas{display:block;width:100%;max-height:65vh;object-fit:contain;image-rendering:pixelated;touch-action:none;background:#08090c}p{font-size:14px;color:#c0c7d5}.pad button{min-width:52px;touch-action:none}.pad button[data-input^=action]{min-width:56px;font-weight:600}#sound[aria-pressed=false]{color:#c0c7d5;background:#232a38}label{display:inline-flex;gap:8px;align-items:center;margin:8px}#status{font-size:14px}