From 82a69d8812138db4dbf0def71ceb26fe8149f51f Mon Sep 17 00:00:00 2001
From: "claude (blind_chess)" <claude@sethpc.xyz>
Date: Mon, 18 May 2026 20:50:13 -0400
Subject: [PATCH] fix(client): key phantom-load effect on gameId, gate the drag
 ghost

Re-key the phantom-load effect on `loadedFor` (tracks gameId) so it
reloads if the same <Game> instance is reused for a different game
without a remount. Also gate the drag-ghost block behind
`phantomLayerEnabled` for consistency with all other phantom UI.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 packages/client/src/lib/Game.svelte | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/packages/client/src/lib/Game.svelte b/packages/client/src/lib/Game.svelte
index 6697d1b..fd67ca1 100644
--- a/packages/client/src/lib/Game.svelte
+++ b/packages/client/src/lib/Game.svelte
@@ -110,14 +110,17 @@
     return a && phantomDrag.state.moved ? a.type : null;
   });
 
-  // Load the phantom layer once `you` is known (blind games only).
-  let phantomsLoaded = $state(false);
+  // Load the phantom layer when `you` is known (blind games only). Keyed on
+  // gameId — like the connection effect — so it reloads if this <Game>
+  // instance is reused for a different game without a remount.
+  let loadedFor: string | null = $state(null);
   $effect(() => {
-    if (phantomsLoaded) return;
+    const id = gameId;
     const you = game.state.you;
+    if (loadedFor === id) return;
     if (you && game.state.mode === 'blind') {
-      untrack(() => phantoms.loadForGame(gameId, you));
-      phantomsLoaded = true;
+      untrack(() => phantoms.loadForGame(id, you));
+      loadedFor = id;
     }
   });
 
@@ -210,7 +213,7 @@
   {/if}
 </div>
 
-{#if dragGhost}
+{#if phantomLayerEnabled && dragGhost}
   <div
     class="drag-ghost piece-{oppColor}"
     style="left: {phantomDrag.state.x}px; top: {phantomDrag.state.y}px;"