The pane sits square on the board's shoulders

Eric's layout call: the first-person pane wears exactly the board's
width, directly above it. A shrink-wrapped column stacks the two, with
the pane held out of the intrinsic sizing (width:0, min-width:100%) so
the BOARD alone decides how wide the column is; the canvas keeps its
aspect as it scales.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

packages/web/src/App.svelte

@@ -1869,6 +1869,7 @@
   {:else if view}
     <div class="game">
       <section class="board-zone">
+        <div class="table-stack">
         {#if prefs.liveFp && view.you && !net.spectating}
           <LiveFirstPerson {view} batch={fpBatch} onhide={() => setPref("liveFp", false)} />
         {/if}
@@ -1893,6 +1894,7 @@
           {litCells}
           {sightTrace}
         />
+        </div>
       </section>
 
       <aside class="paper-rail">
@@ -2814,6 +2816,19 @@
     min-height: 0;
   }
   .board-zone { display: flex; align-items: flex-start; justify-content: center; min-width: 0; }
+  /* The first-person pane wears exactly the board's width, right above
+   * it: the stack shrink-wraps to the board, and width:0 + min-width
+   * keeps the pane out of the intrinsic sizing so the BOARD alone
+   * decides how wide the column is. */
+  .table-stack {
+    display: inline-flex;
+    flex-direction: column;
+    align-items: stretch;
+    max-width: 100%;
+    min-width: 0;
+  }
+  .table-stack :global(.live-fp) { width: 0; min-width: 100%; }
+  .table-stack :global(.live-fp .fpv-canvas) { width: 100%; height: auto; }
   .board-zone :global(svg.board) {
     max-height: calc(100dvh - 21.5rem);
     width: auto;

packages/web/src/LiveFirstPerson.svelte

@@ -199,10 +199,6 @@
     position: relative;
     margin-bottom: 0.6rem;
   }
-  .live-fp :global(.fpv-canvas) {
-    max-height: 34dvh;
-    object-fit: cover;
-  }
   .live-fp-hide {
     position: absolute;
     top: 0.4rem;