.snake-dpad{display:grid;grid-template-columns:repeat(3,64px);grid-template-rows:repeat(3,56px);grid-template-areas:". up ." "left . right" ". down .";gap:6px;justify-content:center;margin:12px auto 0;touch-action:none}.snake-dpad[hidden]{display:none}.snake-dpad-btn{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:14px;font-size:1.3rem;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}.snake-dpad-btn:active{background:var(--accent-soft);border-color:var(--accent)}.snake-dpad-btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.snake-dpad-up{grid-area:up}.snake-dpad-down{grid-area:down}.snake-dpad-left{grid-area:left}.snake-dpad-right{grid-area:right}