AGENTS.md

@@ -0,0 +1,5 @@
+# Agent notes
+
+## Git
+- **The user makes their own commits.** Leave changes in the working tree; do not
+  run `git commit` (or `git push`) unless explicitly asked.

src/games/jigsaw/JigsawGame.js

@@ -805,8 +805,13 @@ export default class JigsawGame extends Phaser.Scene {
     // Tray = the whole (bigger) field minus a small margin, EXCLUDING the board
     // (pieces must not scatter on top of the target image or they'd be
     // indistinguishable from placed pieces). The HUD lives in viewport space,
-    // so it doesn't reserve any of the world.
-    const tray = { x: 40, y: HUD_H + 40, w: WORLD_W - 80, h: WORLD_H - HUD_H - 80 };
+    // but at full zoom-out the camera is clamped to scrollY = HUD_H, so the
+    // fixed bar still covers world y ∈ [HUD_H, HUD_H + HUD_H/MIN_ZOOM]. Push
+    // the tray top down so the WHOLE piece — base cell + tabs + shadow
+    // headroom, not just its centre — stays below that band.
+    const pieceHalf = this.cell + Math.max(7, this.cell * 0.09); // matches buildPieceCanvas PAD
+    const trayTop = HUD_H + HUD_H / MIN_ZOOM + pieceHalf;
+    const tray = { x: 40, y: trayTop, w: WORLD_W - 80, h: WORLD_H - trayTop - 40 };
     const boardBox = { x0: BOARD.x - 6, y0: BOARD.y - 6, x1: BOARD.x + BOARD.size + 6, y1: BOARD.y + BOARD.size + 6 };
     const grabR = this.cell * GRAB_FRAC;
     // We guarantee a comfortable minimum centre-gap so no two pieces steal each
@@ -1211,13 +1216,14 @@ export default class JigsawGame extends Phaser.Scene {
     if (!this.textures.exists('jigsaw-shine')) this.textures.addCanvas('jigsaw-shine', makeShineTexture());
 
     // Win camera: board centred in the region right of the info panel. The
-    // board sits mid-world, so the camera must travel to its row — this lands
-    // the board vertically centred on screen, its top just under the HUD bar.
+    // board sits mid-world, so the camera must travel to its row. Vertically
+    // it is centred in the area BELOW the fixed HUD bar (not the whole screen),
+    // so the framed picture has comfortable breathing room under the bar.
     const bcx = BOARD.x + BOARD.size / 2;
     const bcy = BOARD.y + BOARD.size / 2;
     const boardCx = (WIN_PANEL.x + WIN_PANEL.w + GAME_WIDTH) / 2;
     const winScrollX = bcx - boardCx / WIN_ZOOM;
-    const winScrollY = bcy - (GAME_HEIGHT / 2) / WIN_ZOOM;
+    const winScrollY = bcy - ((HUD_H + GAME_HEIGHT) / 2) / WIN_ZOOM;
 
     this.winLayer = this.add.container(0, 0).setDepth(9600);
     if (this.mainCam) this.winLayer.cameraFilter = this.mainCam.id; // fixed hudCam only