:root{--bg: #141418;--panel: #2c2c34;--panel-edge: #3c3c46;--pad: #121216;--pad-hi: #26262e;--pad-pressed: #050507;--ab: #a8285e;--ab-hi: #c4447a;--ab-pressed: #6e1238;--pill: #4c4c58;--pill-pressed: #34343e;--label: #b8b8c4}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:var(--bg);overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}body{position:fixed;inset:0;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,sans-serif}#app{position:fixed;inset:0}#screen{position:absolute;image-rendering:pixelated;image-rendering:crisp-edges;background:#000;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}#safe-probe{position:fixed;visibility:hidden;pointer-events:none;padding-top:env(safe-area-inset-top,0px);padding-right:env(safe-area-inset-right,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px)}#panel{position:absolute;background:var(--panel);box-shadow:inset 0 1px 0 var(--panel-edge);border-radius:14px 14px 0 0;display:none}.touch.portrait #panel{display:block}#pad{position:absolute;inset:0;pointer-events:none;display:none;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.touch #pad{display:block}.ctl,.ctl *{touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.ctl{position:absolute;pointer-events:auto;box-sizing:border-box}.dpad .arm,.dpad .hub{position:absolute;background:var(--pad)}.dpad .arm.up{left:35%;top:7%;width:30%;height:30%;border-radius:5px 5px 0 0;box-shadow:inset 0 2px 0 var(--pad-hi)}.dpad .arm.down{left:35%;bottom:7%;width:30%;height:30%;border-radius:0 0 5px 5px}.dpad .arm.left{top:35%;left:7%;width:30%;height:30%;border-radius:5px 0 0 5px;box-shadow:inset 0 2px 0 var(--pad-hi)}.dpad .arm.right{top:35%;right:7%;width:30%;height:30%;border-radius:0 5px 5px 0;box-shadow:inset 0 2px 0 var(--pad-hi)}.dpad .hub{left:34.5%;top:34.5%;width:31%;height:31%}.dpad .hub:after{content:"";position:absolute;left:30%;top:30%;width:40%;height:40%;border-radius:50%;background:var(--pad-hi)}.dpad[data-dir=up] .arm.up,.dpad[data-dir=down] .arm.down,.dpad[data-dir=left] .arm.left,.dpad[data-dir=right] .arm.right{background:var(--pad-pressed);box-shadow:none}.btn{border-radius:50%;background:var(--ab);box-shadow:inset 0 2px 0 var(--ab-hi),0 3px #00000073;color:#ffffffd1;font-size:18px;font-weight:800;display:flex;align-items:center;justify-content:center}.btn:before{content:"";position:absolute;inset:-9px;border-radius:50%}.btn.pressed{background:var(--ab-pressed);box-shadow:none;transform:translateY(2px)}.pill{border-radius:999px;background:var(--pill);box-shadow:0 2px #0006;color:var(--label);font-size:8px;font-weight:700;letter-spacing:.1em;display:flex;align-items:center;justify-content:center}.pill:before{content:"";position:absolute;inset:-8px -4px;border-radius:999px}.pill.pressed{background:var(--pill-pressed);box-shadow:none;transform:translateY(1px)}#a2hs{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));background:#f8f8f8;color:#202030;border:3px solid #202030;border-radius:10px;padding:12px 40px 12px 14px;font-size:15px;line-height:1.35;z-index:10;touch-action:manipulation}#a2hs b{color:#306230}#a2hs .close{position:absolute;right:6px;top:6px;width:30px;height:30px;font-size:22px;line-height:30px;text-align:center}.landscape{--pad: #4a4a56;--pad-hi: #62626e;--pad-pressed: #2a2a32;--pill: #4c4c58}