/* Only game controls suppress native gestures; the surrounding page stays scrollable. */
[data-touch-pad], [data-touch-pad] *, .game-touch-control, .game-touch-control *, [data-dos-key], [data-dos-key] * {
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
  -webkit-user-drag: none;
  touch-action: none;
}
[data-touch-pad] { position: relative; isolation: isolate; }
[data-touch-pad] > :not(.touch-pad-keys) { display: none; }
.touch-pad-keys { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); width: 100%; height: 100%; padding: 5%; }
.touch-pad-keys > button, .touch-pad-keys > span { display: grid; place-items: center; min-width: 0; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 8px; color: inherit; background: transparent; font: inherit; font-size: clamp(15px, 4vw, 25px); line-height: 1; }
.touch-pad-keys > button { cursor: pointer; }
.touch-pad-keys > button:focus-visible { outline: 3px solid currentColor; outline-offset: -3px; background: #ffffff40; }
/* Etched chevrons keep the pad legible without platform-dependent font symbols. */
.touch-pad-keys > [data-touch-direction]::after { content: ''; width: 6px; height: 6px; border: solid currentColor; border-width: 2px 2px 0 0; transform: rotate(-45deg); opacity: .6; pointer-events: none; }
.touch-pad-keys > [data-touch-direction='right']::after { transform: rotate(45deg); }
.touch-pad-keys > [data-touch-direction='down']::after { transform: rotate(135deg); }
.touch-pad-keys > [data-touch-direction='left']::after { transform: rotate(225deg); }
.touch-pad-keys > [data-touch-direction*=' ']::after { display: none; }
.touch-pad-keys > span::after { content: ''; width: 10px; height: 10px; border: 1px solid currentColor; border-radius: 50%; opacity: .3; }