diff --git a/src/app.css b/src/app.css
index c407639..9fd5374 100644
--- a/src/app.css
+++ b/src/app.css
@@ -66,6 +66,12 @@ body {
     padding: 24px;
 }
 
+/* Touch devices: drop bottom padding (mobile dock owns its own
+   safe-area inset) and slim lateral padding so the board has more room. */
+@media (pointer: coarse) {
+    #app { padding: 12px 12px 0; }
+}
+
 button {
     font-family: inherit;
     touch-action: manipulation;
diff --git a/src/views/GameView.svelte b/src/views/GameView.svelte
index 053c1e9..7ca764e 100644
--- a/src/views/GameView.svelte
+++ b/src/views/GameView.svelte
@@ -245,10 +245,22 @@
         max-width: calc(100vw - 48px);
     }
 
-    /* On touch devices, hide the duplicated header action buttons —
-       MobileControls now occupies its own row at the bottom of the flex column. */
+    /* On touch devices: hide duplicated header action buttons (MobileControls
+       owns its own row at the bottom), tighten the column rhythm, and anchor
+       the puzzle to the bottom of .board-wrap so dead space accumulates above
+       the board (hidden behind HUD) instead of below it (between board and
+       dock). Closes the perceived "D-pad too far" gap on short puzzles. */
     @media (pointer: coarse) {
         .desktop-actions { display: none; }
+
+        .game { gap: 10px; }
+
+        .board-wrap {
+            display: flex;
+            align-items: flex-end;
+            justify-content: center;
+            max-width: calc(100vw - 24px);
+        }
     }
 
     .error {