diff --git a/src/blokus_ui/static/game.js b/src/blokus_ui/static/game.js
index f19595b..40eb28e 100644
--- a/src/blokus_ui/static/game.js
+++ b/src/blokus_ui/static/game.js
@@ -10,6 +10,7 @@ function initGame() {
     const sessionId = window.GAME_SESSION_ID;
     const boardSize = window.BOARD_SIZE;
     const cellSize = window.CELL_SIZE || 30;
+    const cellGap = 1;
 
     let selectedPieceId = null;
     let currentPlacements = [];
@@ -155,8 +156,10 @@ function initGame() {
                 const x = cell[0], y = cell[1];
                 const el = document.createElement('div');
                 el.className = 'placement-cell';
-                el.style.left = (x * cellSize) + 'px';
-                el.style.top = (y * cellSize) + 'px';
+                el.style.left = (x * (cellSize + cellGap)) + 'px';
+                el.style.top = (y * (cellSize + cellGap)) + 'px';
+                el.style.width = cellSize + 'px';
+                el.style.height = cellSize + 'px';
                 el.dataset.action = placement.action;
                 el.addEventListener('click', function() { makeMove(placement.action); });
                 overlay.appendChild(el);
diff --git a/src/blokus_ui/static/style.css b/src/blokus_ui/static/style.css
index fd0ee1d..e110115 100644
--- a/src/blokus_ui/static/style.css
+++ b/src/blokus_ui/static/style.css
@@ -205,6 +205,8 @@ h3 {
 
 .placement-cell {
     position: absolute;
+    width: 30px;
+    height: 30px;
     background: rgba(255, 204, 0, 0.25);
     border: 1px dashed rgba(255, 204, 0, 0.7);
     pointer-events: auto;