:root{color-scheme:dark;background:#000;color:#b2b2b2;font-family:monospace}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}#app{width:100%;height:100%;height:100dvh;display:flex;align-items:center;justify-content:center;background:#000}canvas{display:block;image-rendering:pixelated;outline:none;touch-action:none}.native-input{position:fixed;opacity:0;border:0;padding:0;margin:0;color:transparent;caret-color:transparent;font-size:16px;z-index:4}.game-layout{display:flex;align-items:center;justify-content:center;gap:0;position:relative}.screen-slot{flex:1;min-width:0;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.touch-rail{flex:0 0 clamp(116px,15vw,180px);height:min(86%,380px);padding:0 8px;display:flex;flex-direction:column;justify-content:space-between;gap:16px;touch-action:none}.touch-group{display:flex;flex-direction:column;gap:8px;align-items:stretch}.touch-caption{width:100%;height:14px}.touch-key-row{display:flex;gap:8px}.touch-key{appearance:none;flex:1;min-width:44px;min-height:52px;height:clamp(52px,12vh,76px);padding:0;border:0;background:#000;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer}.touch-key canvas{width:100%;height:100%;pointer-events:none}.touch-key:focus-visible{outline:2px solid #edf171;outline-offset:3px}.touch-key:disabled{cursor:default}[hidden]{display:none!important}.orientation-overlay{position:fixed;inset:0;z-index:20;background:#000;display:flex;align-items:center;justify-content:center}.fullscreen-button{position:fixed;right:max(8px,env(safe-area-inset-right));top:max(8px,env(safe-area-inset-top));z-index:5;border:1px solid #553800;background:#000;color:#b2b2b2;padding:8px;font:12px monospace;min-height:36px;cursor:pointer}@media(max-height:340px){.touch-rail{height:94%;gap:8px}.touch-group{gap:4px}.touch-key{min-height:44px;height:44px}.touch-caption{height:10px}}@media(pointer:coarse){#app{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}}body.can-fullscreen #app.with-touch{padding-top:max(36px,env(safe-area-inset-top))}
