fix(preview): keep diagram centred in split view

After pinning the SVG to its intrinsic size, the stage's layout box is often
wider than a narrow (split) canvas. CSS grid centring doesn't centre an
oversized item — it anchored the stage's left edge to the canvas, pushing the
transform-origin (and the scaled-down diagram) far to the right.

Centre the stage with absolute positioning at left/top 50% plus a
translate(-50%,-50%) prefix on the transform, so centring is independent of the
unscaled size. The grid still centres the empty/error messages. Verified the
diagram and the placeholder sit at offset 0 in a 691px split pane.

src/lib/components/Preview.svelte

@@ -188,7 +188,7 @@
         class="stage"
         class:paper={store.theme !== 'dark'}
         class:animate
-        style="transform: translate({pan.x}px, {pan.y}px) scale({zoom});"
+        style="transform: translate(-50%, -50%) translate({pan.x}px, {pan.y}px) scale({zoom});"
       >
         {@html svg}
       </div>
@@ -263,6 +263,9 @@
   }
   .canvas {
     height: 100%;
+    /* `position: relative` makes this the containing block for the absolutely
+       centred .stage; the grid still centres the empty/error messages. */
+    position: relative;
     display: grid;
     place-items: center;
     overflow: hidden;
@@ -274,6 +277,12 @@
     cursor: grabbing;
   }
   .stage {
+    /* Centre via the canvas centre regardless of the (unscaled) stage size —
+       grid centring left an oversized stage anchored off to the right. The
+       transform prepends translate(-50%, -50%) to recentre it. */
+    position: absolute;
+    left: 50%;
+    top: 50%;
     transform-origin: center center;
     /* Promote to its own compositor layer so panning doesn't ghost/stutter.
        No transition by default → drag-pan and pinch track the input 1:1. */