:root{color:#252823;background:#f5f1e8;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0}main{max-width:850px;margin:24px auto;padding:0 25px}.eyebrow{letter-spacing:1.5px;font:10px monospace}h1{letter-spacing:-2px;margin:18px 0;font-size:48px}p{color:#61665c;font-size:14px;line-height:1.7}canvas{aspect-ratio:7/8;width:min(100%,448px);image-rendering:pixelated;touch-action:none;margin-inline:auto;background:#0d111c;border:12px solid #242c42;margin-top:28px;display:block}canvas:focus-visible,button:focus-visible{outline-offset:4px;outline:3px solid #795fce}.controls{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;display:flex}.controls p{font:12px monospace}button{color:#f5f1e8;cursor:pointer;background:#252823;border:0;padding:12px 22px;font:12px monospace}button:disabled{opacity:.5;cursor:wait}.note{border-top:1px solid #d8d9ce;padding-top:15px;font:10px/1.8 monospace}@media (max-width:550px){main{margin:30px auto;padding:0 18px}h1{font-size:38px}p{font-size:12px}canvas{border-width:7px}}.direction-pad{justify-content:center;gap:8px;margin-top:14px;display:flex}.direction-pad button{touch-action:manipulation;min-width:48px;min-height:48px;padding:10px;font-size:20px}