html,body{width:100%;height:100%;margin:0;background:#101018;color:#f8f0dc;font-family:Verdana,Geneva,sans-serif;overflow:hidden}#game{width:100vw;height:100dvh}#mobile-controls{display:none}#mobile-controls button{min-width:52px;min-height:52px;padding:8px;border:2px solid #f9d65c;border-radius:8px;background:#202733;color:#fff3cf;font:700 16px/1 Verdana,Geneva,sans-serif;touch-action:none;user-select:none;-webkit-tap-highlight-color:transparent}#mobile-controls button:active,#mobile-controls button.is-pressed{background:#f9d65c;color:#1f2933}#mobile-controls button:focus-visible{outline:3px solid #d9f2ff;outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(orientation:portrait)and (max-width:700px)and (pointer:coarse){body{display:flex;flex-direction:column}#game{flex:0 0 auto;width:112vw;height:auto;margin-left:-6vw;aspect-ratio:16 / 9}#mobile-controls{display:grid;flex:1 1 auto;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:12px;align-items:center;min-height:220px;padding:14px max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));box-sizing:border-box;background:#101018}.mobile-dpad{display:grid;grid-template:repeat(3,52px) / repeat(3,52px);place-content:center;gap:6px}.mobile-dpad button{width:52px;height:52px}.move-up{grid-area:1 / 2}.move-left{grid-area:2 / 1}.move-down{grid-area:3 / 2}.move-right{grid-area:2 / 3}.mobile-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.mobile-actions button{width:100%;min-width:0;min-height:48px;padding-inline:4px;font-size:13px}.mobile-actions .act-button{min-height:64px;font-size:18px}}@media(orientation:landscape)and (max-height:600px){#game{height:100dvh}}canvas{image-rendering:pixelated}canvas:focus-visible{outline:4px solid #f9d65c;outline-offset:-4px}