fix: align span panel to worker lane coordinate system (#341)

The span panel canvas was using panel.clientWidth directly, which
includes the 100px padding-left and does not account for the vertical
scrollbar on lanesContainer. The lane canvases use a narrower drawing
area (content width minus scrollbar). Because both use the same
viewStart/viewEnd range, a wider span canvas produced a scale mismatch
that grew linearly with x-position: spans lined up on the left but
drifted increasingly further right of their corresponding polls.

Narrow the span canvas to match the lane canvases by subtracting
LABEL_W and scrollbarW from panel.clientWidth.

Mouse handlers use the canvas's getBoundingClientRect().width so they
remain self-consistent with the resized canvas.

Author: rcoh

dial9-viewer/ui/viewer.html

@@ -2063,7 +2063,11 @@ <h3>⌨ Keyboard</h3>
                 if (panel.style.display === "none") return;
                 const c = document.getElementById("span-panel-canvas");
                 const dpr = devicePixelRatio || 1;
-                const pw = panel.clientWidth;
+                // panel.clientWidth includes the 100px padding-left where the
+                // label sits.  The canvas lives inside that padded area, so its
+                // drawing width must exclude LABEL_W (and the scrollbar
+                // reservation) to match the lane canvases' coordinate system.
+                const pw = panel.clientWidth - LABEL_W - (scrollbarW || 0);
                 const ph = 120;
                 c.width = pw * dpr;
                 c.height = ph * dpr;