From ca55f7d00b1f1595397ae98e525d792e15fbb54a Mon Sep 17 00:00:00 2001
From: Eric Wagoner <ewagoner@gmail.com>
Date: Mon, 17 Aug 2026 10:40:11 -0400
Subject: [PATCH] The fireworks get the stage before the victory modal takes it
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Winning raised the modal on the same frame the fireworks lit,
covering them. The modal now waits behind the curtain for 2.4
seconds — three volleys over the winner's home, seen — then takes
the stage.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 packages/web/src/App.svelte | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/packages/web/src/App.svelte b/packages/web/src/App.svelte
index bf09be3..9c8d3b9 100644
--- a/packages/web/src/App.svelte
+++ b/packages/web/src/App.svelte
@@ -21,6 +21,14 @@
   let showHelp = $state(false);
   /** The finished game whose victory fanfare has been dismissed. */
   let victorySeen = $state(false);
+  /** The fireworks get the stage before the modal takes it. */
+  let victoryCurtain = $state(false);
+  $effect(() => {
+    if (view?.phase === "finished" && view.winner && !victoryCurtain) {
+      const t = setTimeout(() => (victoryCurtain = true), 2400);
+      return () => clearTimeout(t);
+    }
+  });
   /** Quiet mode: skip the attack announcement modal (device preference). */
   let noFanfare = $state(localStorage.getItem("wizwar-no-fanfare") === "1");
   function setFanfare(announce: boolean) {
@@ -949,7 +957,7 @@
     <Help initialTab={helpTab} stats={net.stats} onstats={() => net.requestStats()} onclose={() => (showHelp = false)} />
   {/if}
 
-  {#if view?.phase === "finished" && view.winner && !victorySeen}
+  {#if view?.phase === "finished" && view.winner && victoryCurtain && !victorySeen}
     <div class="scrim attack-scrim" role="alertdialog" aria-label="the game is won">
       <div class="attack-notice victory-notice">
         <div class="victory-trophy">🏆</div>