#touch{--touch-color: #94f567;--touch-btn: 44px;--touch-fire: 76px;--touch-stick-r: 60px;--touch-zone-x: .42;--touch-zone-y: .62;--touch-throttle-w: 44px;--touch-throttle-top: .28;--touch-throttle-h: .43;--touch-gap: 8px;--touch-band: 88px;--touch-rwr: 94px;--touch-alpha: .5;--touch-alpha-down: .9;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);position:fixed;inset:0;z-index:5;pointer-events:none;overflow:hidden;font-family:"Press Start 2P",Courier New,Courier,monospace;font-size:10px;line-height:1.3;color:var(--touch-color);-webkit-font-smoothing:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none}#touch[hidden]{display:none}.touch-safe-probe{position:absolute;visibility:hidden;width:0;height:0;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left)}.touch-btn{pointer-events:auto;touch-action:none;box-sizing:border-box;display:flex;align-items:center;justify-content:center;min-width:var(--touch-btn);height:var(--touch-btn);padding:0 6px;margin:0;border:2px solid currentColor;border-radius:6px;background:#00000059;color:inherit;font:inherit;text-align:center;white-space:pre-line;opacity:var(--touch-alpha);-webkit-tap-highlight-color:transparent}.touch-btn[hidden]{display:none}.touch-btn[data-down=true],.touch-btn[data-selected=true]{opacity:var(--touch-alpha-down);background:#0009;box-shadow:inset 0 0 0 2px currentColor}.touch-wide{min-width:calc(var(--touch-btn) * 2)}.touch-stick-zone[hidden],.touch-throttle[hidden],.touch-card[hidden],.touch-group[hidden],.touch-weapon-stack[hidden]{display:none}.touch-group{display:flex;gap:var(--touch-gap)}.touch-top-right{position:absolute;top:calc(var(--safe-top) + var(--touch-gap));right:calc(var(--safe-right) + var(--touch-gap) + var(--touch-rwr) + var(--touch-gap))}.touch-bottom-left{position:absolute;left:calc(var(--safe-left) + var(--touch-gap) + var(--touch-stick-r) * 2 + var(--touch-gap));bottom:calc(var(--safe-bottom) + var(--touch-gap));align-items:flex-end}.touch-bottom-right{position:absolute;right:calc(var(--safe-right) + var(--touch-gap) + var(--touch-fire) + var(--touch-gap));bottom:calc(var(--safe-bottom) + var(--touch-gap) + (var(--touch-fire) - var(--touch-btn)) / 2)}.touch-weapon{display:flex;flex-direction:column;align-items:stretch;gap:var(--touch-gap)}.touch-weapon-stack{display:flex;flex-direction:column-reverse;gap:var(--touch-gap)}.touch-stick-zone{position:absolute;left:var(--safe-left);bottom:var(--safe-bottom);width:calc(var(--touch-zone-x) * 100%);height:calc(var(--touch-zone-y) * 100%);pointer-events:auto;touch-action:none}.touch-stick-hint{position:absolute;left:calc(var(--touch-gap) * 2);bottom:calc(var(--touch-gap) * 2);opacity:.35}.touch-stick-zone[data-down=true] .touch-stick-hint{display:none}.touch-stick-base{position:absolute;width:calc(var(--touch-stick-r) * 2);height:calc(var(--touch-stick-r) * 2);border:2px solid currentColor;border-radius:50%;opacity:.45;transform:translate(-50%,-50%);pointer-events:none}.touch-stick-base[hidden]{display:none}.touch-stick-knob{position:absolute;left:50%;top:50%;width:calc(var(--touch-stick-r) * .8);height:calc(var(--touch-stick-r) * .8);border-radius:50%;background:currentColor;opacity:.8;transform:translate(-50%,-50%)}.touch-throttle{position:absolute;right:calc(var(--safe-right) + var(--touch-gap));top:calc(var(--touch-throttle-top) * 100%);width:var(--touch-throttle-w);height:calc(var(--touch-throttle-h) * 100%);box-sizing:border-box;border:2px solid currentColor;border-radius:6px;background:#00000059;opacity:var(--touch-alpha);pointer-events:auto;touch-action:none;overflow:hidden}.touch-throttle[data-down=true]{opacity:var(--touch-alpha-down)}.touch-throttle-fill{position:absolute;left:0;right:0;bottom:0;height:0%;background:currentColor;opacity:.55}.touch-throttle-label{position:absolute;left:0;right:0;top:6px;text-align:center}.touch-fire{position:absolute;right:calc(var(--safe-right) + var(--touch-gap));bottom:calc(var(--safe-bottom) + var(--touch-gap));width:var(--touch-fire);height:var(--touch-fire);min-width:0;border-radius:50%;border-width:3px}.touch-rudder{margin-right:var(--touch-gap)}@media(max-width:700px){#touch{font-size:9px}.touch-full{display:none}}.touch-confirm{position:absolute;left:50%;bottom:calc(var(--safe-bottom) + var(--touch-gap) * 2);transform:translate(-50%);min-width:calc(var(--touch-btn) * 3);padding:0 16px;opacity:var(--touch-alpha-down)}.touch-card{position:absolute;left:var(--safe-left);right:var(--safe-right);bottom:calc(var(--safe-bottom) + var(--touch-gap) * 2);display:flex;justify-content:center;gap:calc(var(--touch-gap) * 2)}.touch-card .touch-btn{opacity:var(--touch-alpha-down)}.touch-overlay{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;padding:calc(env(safe-area-inset-top,0px) + 16px) calc(env(safe-area-inset-right,0px) + 24px) calc(env(safe-area-inset-bottom,0px) + 16px) calc(env(safe-area-inset-left,0px) + 24px);background:#000000e0;color:var(--touch-color, #94f567);font-family:"Press Start 2P",Courier New,Courier,monospace;font-size:10px;line-height:1.6;text-align:center;user-select:none;-webkit-user-select:none;touch-action:manipulation;overflow:hidden}.touch-overlay[hidden]{display:none}.touch-overlay h1{margin:0 0 4px;font-size:14px;font-weight:400;line-height:1.4}.touch-overlay p{margin:0;max-width:34em}.touch-overlay-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px}.touch-overlay-btn{box-sizing:border-box;min-height:48px;padding:12px 18px;border:2px solid currentColor;border-radius:6px;background:#0006;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.touch-overlay-btn:active{background:#000000b3;box-shadow:inset 0 0 0 2px currentColor}.touch-overlay-note{min-height:1.6em;opacity:.8}.touch-rotate-glyph{width:28px;height:52px;border:3px solid currentColor;border-radius:6px;animation:touch-rotate 1.6s ease-in-out infinite alternate}@keyframes touch-rotate{0%{transform:rotate(0)}to{transform:rotate(-90deg)}}.cannot-run{font-size:11px}
