fix(ui): stop the game-screen freeze when an opponent joins (reactive self-loop)

The in-game live-event $effect read `view`/`moves`/`placement` (via cacheSnapshot
and direct reads) AND wrote `view` in its branches, so those reads became the
effect's own dependencies: writing `view = …` re-ran the effect, and with
app.lastEvent unchanged it re-entered the same branch and wrote `view` again — a
tight self-invalidating loop that pinned the main thread, freezing the board and
rack. opponent_moved escaped it only because applyMoveDelta is idempotent on the
move count (no cache → no write on the second pass); opponent_joined and game_over
have no such guard, so an opponent joining hung the whole screen. Tracking
`placement` similarly re-fired the handler on every tile the player placed after
an opponent's move (a spurious reload).

Fix: the effect must depend only on app.lastEvent and process each event once.
Wrap the branch body in `untrack`, scoping its view/moves/placement reads out of
the effect's dependency set; the writes inside no longer re-trigger it.

e2e: after the opponent joins, placing a rack tile must render a pending tile —
verified RED (frozen, 0 pending tiles, both engines) before the fix, GREEN after.

ui/src/game/Game.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { onDestroy, onMount } from 'svelte';
+  import { onDestroy, onMount, untrack } from 'svelte';
   import Screen from '../components/Screen.svelte';
   import TabBar from '../components/TabBar.svelte';
   import TapConfirm from '../components/TapConfirm.svelte';
@@ -222,29 +222,38 @@
   $effect(() => {
     const e = app.lastEvent;
     if (!e) return;
-    if (e.kind === 'opponent_moved' && e.gameId === id) {
-      // While composing, reload so a draft overlapping the new move is reconciled; otherwise apply
-      // the move as a delta with no fetch.
-      if (placement.pending.length > 0) void load();
-      else applyDelta(applyMoveDelta(cacheSnapshot(), { move: e.move, game: e.game, bagLen: e.bagLen }));
-    } else if (e.kind === 'your_turn' && e.gameId === id) {
-      // The opponent_moved delta carries the new state; your_turn only confirms the turn. Refetch
-      // only if we missed the move (our cached count trails the event's).
-      if (view && e.moveCount > view.game.moveCount) void load();
-    } else if (e.kind === 'game_over' && e.gameId === id) {
-      applyDelta(applyGameOver(cacheSnapshot(), e.game));
-    } else if (e.kind === 'opponent_joined' && e.gameId === id && e.state) {
-      // The opponent took the empty seat: adopt the new participants and status in place,
-      // leaving the board, rack and any pending placement untouched (no refetch, no flicker).
-      const r = applyOpponentJoined(cacheSnapshot(), e.state);
-      if (r) {
-        view = r.view;
-        setCachedGame(id, r.view, r.moves);
+    // Depend only on app.lastEvent: process each event once. The branches below READ and WRITE
+    // view/moves/placement, so tracking those reads would re-run this effect from its own
+    // `view = …` write — with app.lastEvent unchanged it re-enters the same branch, a tight loop.
+    // opponent_moved self-limits via the delta's move-count idempotency, but opponent_joined (and
+    // game_over) do not, so an opponent joining froze the whole game screen. (Tracking placement
+    // likewise re-fired the handler on every tile a player placed.) untrack scopes the body's reads
+    // out of the effect's dependencies.
+    untrack(() => {
+      if (e.kind === 'opponent_moved' && e.gameId === id) {
+        // While composing, reload so a draft overlapping the new move is reconciled; otherwise apply
+        // the move as a delta with no fetch.
+        if (placement.pending.length > 0) void load();
+        else applyDelta(applyMoveDelta(cacheSnapshot(), { move: e.move, game: e.game, bagLen: e.bagLen }));
+      } else if (e.kind === 'your_turn' && e.gameId === id) {
+        // The opponent_moved delta carries the new state; your_turn only confirms the turn. Refetch
+        // only if we missed the move (our cached count trails the event's).
+        if (view && e.moveCount > view.game.moveCount) void load();
+      } else if (e.kind === 'game_over' && e.gameId === id) {
+        applyDelta(applyGameOver(cacheSnapshot(), e.game));
+      } else if (e.kind === 'opponent_joined' && e.gameId === id && e.state) {
+        // The opponent took the empty seat: adopt the new participants and status in place,
+        // leaving the board, rack and any pending placement untouched (no refetch, no flicker).
+        const r = applyOpponentJoined(cacheSnapshot(), e.state);
+        if (r) {
+          view = r.view;
+          setCachedGame(id, r.view, r.moves);
+        }
+      } else if (e.kind === 'notify' && (e.sub === 'friend_added' || e.sub === 'friend_declined')) {
+        // A request the player sent was answered: re-derive the in-game "add friend" state.
+        void loadFriends();
       }
-    } else if (e.kind === 'notify' && (e.sub === 'friend_added' || e.sub === 'friend_declined')) {
-      // A request the player sent was answered: re-derive the in-game "add friend" state.
-      void loadFriends();
-    }
+    });
   });
 
   // The live-event hub is best-effort and never replays (see lib/app.svelte.ts): an event dropped