Press-and-hold peeks a segment — the tooltip, for hands without a mouse

The same 450ms hold that peeks a square now works on walls, doors, and
fire walls: the segment's full description (state, lock, hitpoints, the
fire's burn warning) rises in the peek scrim. Shimmering illusions keep
their richer tap modal.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0138A8CjeQRpvzKxuMfz1Bqc

packages/web/src/EdgeGlyph.svelte

@@ -2,13 +2,15 @@
   // A wall or door on an edge, exactly as the board draws it. Wall-segment
   // effects (locks picked, jammed, removed; doors held) are color states of
   // this one glyph — the game has never used tokens for them.
-  let { x, y, kind, state, lock = null, title = null, damage = 0 }: {
+  let { x, y, kind, state, lock = null, title = null, damage = 0, onpeek }: {
     x: number; y: number; kind: "V" | "H";
     state: "wall" | "door";
     lock?: "removed" | "jammed" | "held" | "ajar" | null;
     title?: string | null;
     /** Battle damage taken so far (walls fall at 20, doors at 15). */
     damage?: number;
+    /** Press-and-hold (touch has no hover): report the tooltip's text. */
+    onpeek?: (tip: string) => void;
   } = $props();
   const CELL = 48;
   const WALL = 7;
@@ -19,6 +21,17 @@
     ? `${Math.max(0, needed - damage)} of ${needed} hitpoints left`
     : `${needed} hitpoints`);
   const tip = $derived(`${title ?? (state === "door" ? "a locked door" : "a wall")} — ${hp}`);
+
+  // Press-and-hold peeks the segment, mirroring the board's cell gesture.
+  let timer: ReturnType<typeof setTimeout> | null = null;
+  function press() {
+    if (!onpeek) return;
+    timer = setTimeout(() => onpeek?.(tip), 450);
+  }
+  function release() {
+    if (timer) clearTimeout(timer);
+    timer = null;
+  }
 </script>
 
 {#if kind === "V"}
@@ -26,12 +39,14 @@
     x={(x + 1) * CELL - WALL / 2} y={y * CELL - WALL / 2}
     width={WALL} height={CELL + WALL}
     class={cls}
+    role="img" onpointerdown={press} onpointerup={release} onpointerleave={release}
   ><title>{tip}</title></rect>
 {:else}
   <rect
     x={x * CELL - WALL / 2} y={(y + 1) * CELL - WALL / 2}
     width={CELL + WALL} height={WALL}
     class={cls}
+    role="img" onpointerdown={press} onpointerup={release} onpointerleave={release}
   ><title>{tip}</title></rect>
 {/if}