Fix mobile dynamic viewport hail particle positions

src/components/hail/slot.tsx

@@ -25,6 +25,11 @@ export function HailSlot({
   const [coin, setCoin] = useState<PieceWithIssuer>(() => pickCoin(pool));
   const mountedRef = useRef(false);
 
+  // Read spawnWidth via a ref so mobile-chrome-driven viewport resizes don't reposition
+  // in-flight coins — new respawns still pick up the latest width.
+  const spawnWidthRef = useRef(spawnWidth);
+  spawnWidthRef.current = spawnWidth;
+
   const motion = useRef({
     fallSpeed: rand(FALL_SPEED_MIN, FALL_SPEED_MAX),
     tx: rand(-TUMBLE_SPEED, TUMBLE_SPEED),
@@ -40,10 +45,11 @@ export function HailSlot({
     // First mount uses the staggered initialY (already above the camera frustum); every respawn
     // after that uses SPAWN_Y + a small jitter so coins never appear in view.
     const y = mountedRef.current ? SPAWN_Y + rand(0, 0.03) : initialY;
-    ref.current.position.set(rand(-spawnWidth / 2, spawnWidth / 2), y, rand(-0.04, 0));
+    const w = spawnWidthRef.current;
+    ref.current.position.set(rand(-w / 2, w / 2), y, rand(-0.04, 0));
     ref.current.rotation.set(rand(0, Math.PI * 2), rand(0, Math.PI * 2), rand(0, Math.PI * 2));
     mountedRef.current = true;
-  }, [coin.id, initialY, spawnWidth]);
+  }, [coin.id, initialY]);
 
   useFrame((_, delta) => {
     const g = ref.current;