diff --git a/src/components/ChessboardRepaintPuzzle.tsx b/src/components/ChessboardRepaintPuzzle.tsx
index 58b589c..eb91b2f 100644
--- a/src/components/ChessboardRepaintPuzzle.tsx
+++ b/src/components/ChessboardRepaintPuzzle.tsx
@@ -190,15 +190,33 @@ const ChessboardRepaintPuzzle: React.FC<ChessboardRepaintPuzzleProps> = ({ showS
     return squares;
   };
 
+  const getBoundingBox = (squares: {row: number, col: number}[]) => {
+    if (squares.length === 0) return null;
+    
+    const minRow = Math.min(...squares.map(s => s.row));
+    const maxRow = Math.max(...squares.map(s => s.row));
+    const minCol = Math.min(...squares.map(s => s.col));
+    const maxCol = Math.max(...squares.map(s => s.col));
+    
+    return { minRow, maxRow, minCol, maxCol };
+  };
+
   const renderSquare = (row: number, col: number) => {
     const isBlack = board[row][col];
     const isBottomRow = row === 7;
     const isRightmostCol = col === 7;
     const isBottomRight = row === 7 && col === 7;
     
-    // Check if this square would be affected by hovering over the hovered square
-    const isAffected = hoveredSquare && getAffectedSquares(hoveredSquare.row, hoveredSquare.col)
-      .some(square => square.row === row && square.col === col);
+    // Get bounding box for hover preview
+    const boundingBox = hoveredSquare ? getBoundingBox(getAffectedSquares(hoveredSquare.row, hoveredSquare.col)) : null;
+    
+    // Check if this square is on the border of the bounding box
+    const isOnBorder = boundingBox && (
+      (row === boundingBox.minRow && col >= boundingBox.minCol && col <= boundingBox.maxCol) ||
+      (row === boundingBox.maxRow && col >= boundingBox.minCol && col <= boundingBox.maxCol) ||
+      (col === boundingBox.minCol && row >= boundingBox.minRow && row <= boundingBox.maxRow) ||
+      (col === boundingBox.maxCol && row >= boundingBox.minRow && row <= boundingBox.maxRow)
+    );
     
     return (
       <div
@@ -220,7 +238,7 @@ const ChessboardRepaintPuzzle: React.FC<ChessboardRepaintPuzzleProps> = ({ showS
           w-12 h-12 border border-gray-300 flex items-center justify-center cursor-pointer
           transition-all duration-200 hover:scale-105
           ${isBlack ? 'bg-gray-800' : 'bg-gray-100'}
-          ${isAffected ? 'border-2 border-red-500' : ''}
+          ${isOnBorder ? 'border-2 border-red-500' : ''}
         `}
         title={isBottomRight ? `Hover for 3s to switch mode (current: ${bottomRightMode})` : undefined}
       />