@seatlayer/core 0.31.0 → 0.33.0

package/dist/view3d/index.js

@@ -7,7 +7,7 @@ import {
   pointInPolygonWithHoles,
   resolveSection,
   sectionGeometry
-} from "../chunk-FGS67GT3.js";
+} from "../chunk-MGC5BVAD.js";
 
 // src/view3d/index.ts
 import { Quat as Quat2, Vec3 as Vec33 } from "ogl";
@@ -28,13 +28,36 @@ var SEAT_STATE_COLORS = {
   selected: [0.24, 0.74, 1],
   dimmed: [0.28, 0.32, 0.37]
 };
+function upholsteryTone(rgb) {
+  const luma = 0.299 * rgb[0] + 0.587 * rgb[1] + 0.114 * rgb[2];
+  const SAT = 0.42;
+  const VALUE = 0.62;
+  return [
+    (luma + (rgb[0] - luma) * SAT) * VALUE,
+    (luma + (rgb[1] - luma) * SAT) * VALUE,
+    (luma + (rgb[2] - luma) * SAT) * VALUE
+  ];
+}
 var STRUCTURE = {
   ground: [0.07, 0.085, 0.11],
   tierTop: [0.24, 0.28, 0.34],
   tierWall: [0.17, 0.2, 0.25],
-  stageTop: [0.42, 0.36, 0.26],
-  // warm, slightly emissive read
-  stageWall: [0.26, 0.22, 0.16],
+  /**
+   * The lit performance surface.
+   *
+   * This was [0.42, 0.36, 0.26] and commented "slightly emissive read", which it
+   * was not — under the scene's rig it resolved to a mid-brown slab, and from a
+   * seat the stage was the DIMMEST large surface in a dark hall. That is exactly
+   * backwards: the stage is the one place in a venue with light pointed at it,
+   * and it is what a buyer's eye should land on when they arrive at their seat.
+   *
+   * Bright and warm enough to hold that role against the surrounding structure,
+   * which sits around 0.24. An authored `fill` still tints it (see `buildShape`),
+   * so an organizer's own stage colour survives — it is just no longer lit like
+   * a basement.
+   */
+  stageTop: [0.86, 0.64, 0.36],
+  stageWall: [0.34, 0.26, 0.18],
   decorTop: [0.22, 0.25, 0.29],
   decorWall: [0.15, 0.17, 0.2],
   gaTop: [0.24, 0.28, 0.33],
@@ -183,10 +206,18 @@ var OrbitCamera = class {
     this.maxDist = 100;
     this.gestureFired = false;
     this.dragging = false;
+    this.panning = false;
     this.lastX = 0;
     this.lastY = 0;
     this.activePointers = /* @__PURE__ */ new Map();
     this.pinchDist = 0;
+    this.pinchCx = 0;
+    this.pinchCy = 0;
+    /** Damped pan pivot. `target` chases this the way azimuth chases `azT`. */
+    this.targetT = new Vec3();
+    /** Venue centre + radius, so pan can be clamped to somewhere still useful. */
+    this.panAnchor = new Vec3();
+    this.panLimit = 0;
     this.camera = new Camera(gl, { fov: FOV, near: 0.1, far: 5e3, aspect: 1 });
     this.canvas = canvas;
     this.requestRender = requestRender;
@@ -198,12 +229,17 @@ var OrbitCamera = class {
       }
       this.activePointers.set(e.pointerId, { x: e.clientX, y: e.clientY });
       if (this.activePointers.size === 1) {
-        this.dragging = true;
+        this.panning = e.button === 2 || e.button === 1 || e.shiftKey;
+        this.dragging = !this.panning;
         this.lastX = e.clientX;
         this.lastY = e.clientY;
       } else if (this.activePointers.size === 2) {
         this.dragging = false;
+        this.panning = false;
         this.pinchDist = this.currentPinchDistance();
+        const c = this.pinchCentroid();
+        this.pinchCx = c.x;
+        this.pinchCy = c.y;
       }
     };
     this.onPointerMove = (e) => {
@@ -216,11 +252,24 @@ var OrbitCamera = class {
           this.fireGesture();
         }
         this.pinchDist = d;
+        const c = this.pinchCentroid();
+        this.panBy(c.x - this.pinchCx, c.y - this.pinchCy);
+        this.pinchCx = c.x;
+        this.pinchCy = c.y;
         return;
       }
-      if (!this.dragging) return;
       const dx = e.clientX - this.lastX;
       const dy = e.clientY - this.lastY;
+      if (this.panning) {
+        this.lastX = e.clientX;
+        this.lastY = e.clientY;
+        if (dx !== 0 || dy !== 0) {
+          this.panBy(dx, dy);
+          this.fireGesture();
+        }
+        return;
+      }
+      if (!this.dragging) return;
       this.lastX = e.clientX;
       this.lastY = e.clientY;
       if (dx !== 0 || dy !== 0) this.fireGesture();
@@ -235,7 +284,13 @@ var OrbitCamera = class {
       } catch {
       }
       if (this.activePointers.size < 2) this.pinchDist = 0;
-      if (this.activePointers.size === 0) this.dragging = false;
+      if (this.activePointers.size === 0) {
+        this.dragging = false;
+        this.panning = false;
+      }
+    };
+    this.onContextMenu = (e) => {
+      e.preventDefault();
     };
     this.onWheel = (e) => {
       e.preventDefault();
@@ -249,6 +304,55 @@ var OrbitCamera = class {
     canvas.addEventListener("pointerup", this.onPointerUp);
     canvas.addEventListener("pointercancel", this.onPointerUp);
     canvas.addEventListener("wheel", this.onWheel, { passive: false });
+    canvas.addEventListener("contextmenu", this.onContextMenu);
+  }
+  pinchCentroid() {
+    const pts = [...this.activePointers.values()];
+    if (!pts.length) return { x: 0, y: 0 };
+    let x = 0;
+    let y = 0;
+    for (const p of pts) {
+      x += p.x;
+      y += p.y;
+    }
+    return { x: x / pts.length, y: y / pts.length };
+  }
+  /**
+   * Slide the orbit pivot across the camera's own screen plane.
+   *
+   * Scaled by distance and FOV so a pixel of drag moves the same amount of VENUE
+   * under the cursor whatever the zoom: at the overview a drag sweeps the whole
+   * bowl, and pushed in among the seats it nudges. A fixed world-units-per-pixel
+   * would be unusable at one end or the other.
+   */
+  panBy(dxPx, dyPx) {
+    const h = this.canvas.clientHeight || 1;
+    const perPx = 2 * this.distance * Math.tan(this.fovY * DEG / 2) / h;
+    const sinA = Math.sin(this.azimuth);
+    const cosA = Math.cos(this.azimuth);
+    const rightX = cosA;
+    const rightZ = -sinA;
+    const cp = Math.cos(this.polar);
+    const sp = Math.sin(this.polar);
+    const fwdX = -sinA * cp;
+    const fwdZ = -cosA * cp;
+    this.targetT.x += (-dxPx * rightX + dyPx * fwdX) * perPx;
+    this.targetT.z += (-dxPx * rightZ + dyPx * fwdZ) * perPx;
+    this.targetT.y += dyPx * sp * perPx;
+    this.clampPan();
+    this.requestRender();
+  }
+  /** Keep the pivot within a bounds-derived box so a stray drag cannot lose the
+   *  venue entirely — the Overview chip should never be the only way back. */
+  clampPan() {
+    if (this.panLimit <= 0) return;
+    const lim = this.panLimit;
+    const cx = this.panAnchor.x;
+    const cy = this.panAnchor.y;
+    const cz = this.panAnchor.z;
+    this.targetT.x = Math.max(cx - lim, Math.min(cx + lim, this.targetT.x));
+    this.targetT.z = Math.max(cz - lim, Math.min(cz + lim, this.targetT.z));
+    this.targetT.y = Math.max(cy - lim * 0.5, Math.min(cy + lim, this.targetT.y));
   }
   /** One-shot: notify the first real user gesture (drives 3d_orbit_engaged). */
   fireGesture() {
@@ -275,6 +379,9 @@ var OrbitCamera = class {
    */
   frame(bounds, intro = false, stageAzimuth) {
     this.target.set(bounds.center[0], bounds.center[1], bounds.center[2]);
+    this.targetT.copy(this.target);
+    this.panAnchor.copy(this.target);
+    this.panLimit = Math.max(1, bounds.radius) * 1.5;
     const r = Math.max(1, bounds.radius);
     const halfV = this.fovY * DEG / 2;
     const aspect = this.camera.aspect || 1;
@@ -306,6 +413,9 @@ var OrbitCamera = class {
    */
   frameSoft(bounds, stageAzimuth) {
     this.target.set(bounds.center[0], bounds.center[1], bounds.center[2]);
+    this.targetT.copy(this.target);
+    this.panAnchor.copy(this.target);
+    this.panLimit = Math.max(1, bounds.radius) * 1.5;
     this.syncFromCamera();
     this.camera.perspective({ fov: this.fovY, aspect: this.camera.aspect });
     const r = Math.max(1, bounds.radius);
@@ -322,10 +432,17 @@ var OrbitCamera = class {
     const da = this.azT - this.azimuth;
     const dp = this.polT - this.polar;
     const dd = this.distT - this.distance;
-    const moving = Math.abs(da) > 1e-4 || Math.abs(dp) > 1e-4 || Math.abs(dd) > 1e-4;
+    const tx = this.targetT.x - this.target.x;
+    const ty = this.targetT.y - this.target.y;
+    const tz = this.targetT.z - this.target.z;
+    const panEps = Math.max(1e-4, this.distance * 1e-4);
+    const moving = Math.abs(da) > 1e-4 || Math.abs(dp) > 1e-4 || Math.abs(dd) > 1e-4 || Math.abs(tx) > panEps || Math.abs(ty) > panEps || Math.abs(tz) > panEps;
     this.azimuth += da * DAMP;
     this.polar += dp * DAMP;
     this.distance += dd * DAMP;
+    this.target.x += tx * DAMP;
+    this.target.y += ty * DAMP;
+    this.target.z += tz * DAMP;
     if (moving) this.applyPosition();
     return moving;
   }
@@ -351,6 +468,7 @@ var OrbitCamera = class {
   /** Point the orbit pivot at a new world target without moving the camera. */
   setTarget(target) {
     this.target.set(target[0], target[1], target[2]);
+    this.targetT.copy(this.target);
   }
   /** Restore the base FOV (a flight ends pushed-in) and re-sync orbit state. A
    * flight ends looking at `target` (the venue focal), so re-pivot there first —
@@ -358,6 +476,7 @@ var OrbitCamera = class {
   resumeAfterFlight(target) {
     this.camera.perspective({ fov: this.fovY, aspect: this.camera.aspect });
     if (target) this.target.set(target[0], target[1], target[2]);
+    this.targetT.copy(this.target);
     this.syncFromCamera();
   }
   applyPosition() {
@@ -374,6 +493,7 @@ var OrbitCamera = class {
     this.canvas.removeEventListener("pointerup", this.onPointerUp);
     this.canvas.removeEventListener("pointercancel", this.onPointerUp);
     this.canvas.removeEventListener("wheel", this.onWheel);
+    this.canvas.removeEventListener("contextmenu", this.onContextMenu);
     this.activePointers.clear();
   }
 };
@@ -422,17 +542,129 @@ var RenderLoop = class {
 };
 
 // src/view3d/lod.ts
+var SEAT_MIN_PIXELS_NEAR = 2.5;
+var SEAT_MIN_PIXELS_FAR = 1.15;
+var CHAIR_FULL_M = 12;
+var CHAIR_NONE_M = 22;
+var CHAIR_GATHER_M = 30;
+var CHAIR_REBUILD_M = 4;
+var CHAIR_MAX_INSTANCES = 8192;
+var CHAIR_REQUIRED_COVER_M = CHAIR_NONE_M + CHAIR_REBUILD_M;
 function computeSeatLod(distance, radius) {
   const near = radius * 1.4;
   const far = radius * 3.2;
-  if (distance <= near) return { scale: 1, fade: 0 };
+  if (distance <= near) return { scale: 1, fade: 0, minPixels: SEAT_MIN_PIXELS_NEAR };
   const t = Math.min(1, (distance - near) / Math.max(1e-3, far - near));
   return {
     scale: 1 - t * 0.4,
-    fade: t * 0.55
+    fade: t * 0.55,
+    // Tapered on the same ramp as the fade: as the block starts reading by its
+    // tier tint, the dots stop fighting each other for pixels.
+    minPixels: SEAT_MIN_PIXELS_NEAR + t * (SEAT_MIN_PIXELS_FAR - SEAT_MIN_PIXELS_NEAR)
   };
 }
 
+// src/view3d/scene/nearField.ts
+var SEATS_PER_CELL = 4;
+var NearFieldIndex = class {
+  constructor(iPosition, count) {
+    this.minX = 0;
+    this.minZ = 0;
+    this.cell = 1;
+    this.cols = 1;
+    this.rows = 1;
+    /** CSR-style buckets: `cellStart[c]…cellStart[c+1]` indexes into `cellItems`. */
+    this.cellStart = null;
+    this.cellItems = null;
+    this.iPosition = iPosition;
+    this.count = count;
+  }
+  /** Built on demand; safe to call repeatedly. */
+  ensureGrid() {
+    if (this.cellStart || this.count === 0) return;
+    const p = this.iPosition;
+    let minX = Infinity, minZ = Infinity, maxX = -Infinity, maxZ = -Infinity;
+    for (let i = 0; i < this.count; i++) {
+      const x = p[i * 3], z = p[i * 3 + 2];
+      if (x < minX) minX = x;
+      if (x > maxX) maxX = x;
+      if (z < minZ) minZ = z;
+      if (z > maxZ) maxZ = z;
+    }
+    const w = Math.max(maxX - minX, 1e-3);
+    const h = Math.max(maxZ - minZ, 1e-3);
+    this.cell = Math.max(Math.sqrt(w * h * SEATS_PER_CELL / this.count), 0.25);
+    this.cols = Math.max(1, Math.ceil(w / this.cell) + 1);
+    this.rows = Math.max(1, Math.ceil(h / this.cell) + 1);
+    this.minX = minX;
+    this.minZ = minZ;
+    const nCells = this.cols * this.rows;
+    const start = new Int32Array(nCells + 1);
+    const cellOf = (i) => {
+      const cx = Math.min(this.cols - 1, Math.max(0, Math.floor((p[i * 3] - minX) / this.cell)));
+      const cz = Math.min(this.rows - 1, Math.max(0, Math.floor((p[i * 3 + 2] - minZ) / this.cell)));
+      return cz * this.cols + cx;
+    };
+    for (let i = 0; i < this.count; i++) start[cellOf(i) + 1]++;
+    for (let c = 0; c < nCells; c++) start[c + 1] += start[c];
+    const items = new Int32Array(this.count);
+    const cursor = start.slice(0, nCells);
+    for (let i = 0; i < this.count; i++) items[cursor[cellOf(i)]++] = i;
+    this.cellStart = start;
+    this.cellItems = items;
+  }
+  /**
+   * Fill `out` with the indices of seats within `radius` metres of (camX, camZ),
+   * nearest cell-ring first, and return how many were written.
+   *
+   * Ring order is what makes the CHAIR_MAX_INSTANCES cap harmless: when the cap
+   * bites it drops the OUTERMOST seats, which are the ones already past the fade
+   * band and drawing nothing. A cap that truncated in index order would instead
+   * punch holes in the row you are sitting in.
+   *
+   * Note this is a horizontal (XZ) query and ignores height. A stacked venue's
+   * upper tier is therefore gathered along with the stalls beneath it — which is
+   * correct, because the fade weight is re-derived from true view depth in the
+   * shader anyway. The grid's only job is to bound the candidate set.
+   */
+  gather(camX, camZ, radius, out) {
+    this.ensureGrid();
+    const start = this.cellStart;
+    const items = this.cellItems;
+    if (!start || !items) return 0;
+    const cap = out.length;
+    const r2 = radius * radius;
+    const cx = Math.floor((camX - this.minX) / this.cell);
+    const cz = Math.floor((camZ - this.minZ) / this.cell);
+    const maxRing = Math.ceil(radius / this.cell) + 1;
+    const p = this.iPosition;
+    let n = 0;
+    for (let ring = 0; ring <= maxRing && n < cap; ring++) {
+      const z0 = cz - ring, z1 = cz + ring;
+      const x0 = cx - ring, x1 = cx + ring;
+      for (let gz = z0; gz <= z1 && n < cap; gz++) {
+        if (gz < 0 || gz >= this.rows) continue;
+        const edge = gz === z0 || gz === z1;
+        for (let gx = x0; gx <= x1 && n < cap; gx++) {
+          if (!edge && gx !== x0 && gx !== x1) {
+            gx = x1 - 1;
+            continue;
+          }
+          if (gx < 0 || gx >= this.cols) continue;
+          const c = gz * this.cols + gx;
+          for (let k = start[c], e = start[c + 1]; k < e && n < cap; k++) {
+            const i = items[k];
+            const dx = p[i * 3] - camX;
+            const dz = p[i * 3 + 2] - camZ;
+            if (dx * dx + dz * dz <= r2) out[n++] = i;
+          }
+        }
+      }
+    }
+    return n;
+  }
+};
+
 // src/view3d/scene/geometry.ts
 import earcut from "earcut";
 import polygonClipping from "polygon-clipping";
@@ -859,8 +1091,195 @@ function rectPolygon(x, y, w, h) {
   ];
 }
 
+// src/view3d/scene/seatChair.ts
+var CHAIR_PART = { pedestal: 0, pad: 1, back: 2, body: 3, head: 4 };
+var CHAIR_PART_OCCUPANT_MIN = CHAIR_PART.body;
+var CHAIR_PITCH_FRACTION = 0.44;
+var CHAIR_HALF_WIDTH_MIN_M = 0.15;
+var CHAIR_HALF_WIDTH_MAX_M = 0.3;
+var CHAIR_HALF_WIDTH_DEFAULT_M = 0.24;
+function chairHalfWidth(pitchM) {
+  if (pitchM === void 0 || !Number.isFinite(pitchM) || pitchM <= 0) {
+    return CHAIR_HALF_WIDTH_DEFAULT_M;
+  }
+  return Math.min(CHAIR_HALF_WIDTH_MAX_M, Math.max(CHAIR_HALF_WIDTH_MIN_M, pitchM * CHAIR_PITCH_FRACTION));
+}
+var BACK_RAKE_SLOPE = 0.21;
+var PAD_BACK_GAP_M = 0.05;
+var PAD_TOP_M = 0.45;
+var BACK_BASE_M = PAD_TOP_M + PAD_BACK_GAP_M;
+var BOXES = [
+  // Pedestal — a plain column under the pad. Without it the pad floats 0.36 m
+  // over the deck and the row reads as hovering trays.
+  { part: CHAIR_PART.pedestal, min: [-0.3, 0, -0.3], max: [0.3, 0.36, 0.3] },
+  // Seat pad — a full seat width across and about as deep, which is what a real
+  // one is. Its depth is bounded by the same pitch as its width, because the
+  // pitch measure is the tighter of the in-row and row-to-row spacings, so a
+  // tightly-raked tier cannot drive a pad into the back of the row in front.
+  { part: CHAIR_PART.pad, min: [-1, 0.36, -0.95], max: [1, PAD_TOP_M, 1] },
+  // Back panel — thin, raked, and the tallest thing in the row, so it is what
+  // carries the state colour when you look along a row from behind.
+  {
+    part: CHAIR_PART.back,
+    min: [-1, BACK_BASE_M, -1],
+    max: [1, 0.92, -0.72]
+  },
+  // --- the occupant ---------------------------------------------------------
+  //
+  // A hall with every seat empty reads as an architectural model, not a venue.
+  // The 2048-px panorama this replaced drew a crowd; losing it was the price of
+  // sharpness, and this is how it is bought back — in geometry, where there is
+  // no resolution ceiling.
+  //
+  // Deliberately two blocks and no limbs. At the range these are visible a
+  // person is a torso and a head, and every extra part multiplies by the number
+  // of occupied seats in view. The silhouette is what carries it, exactly as it
+  // does in the generated panorama's head-and-shoulder figures.
+  //
+  // Sized as a seated adult against the 0.92 m chair back: hips at the pad top,
+  // shoulders just above the back panel, head clear of it. Torso is narrower
+  // than the chair so neighbours never interpenetrate at any pitch, and it sits
+  // forward of the back panel rather than inside it.
+  {
+    part: CHAIR_PART.body,
+    min: [-0.66, PAD_TOP_M, -0.58],
+    max: [0.66, 1, 0.26]
+  },
+  // The head is deliberately SMALL. Sized by eye against the chair it came out
+  // near-cubic and read as Lego; a real head is about 0.16 m across and 0.22 m
+  // tall, which against a 0.24 m chair half-width is roughly a third of the
+  // chair's width and clearly taller than it is wide. Getting this ratio wrong
+  // is what makes a crowd look like toys rather than people.
+  {
+    part: CHAIR_PART.head,
+    min: [-0.34, 1.03, -0.4],
+    max: [0.34, 1.27, 0.02]
+  }
+];
+var FACES = [
+  // +X
+  { n: [1, 0, 0], c: [[1, 0, 0], [1, 1, 0], [1, 1, 1], [1, 0, 1]] },
+  // -X
+  { n: [-1, 0, 0], c: [[0, 0, 1], [0, 1, 1], [0, 1, 0], [0, 0, 0]] },
+  // +Y
+  { n: [0, 1, 0], c: [[0, 1, 0], [0, 1, 1], [1, 1, 1], [1, 1, 0]] },
+  // -Y
+  { n: [0, -1, 0], c: [[0, 0, 1], [0, 0, 0], [1, 0, 0], [1, 0, 1]] },
+  // +Z
+  { n: [0, 0, 1], c: [[0, 0, 1], [1, 0, 1], [1, 1, 1], [0, 1, 1]] },
+  // -Z
+  { n: [0, 0, -1], c: [[1, 0, 0], [0, 0, 0], [0, 1, 0], [1, 1, 0]] }
+];
+function buildChairMesh() {
+  const vertexCount = BOXES.length * FACES.length * 4;
+  const indexCount = BOXES.length * FACES.length * 6;
+  const position = new Float32Array(vertexCount * 3);
+  const normal = new Float32Array(vertexCount * 3);
+  const part = new Float32Array(vertexCount);
+  const index = new Uint16Array(indexCount);
+  let v = 0;
+  let t = 0;
+  for (const box of BOXES) {
+    for (const face of FACES) {
+      const base = v;
+      const corner3 = new Float32Array(12);
+      for (let ci = 0; ci < 4; ci++) {
+        const corner = face.c[ci];
+        for (let a = 0; a < 3; a++) {
+          corner3[ci * 3 + a] = corner[a] ? box.max[a] : box.min[a];
+        }
+      }
+      const ax = corner3[3] - corner3[0], ay = corner3[4] - corner3[1], az = corner3[5] - corner3[2];
+      const bx = corner3[6] - corner3[0], by = corner3[7] - corner3[1], bz = corner3[8] - corner3[2];
+      let nx = ay * bz - az * by;
+      let ny = az * bx - ax * bz;
+      let nz = ax * by - ay * bx;
+      const nl = Math.hypot(nx, ny, nz);
+      if (nl > 1e-9) {
+        nx /= nl;
+        ny /= nl;
+        nz /= nl;
+      } else {
+        nx = face.n[0];
+        ny = face.n[1];
+        nz = face.n[2];
+      }
+      if (nx * face.n[0] + ny * face.n[1] + nz * face.n[2] < 0) {
+        nx = -nx;
+        ny = -ny;
+        nz = -nz;
+      }
+      for (let ci = 0; ci < 4; ci++) {
+        position[v * 3] = corner3[ci * 3];
+        position[v * 3 + 1] = corner3[ci * 3 + 1];
+        position[v * 3 + 2] = corner3[ci * 3 + 2];
+        normal[v * 3] = nx;
+        normal[v * 3 + 1] = ny;
+        normal[v * 3 + 2] = nz;
+        part[v] = box.part;
+        v++;
+      }
+      index[t++] = base;
+      index[t++] = base + 1;
+      index[t++] = base + 2;
+      index[t++] = base;
+      index[t++] = base + 2;
+      index[t++] = base + 3;
+    }
+  }
+  return { position, normal, part, index, vertexCount, indexCount };
+}
+function computeSeatYaw(iPosition, count, rowIdAt, focal) {
+  const yaw = new Float32Array(count);
+  const px = (i) => iPosition[i * 3];
+  const pz = (i) => iPosition[i * 3 + 2];
+  let runStart = 0;
+  const flushRun = (start, end) => {
+    const n = end - start;
+    for (let i = start; i < end; i++) {
+      const [fx, fz] = focal(i);
+      let dx = fx - px(i);
+      let dz = fz - pz(i);
+      if (n >= 2) {
+        const a = Math.max(start, i - 1);
+        const b = Math.min(end - 1, i + 1);
+        const tx = px(b) - px(a);
+        const tz = pz(b) - pz(a);
+        const tl = Math.hypot(tx, tz);
+        if (tl > 1e-6) {
+          let nx = -tz / tl;
+          let nz = tx / tl;
+          if (nx * dx + nz * dz < 0) {
+            nx = -nx;
+            nz = -nz;
+          }
+          dx = nx;
+          dz = nz;
+        }
+      }
+      yaw[i] = dx === 0 && dz === 0 ? 0 : Math.atan2(dx, dz);
+    }
+  };
+  for (let i = 1; i <= count; i++) {
+    if (i === count || rowIdAt(i) !== rowIdAt(runStart)) {
+      flushRun(runStart, i);
+      runStart = i;
+    }
+  }
+  return yaw;
+}
+
 // src/view3d/scene/seatInstances.ts
 var SEAT_DOT_RADIUS_M = 0.22;
+function seatOccupantSeed(stateIndex, seatIndex) {
+  const state = SEAT_STATES[stateIndex];
+  if (state !== "sold" && state !== "held") return -1;
+  let h = (seatIndex + 1) * 2654435761;
+  h ^= h >>> 15;
+  h = Math.imul(h, 2246822519);
+  h ^= h >>> 13;
+  return (h >>> 0) % 1e5 / 1e5;
+}
 var SEAT_PITCH_FRACTION = 0.42;
 function nearestNeighbourSpacing(seats) {
   const n = seats.length;
@@ -923,11 +1342,13 @@ function seatSurfaceY(seat) {
   if (Number.isFinite(eye)) return Math.max(0, eye - SEATED_EYE_HEIGHT_M);
   return 0;
 }
-function buildSeatInstances(seats, initial, surfaces, seatFloor) {
+function buildSeatInstances(seats, initial, surfaces, seatFloor, categoryColor) {
   const count = seats.length;
   const iPosition = new Float32Array(count * 3);
   const iState = new Float32Array(count);
+  const iCategory = new Float32Array(count * 3);
   const iMaxRadius = new Float32Array(count);
+  const iChairWidth = new Float32Array(count);
   const iRing = new Float32Array(count * 3);
   const idToIndex = /* @__PURE__ */ new Map();
   const spacing = nearestNeighbourSpacing(seats);
@@ -936,10 +1357,15 @@ function buildSeatInstances(seats, initial, surfaces, seatFloor) {
     const resolved = surfaces?.seatPitchU(i);
     const pitchM = (resolved ?? spacing[i]) * M;
     iMaxRadius[i] = Number.isFinite(pitchM) ? Math.max(0.06, Math.min(SEAT_DOT_RADIUS_M, pitchM * SEAT_PITCH_FRACTION)) : SEAT_DOT_RADIUS_M;
+    iChairWidth[i] = chairHalfWidth(Number.isFinite(pitchM) ? pitchM : void 0);
     iPosition[i * 3] = seat.x * M;
     iPosition[i * 3 + 1] = surfaces ? surfaces.seatDeckY(i) : seatSurfaceY(seat);
     iPosition[i * 3 + 2] = seat.y * M;
     iState[i] = seatStateIndex(initial ? initial(seat) : "available");
+    const cat = hexToRgb(categoryColor?.get(seat.categoryKey) ?? "#6e7bff") ?? [0.43, 0.48, 1];
+    iCategory[i * 3] = cat[0];
+    iCategory[i * 3 + 1] = cat[1];
+    iCategory[i * 3 + 2] = cat[2];
     if (seat.accessibility?.length) {
       const rgb = hexToRgb(accessibilityRingColor(seat.accessibility));
       if (rgb) {
@@ -954,10 +1380,13 @@ function buildSeatInstances(seats, initial, surfaces, seatFloor) {
     count,
     iPosition,
     iState,
+    iCategory,
     iMaxRadius,
     iRing,
     idToIndex,
-    iFloor: seatFloor ?? new Float32Array(count)
+    iChairWidth,
+    iFloor: seatFloor ?? new Float32Array(count),
+    iYaw: new Float32Array(count)
   };
 }
 var RUN_MERGE_GAP = 64;
@@ -1092,6 +1521,28 @@ function cullOverlapping(items, separationX, separationY = separationX) {
   }
   return kept;
 }
+var DENSE_LABEL_BUDGET = { row: 8, seat: 14 };
+function focusScore(screen, worldDistance, width, height) {
+  const half = Math.max(1, Math.min(width, height) * 0.5);
+  const off = Math.min(2, Math.hypot(screen.x - width / 2, screen.y - height / 2) / half);
+  return worldDistance * (1 + 1.5 * off);
+}
+function pickDenseLabels(items, separationX, separationY, budget) {
+  const ordered = [...items].sort((a, b) => a.focus - b.focus);
+  const kept = [];
+  for (const item of ordered) {
+    if (kept.length >= budget) break;
+    let clash = false;
+    for (const k of kept) {
+      if (Math.abs(item.screen.x - k.screen.x) < separationX && Math.abs(item.screen.y - k.screen.y) < separationY) {
+        clash = true;
+        break;
+      }
+    }
+    if (!clash) kept.push(item);
+  }
+  return kept;
+}
 function centroidOf(points) {
   if (!points.length) return null;
   let x = 0, y = 0;
@@ -1265,195 +1716,6 @@ function buildSectionRake(rows, focal) {
   return rowsRake(fits);
 }
 
-// src/view3d/scene/surface.ts
-var FLAT_SLAB_TOP_M = 0.05;
-var CAP_MAX_ERROR_M = 0.05;
-var SEAT_CLEARANCE_M = 0.15;
-var SEAT_OWNERSHIP_PAD_U = SEAT_DOT_RADIUS_M * 1.5 * CHART_UNITS_PER_METRE;
-function bboxOf(pts) {
-  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
-  for (const p of pts) {
-    if (p.x < minX) minX = p.x;
-    if (p.y < minY) minY = p.y;
-    if (p.x > maxX) maxX = p.x;
-    if (p.y > maxY) maxY = p.y;
-  }
-  return { minX, minY, maxX, maxY };
-}
-var MAX_TIER_RISE_M = 25;
-function buildVenueSurfaces(units, seats) {
-  const bySection = /* @__PURE__ */ new Map();
-  const seatOwner = new Array(seats.length).fill(null);
-  const seatDeck = new Float64Array(seats.length);
-  const seatRowLevel = new Array(seats.length).fill(void 0);
-  const seatPitch = new Array(seats.length).fill(void 0);
-  const acc = /* @__PURE__ */ new Map();
-  const boxes = [];
-  for (const unit of units) {
-    for (const o of unit.objects) {
-      if (o.type !== "section" || !o.outline || o.outline.length < 3) continue;
-      const owned = outsetRing(o.outline, SEAT_OWNERSHIP_PAD_U);
-      acc.set(o.id, { section: o, unit, frontU: Infinity, hasSeats: false, rows: /* @__PURE__ */ new Map(), seatIndices: [] });
-      boxes.push({ id: o.id, box: bboxOf(owned), section: o, unit, outline: owned });
-    }
-  }
-  for (let i = 0; i < seats.length; i++) {
-    const s = seats[i];
-    for (const b of boxes) {
-      if (s.x < b.box.minX || s.x > b.box.maxX || s.y < b.box.minY || s.y > b.box.maxY) continue;
-      if (!pointInPolygonWithHoles({ x: s.x, y: s.y }, b.outline, b.section.holes)) continue;
-      seatOwner[i] = b.id;
-      const a = acc.get(b.id);
-      a.hasSeats = true;
-      const f = s.focalPoint ?? b.unit.focal;
-      const d = Math.hypot(s.x - f.x, s.y - f.y);
-      if (d < a.frontU) a.frontU = d;
-      a.seatIndices.push(i);
-      const rowKey = s.rowId || `__seat-${i}`;
-      const arr = a.rows.get(rowKey);
-      if (arr) arr.push({ x: s.x, y: s.y });
-      else a.rows.set(rowKey, [{ x: s.x, y: s.y }]);
-      break;
-    }
-  }
-  for (const [id, a] of acc) {
-    const geo = sectionGeometry(a.section, { floorBaseHeightM: a.unit.baseHeightM });
-    const bottomY = a.unit.baseHeightM;
-    const rakeTan = geo.rake > 0 ? Math.tan(geo.rake * Math.PI / 180) : 0;
-    const inferredFlat = geo.rake <= 0.01 && geo.height <= bottomY + 1e-3;
-    const kind = a.section.surfaceKind;
-    const flat = kind === "flat" ? true : kind === "rakedRows" ? geo.rake > 0.01 ? false : inferredFlat : inferredFlat;
-    const structure = a.hasSeats ? resolveSection(id, seats, a.seatIndices, a.unit.focal) : { sectionId: id, rows: [], blockCount: 0 };
-    const needsRake = structure.rows.length < 2;
-    const rake = needsRake ? buildSectionRake([...a.rows.values()].map((points) => ({ points })), a.unit.focal) : null;
-    let frontU = Infinity;
-    if (rake) {
-      if (a.hasSeats) {
-        for (const pts of a.rows.values()) {
-          for (const p of pts) {
-            const d = rake.depthAt(p.x, p.y);
-            if (d < frontU) frontU = d;
-          }
-        }
-      }
-      if (!a.hasSeats || !Number.isFinite(frontU)) {
-        frontU = Infinity;
-        for (const p of a.section.outline) {
-          const d = rake.depthAt(p.x, p.y);
-          if (d < frontU) frontU = d;
-        }
-      }
-    }
-    const flatTop = bottomY + FLAT_SLAB_TOP_M;
-    const baseFloor = bottomY + FLAT_SLAB_TOP_M;
-    const levelFor = (depthU) => {
-      const depthM = Math.max(0, depthU - frontU) * METRES_PER_CHART_UNIT;
-      const rise = Math.min(depthM * rakeTan, MAX_TIER_RISE_M);
-      return Math.max(baseFloor, geo.height + rise);
-    };
-    const levelForBlockDepth = (blockDepthU) => {
-      const depthM = Math.max(0, blockDepthU) * METRES_PER_CHART_UNIT;
-      const rise = Math.min(depthM * rakeTan, MAX_TIER_RISE_M);
-      return Math.max(baseFloor, geo.height + rise);
-    };
-    const rowLevels = flat ? [] : structure.rows.map((r) => ({
-      pts: r.pts,
-      y: levelForBlockDepth(r.blockDepth),
-      depth: r.blockDepth,
-      blockId: r.blockId
-    }));
-    const landingY = rowLevels.length ? rowLevels[0].y : flatTop;
-    const rowBounds = rowLevels.map((r) => {
-      let cx = 0, cy = 0;
-      for (const p of r.pts) {
-        cx += p.x;
-        cy += p.y;
-      }
-      const n = r.pts.length || 1;
-      cx /= n;
-      cy /= n;
-      let rad = 0;
-      for (const p of r.pts) {
-        const d = Math.hypot(p.x - cx, p.y - cy);
-        if (d > rad) rad = d;
-      }
-      return { cx, cy, rad };
-    });
-    const deckAt = flat ? () => flatTop : rowLevels.length >= 2 ? (x, y) => {
-      let best = Infinity, bestY = landingY;
-      for (let i = 0; i < rowLevels.length; i++) {
-        const b = rowBounds[i];
-        if (Math.hypot(x - b.cx, y - b.cy) - b.rad >= best) continue;
-        const d = distanceToPolyline(rowLevels[i].pts, x, y);
-        if (d < best) {
-          best = d;
-          bestY = rowLevels[i].y;
-        }
-      }
-      return bestY;
-    } : (x, y) => rake ? levelFor(rake.depthAt(x, y)) : flatTop;
-    const UP = [0, 1, 0];
-    const normalAt = rowLevels.length >= 2 || flat ? () => UP : (x, y) => {
-      if (!rake) return UP;
-      const d = rake.depthAt(x, y);
-      if (d <= frontU) return UP;
-      const depthM = (d - frontU) * METRES_PER_CHART_UNIT;
-      if (depthM * rakeTan >= MAX_TIER_RISE_M) return UP;
-      if (geo.height + depthM * rakeTan <= baseFloor) return UP;
-      const [gx, gy] = rake.gradientAt(x, y);
-      if (gx === 0 && gy === 0) return UP;
-      const inv = 1 / Math.hypot(rakeTan, 1);
-      return [-gx * rakeTan * inv, inv, -gy * rakeTan * inv];
-    };
-    if (!flat) {
-      for (const r of structure.rows) {
-        const y = levelForBlockDepth(r.blockDepth);
-        for (const si of r.seatIndices) seatRowLevel[si] = y;
-      }
-    }
-    for (const r of structure.rows) {
-      const gaps = [];
-      for (let k = 1; k < r.pts.length; k++) {
-        const d = Math.hypot(r.pts[k].x - r.pts[k - 1].x, r.pts[k].y - r.pts[k - 1].y);
-        if (d > 1e-6) gaps.push(d);
-      }
-      gaps.sort((x, y) => x - y);
-      const along = gaps.length ? gaps[Math.floor(gaps.length / 2)] : Infinity;
-      let across = Infinity;
-      const probe = r.pts[Math.floor(r.pts.length / 2)];
-      if (probe) {
-        for (const other of structure.rows) {
-          if (other === r || other.blockId !== r.blockId) continue;
-          const d = distanceToPolyline(other.pts, probe.x, probe.y);
-          if (d > 1e-6 && d < across) across = d;
-        }
-      }
-      const pitch = Math.min(along, Math.max(across, along * 0.5));
-      if (Number.isFinite(pitch) && pitch > 0) {
-        for (const si of r.seatIndices) seatPitch[si] = pitch;
-      }
-    }
-    bySection.set(id, { sectionId: id, deckAt, normalAt, flat, bottomY, rowLevels, landingY });
-  }
-  for (let i = 0; i < seats.length; i++) {
-    const ownerId = seatOwner[i];
-    const s = seats[i];
-    if (ownerId) {
-      const own = seatRowLevel[i];
-      seatDeck[i] = (own ?? bySection.get(ownerId).deckAt(s.x, s.y)) + SEAT_CLEARANCE_M;
-      continue;
-    }
-    const eye = s.eyeHeightM;
-    seatDeck[i] = Number.isFinite(eye) ? Math.max(0, eye - SEATED_EYE_HEIGHT_M) : 0;
-  }
-  return {
-    bySection,
-    seatOwner,
-    seatDeckY: (i) => seatDeck[i],
-    seatPitchU: (i) => seatPitch[i]
-  };
-}
-
 // src/view3d/scene/deckBands.ts
 import polygonClipping2 from "polygon-clipping";
 import earcut2 from "earcut";
@@ -1502,6 +1764,68 @@ function extendEnds(pts, by) {
   });
   return out;
 }
+var CORNER_STEP_RAD = Math.PI / 12;
+function convexHull(pts) {
+  if (pts.length < 3) return [...pts];
+  const s = [...pts].sort((a, b) => a.x - b.x || a.y - b.y);
+  const cross = (o, a, b) => (a.x - o.x) * (b.y - o.y) - (a.y - o.y) * (b.x - o.x);
+  const half = (src) => {
+    const out = [];
+    for (const p of src) {
+      while (out.length >= 2 && cross(out[out.length - 2], out[out.length - 1], p) <= 0) out.pop();
+      out.push(p);
+    }
+    out.pop();
+    return out;
+  };
+  const hull = [...half(s), ...half([...s].reverse())];
+  return hull.length >= 3 ? hull : [...pts];
+}
+function seatClusterPatch(pts, pad) {
+  if (!pts.length || !(pad > 0)) return [];
+  const hull = convexHull(pts);
+  const arc = (v, from, to, out2) => {
+    let sweep = to - from;
+    while (sweep < 0) sweep += Math.PI * 2;
+    while (sweep > Math.PI * 2) sweep -= Math.PI * 2;
+    const steps = Math.max(1, Math.ceil(sweep / CORNER_STEP_RAD));
+    const r = pad / Math.cos(sweep / steps / 2);
+    for (let k = 0; k <= steps; k++) {
+      const a = from + sweep * k / steps;
+      out2.push({ x: v.x + Math.cos(a) * r, y: v.y + Math.sin(a) * r });
+    }
+  };
+  if (hull.length < 3) {
+    let cx = 0, cy = 0;
+    for (const p of hull) {
+      cx += p.x;
+      cy += p.y;
+    }
+    cx /= hull.length || 1;
+    cy /= hull.length || 1;
+    let far = 0;
+    for (const p of hull) far = Math.max(far, Math.hypot(p.x - cx, p.y - cy));
+    const out2 = [];
+    const steps = Math.max(3, Math.ceil(Math.PI * 2 / CORNER_STEP_RAD));
+    const r = (far + pad) / Math.cos(Math.PI / steps);
+    for (let k = 0; k < steps; k++) {
+      const a = k / steps * Math.PI * 2;
+      out2.push({ x: cx + Math.cos(a) * r, y: cy + Math.sin(a) * r });
+    }
+    return out2;
+  }
+  const n = hull.length;
+  const edgeAngle = [];
+  for (let i = 0; i < n; i++) {
+    const a = hull[i], b = hull[(i + 1) % n];
+    edgeAngle.push(Math.atan2(-(b.x - a.x), b.y - a.y));
+  }
+  const out = [];
+  for (let i = 0; i < n; i++) {
+    arc(hull[i], edgeAngle[(i + n - 1) % n], edgeAngle[i], out);
+  }
+  return dedupeAdjacent(out);
+}
 function distToPolyline(pts, x, y) {
   if (pts.length === 1) return Math.hypot(x - pts[0].x, y - pts[0].y);
   let best = Infinity;
@@ -1632,7 +1956,14 @@ function deckFootprints(rows, focal, shared) {
     else byBlock.set(rows[i].blockId, [i]);
   }
   const out = [];
-  for (const [, indices] of byBlock) {
+  for (const [, allIndices] of byBlock) {
+    const indices = [];
+    for (const i of allIndices) {
+      const patch = rows[i].patch;
+      if (patch && patch.length >= 3) out.push({ outline: [...patch], holes: [], topY: rows[i].y });
+      else indices.push(i);
+    }
+    if (!indices.length) continue;
     indices.sort((a, b) => rows[a].depth - rows[b].depth);
     const ribbons = indices.map((i) => ribbonOf(rows, i, nbrs, focal));
     const usable = ribbons.filter((r) => r !== null);
@@ -1760,15 +2091,18 @@ var ClipTest = class {
     return false;
   }
 };
-function emitClippedQuad(builder, clipRing, clipTest, quad, y, color) {
-  if (clipTest.containsAll(quad)) {
+function emitClippedPoly(builder, clipRing, clipTest, poly, y, color) {
+  if (poly.length < 3) return;
+  if (clipTest.containsAll(poly)) {
     const UPF = [0, 1, 0];
-    const a = quad[0], b = quad[1], c = quad[2], d = quad[3];
-    builder.tri([a.x * M, y, a.y * M], [b.x * M, y, b.y * M], [c.x * M, y, c.y * M], UPF, color);
-    builder.tri([a.x * M, y, a.y * M], [c.x * M, y, c.y * M], [d.x * M, y, d.y * M], UPF, color);
+    const a = poly[0];
+    for (let i = 1; i + 1 < poly.length; i++) {
+      const b = poly[i], c = poly[i + 1];
+      builder.tri([a.x * M, y, a.y * M], [b.x * M, y, b.y * M], [c.x * M, y, c.y * M], UPF, color);
+    }
     return;
   }
-  const ring = quad.map((p) => [p.x, p.y]);
+  const ring = poly.map((p) => [p.x, p.y]);
   ring.push(ring[0]);
   let pieces;
   try {
@@ -1777,9 +2111,9 @@ function emitClippedQuad(builder, clipRing, clipTest, quad, y, color) {
     return;
   }
   const UP = [0, 1, 0];
-  for (const poly of pieces) {
-    if (!poly.length || poly[0].length < 4) continue;
-    const outer = poly[0];
+  for (const poly2 of pieces) {
+    if (!poly2.length || poly2[0].length < 4) continue;
+    const outer = poly2[0];
     const flat = [];
     const pts = [];
     for (let i = 0; i < outer.length - 1; i++) {
@@ -1808,6 +2142,46 @@ function emitDeckBands(builder, rows, focal, landingY, colors, clip, shared) {
   const clipTest = clip && clip.length >= 3 ? new ClipTest([[...clip]]) : null;
   for (let i = 0; i < rows.length; i++) {
     const row = rows[i];
+    if (row.patch && row.patch.length >= 3) {
+      const patch = [...row.patch];
+      const belowY2 = nbrs[i].belowY ?? landingY;
+      if (clipRing && clipTest) emitClippedPoly(builder, clipRing, clipTest, patch, row.y, colors.tread);
+      else {
+        const a = patch[0];
+        for (let k = 1; k + 1 < patch.length; k++) {
+          const b = patch[k], c = patch[k + 1];
+          builder.tri([a.x * M, row.y, a.y * M], [b.x * M, row.y, b.y * M], [c.x * M, row.y, c.y * M], UP, colors.tread);
+        }
+      }
+      if (row.y > belowY2 + MIN_RISER_M) {
+        let cx = 0, cy = 0;
+        for (const p of patch) {
+          cx += p.x;
+          cy += p.y;
+        }
+        cx /= patch.length;
+        cy /= patch.length;
+        for (let k = 0; k < patch.length; k++) {
+          const p = patch[k], q = patch[(k + 1) % patch.length];
+          const dx = q.x - p.x, dy = q.y - p.y;
+          const len = Math.hypot(dx, dy);
+          if (len < 1e-6) continue;
+          let nx = dy / len, ny = -dx / len;
+          if ((p.x - cx) * nx + (p.y - cy) * ny < 0) {
+            nx = -nx;
+            ny = -ny;
+          }
+          const rn = [nx, 0, ny];
+          const pt = [p.x * M, row.y, p.y * M];
+          const qt = [q.x * M, row.y, q.y * M];
+          const pb = [p.x * M, belowY2, p.y * M];
+          const qb = [q.x * M, belowY2, q.y * M];
+          builder.tri(pt, qt, qb, rn, colors.riser);
+          builder.tri(pt, qb, pb, rn, colors.riser);
+        }
+      }
+      continue;
+    }
     const rib = ribbonOf(rows, i, nbrs, focal);
     if (!rib) continue;
     const { pts, nrm, front, back } = rib;
@@ -1822,7 +2196,7 @@ function emitDeckBands(builder, rows, focal, landingY, colors, clip, shared) {
       const pB = [(p.x + np[0] * back) * M, row.y, (p.y + np[1] * back) * M];
       const qB = [(q.x + nq[0] * back) * M, row.y, (q.y + nq[1] * back) * M];
       if (clipRing && clipTest) {
-        emitClippedQuad(builder, clipRing, clipTest, [
+        emitClippedPoly(builder, clipRing, clipTest, [
           { x: p.x - np[0] * front, y: p.y - np[1] * front },
           { x: q.x - nq[0] * front, y: q.y - nq[1] * front },
           { x: q.x + nq[0] * back, y: q.y + nq[1] * back },
@@ -1843,6 +2217,208 @@ function emitDeckBands(builder, rows, focal, landingY, colors, clip, shared) {
   }
 }
 
+// src/view3d/scene/surface.ts
+var FLAT_SLAB_TOP_M = 0.05;
+var CAP_MAX_ERROR_M = 0.05;
+var SEAT_CLEARANCE_M = 0.15;
+var SEAT_OWNERSHIP_PAD_U = SEAT_DOT_RADIUS_M * 1.5 * CHART_UNITS_PER_METRE;
+function bboxOf(pts) {
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+  for (const p of pts) {
+    if (p.x < minX) minX = p.x;
+    if (p.y < minY) minY = p.y;
+    if (p.x > maxX) maxX = p.x;
+    if (p.y > maxY) maxY = p.y;
+  }
+  return { minX, minY, maxX, maxY };
+}
+function pointInRing2(ring, x, y) {
+  let inside = false;
+  for (let i = 0, j = ring.length - 1; i < ring.length; j = i++) {
+    const a = ring[i], b = ring[j];
+    if (a.y > y !== b.y > y && x < (b.x - a.x) * (y - a.y) / (b.y - a.y) + a.x) inside = !inside;
+  }
+  return inside;
+}
+var MAX_TIER_RISE_M = 25;
+function buildVenueSurfaces(units, seats) {
+  const bySection = /* @__PURE__ */ new Map();
+  const seatOwner = new Array(seats.length).fill(null);
+  const seatDeck = new Float64Array(seats.length);
+  const seatRowLevel = new Array(seats.length).fill(void 0);
+  const seatPitch = new Array(seats.length).fill(void 0);
+  const acc = /* @__PURE__ */ new Map();
+  const boxes = [];
+  const tableRowIds = /* @__PURE__ */ new Set();
+  for (const unit of units) {
+    for (const o of unit.objects) {
+      if (o.type === "table") tableRowIds.add(o.id);
+      if (o.type !== "section" || !o.outline || o.outline.length < 3) continue;
+      const owned = outsetRing(o.outline, SEAT_OWNERSHIP_PAD_U);
+      acc.set(o.id, { section: o, unit, frontU: Infinity, hasSeats: false, rows: /* @__PURE__ */ new Map(), seatIndices: [] });
+      boxes.push({ id: o.id, box: bboxOf(owned), section: o, unit, outline: owned });
+    }
+  }
+  for (let i = 0; i < seats.length; i++) {
+    const s = seats[i];
+    for (const b of boxes) {
+      if (s.x < b.box.minX || s.x > b.box.maxX || s.y < b.box.minY || s.y > b.box.maxY) continue;
+      if (!pointInPolygonWithHoles({ x: s.x, y: s.y }, b.outline, b.section.holes)) continue;
+      seatOwner[i] = b.id;
+      const a = acc.get(b.id);
+      a.hasSeats = true;
+      const f = s.focalPoint ?? b.unit.focal;
+      const d = Math.hypot(s.x - f.x, s.y - f.y);
+      if (d < a.frontU) a.frontU = d;
+      a.seatIndices.push(i);
+      const rowKey = s.rowId || `__seat-${i}`;
+      const arr = a.rows.get(rowKey);
+      if (arr) arr.push({ x: s.x, y: s.y });
+      else a.rows.set(rowKey, [{ x: s.x, y: s.y }]);
+      break;
+    }
+  }
+  for (const [id, a] of acc) {
+    const geo = sectionGeometry(a.section, { floorBaseHeightM: a.unit.baseHeightM });
+    const bottomY = a.unit.baseHeightM;
+    const rakeTan = geo.rake > 0 ? Math.tan(geo.rake * Math.PI / 180) : 0;
+    const inferredFlat = geo.rake <= 0.01 && geo.height <= bottomY + 1e-3;
+    const kind = a.section.surfaceKind;
+    const flat = kind === "flat" ? true : kind === "rakedRows" ? geo.rake > 0.01 ? false : inferredFlat : inferredFlat;
+    const structure = a.hasSeats ? resolveSection(id, seats, a.seatIndices, a.unit.focal) : { sectionId: id, rows: [], blockCount: 0 };
+    const needsRake = structure.rows.length < 2;
+    const rake = needsRake ? buildSectionRake([...a.rows.values()].map((points) => ({ points })), a.unit.focal) : null;
+    let frontU = Infinity;
+    if (rake) {
+      if (a.hasSeats) {
+        for (const pts of a.rows.values()) {
+          for (const p of pts) {
+            const d = rake.depthAt(p.x, p.y);
+            if (d < frontU) frontU = d;
+          }
+        }
+      }
+      if (!a.hasSeats || !Number.isFinite(frontU)) {
+        frontU = Infinity;
+        for (const p of a.section.outline) {
+          const d = rake.depthAt(p.x, p.y);
+          if (d < frontU) frontU = d;
+        }
+      }
+    }
+    const baseFloor = bottomY + FLAT_SLAB_TOP_M;
+    const flatTop = Math.max(baseFloor, geo.height);
+    const levelFor = (depthU) => {
+      const depthM = Math.max(0, depthU - frontU) * METRES_PER_CHART_UNIT;
+      const rise = Math.min(depthM * rakeTan, MAX_TIER_RISE_M);
+      return Math.max(baseFloor, geo.height + rise);
+    };
+    const levelForBlockDepth = (blockDepthU) => {
+      const depthM = Math.max(0, blockDepthU) * METRES_PER_CHART_UNIT;
+      const rise = Math.min(depthM * rakeTan, MAX_TIER_RISE_M);
+      return Math.max(baseFloor, geo.height + rise);
+    };
+    const rowLevels = flat ? [] : structure.rows.map((r) => ({
+      pts: r.pts,
+      y: levelForBlockDepth(r.blockDepth),
+      depth: r.blockDepth,
+      blockId: r.blockId,
+      ...tableRowIds.has(r.id) ? { patch: seatClusterPatch(r.pts, MIN_REACH_U) } : {}
+    }));
+    const landingY = rowLevels.length ? rowLevels[0].y : flatTop;
+    const rowBounds = rowLevels.map((r) => {
+      const ext = r.patch && r.patch.length >= 3 ? r.patch : r.pts;
+      let cx = 0, cy = 0;
+      for (const p of ext) {
+        cx += p.x;
+        cy += p.y;
+      }
+      const n = ext.length || 1;
+      cx /= n;
+      cy /= n;
+      let rad = 0;
+      for (const p of ext) {
+        const d = Math.hypot(p.x - cx, p.y - cy);
+        if (d > rad) rad = d;
+      }
+      return { cx, cy, rad };
+    });
+    const deckAt = flat ? () => flatTop : rowLevels.length >= 2 ? (x, y) => {
+      let best = Infinity, bestY = landingY;
+      for (let i = 0; i < rowLevels.length; i++) {
+        const b = rowBounds[i];
+        if (Math.hypot(x - b.cx, y - b.cy) - b.rad >= best) continue;
+        const patch = rowLevels[i].patch;
+        const d = patch && patch.length >= 3 ? pointInRing2(patch, x, y) ? 0 : distanceToPolyline(patch, x, y) : distanceToPolyline(rowLevels[i].pts, x, y);
+        if (d < best) {
+          best = d;
+          bestY = rowLevels[i].y;
+        }
+      }
+      return bestY;
+    } : (x, y) => rake ? levelFor(rake.depthAt(x, y)) : flatTop;
+    const UP = [0, 1, 0];
+    const normalAt = rowLevels.length >= 2 || flat ? () => UP : (x, y) => {
+      if (!rake) return UP;
+      const d = rake.depthAt(x, y);
+      if (d <= frontU) return UP;
+      const depthM = (d - frontU) * METRES_PER_CHART_UNIT;
+      if (depthM * rakeTan >= MAX_TIER_RISE_M) return UP;
+      if (geo.height + depthM * rakeTan <= baseFloor) return UP;
+      const [gx, gy] = rake.gradientAt(x, y);
+      if (gx === 0 && gy === 0) return UP;
+      const inv = 1 / Math.hypot(rakeTan, 1);
+      return [-gx * rakeTan * inv, inv, -gy * rakeTan * inv];
+    };
+    if (!flat) {
+      for (const r of structure.rows) {
+        const y = levelForBlockDepth(r.blockDepth);
+        for (const si of r.seatIndices) seatRowLevel[si] = y;
+      }
+    }
+    for (const r of structure.rows) {
+      const gaps = [];
+      for (let k = 1; k < r.pts.length; k++) {
+        const d = Math.hypot(r.pts[k].x - r.pts[k - 1].x, r.pts[k].y - r.pts[k - 1].y);
+        if (d > 1e-6) gaps.push(d);
+      }
+      gaps.sort((x, y) => x - y);
+      const along = gaps.length ? gaps[Math.floor(gaps.length / 2)] : Infinity;
+      let across = Infinity;
+      const probe = r.pts[Math.floor(r.pts.length / 2)];
+      if (probe) {
+        for (const other of structure.rows) {
+          if (other === r || other.blockId !== r.blockId) continue;
+          const d = distanceToPolyline(other.pts, probe.x, probe.y);
+          if (d > 1e-6 && d < across) across = d;
+        }
+      }
+      const pitch = Math.min(along, Math.max(across, along * 0.5));
+      if (Number.isFinite(pitch) && pitch > 0) {
+        for (const si of r.seatIndices) seatPitch[si] = pitch;
+      }
+    }
+    bySection.set(id, { sectionId: id, deckAt, normalAt, flat, bottomY, rowLevels, landingY });
+  }
+  for (let i = 0; i < seats.length; i++) {
+    const ownerId = seatOwner[i];
+    const s = seats[i];
+    if (ownerId) {
+      const own = seatRowLevel[i];
+      seatDeck[i] = (own ?? bySection.get(ownerId).deckAt(s.x, s.y)) + SEAT_CLEARANCE_M;
+      continue;
+    }
+    const eye = s.eyeHeightM;
+    seatDeck[i] = Number.isFinite(eye) ? Math.max(0, eye - SEATED_EYE_HEIGHT_M) : 0;
+  }
+  return {
+    bySection,
+    seatOwner,
+    seatDeckY: (i) => seatDeck[i],
+    seatPitchU: (i) => seatPitch[i]
+  };
+}
+
 // src/view3d/scene/sceneModel.ts
 function floorUnits(doc) {
   if (doc.floors?.length) {
@@ -2008,22 +2584,39 @@ function buildTier(builder, section, unit, fill, surface, claimed, siblings, S)
   }
   const maxErr = surface.flat ? Infinity : CAP_MAX_ERROR_M;
   const topN = (p) => surface.normalAt(p.x, p.y);
-  for (const ring of claimed.subtract(outline)) {
+  const level = surface.flat ? surface.landingY : void 0;
+  for (const ring of claimed.subtract(outline, level)) {
     extrudePrism(builder, ring, section.holes, topY, bottomY, colTop, S.tierWall, AO, maxErr, topN);
   }
 }
+function coplanarLevels(a, b) {
+  if (a === void 0 || b === void 0) return true;
+  return Math.abs(a - b) < 1e-3;
+}
 var ClaimedArea = class {
   constructor() {
     this.rings = [];
     this.boxes = [];
+    /** Constant deck height of each claim, or undefined when it is not level. */
+    this.levels = [];
   }
-  /** `ring` minus everything claimed so far; then claim what is returned. */
-  subtract(ring) {
+  /**
+   * `ring` minus everything claimed so far AT THE SAME HEIGHT; then claim it.
+   *
+   * `level` is the claim's constant deck height when it has one. Two decks only
+   * z-fight when they are coplanar, so only a coplanar claim may take ground
+   * away — an elevated box hanging over a ground-level section overlaps it in
+   * plan and must still draw its whole floor, or the box loses the part of its
+   * deck that shares a footprint with whatever is underneath it. Passing
+   * undefined (a surface with no single height) keeps the original
+   * clip-against-everything behaviour.
+   */
+  subtract(ring, level) {
     const closed = ring.map((p) => [p.x, p.y]);
     if (closed.length < 3) return [];
     closed.push(closed[0]);
     const box = bboxOfRing(ring);
-    const overlapping = this.rings.filter((_, i) => boxesOverlap(box, this.boxes[i]));
+    const overlapping = this.rings.filter((_, i) => boxesOverlap(box, this.boxes[i]) && coplanarLevels(level, this.levels[i]));
     let pieces = [[closed]];
     if (overlapping.length) {
       try {
@@ -2035,6 +2628,7 @@ var ClaimedArea = class {
     }
     this.rings.push([closed]);
     this.boxes.push(box);
+    this.levels.push(level);
     const out = [];
     for (const poly of pieces) {
       if (!poly.length) continue;
@@ -2127,11 +2721,27 @@ function shapePolygon(shape) {
   }
   return null;
 }
-function buildShape(builder, shape, base, S) {
+function buildShape(builder, shape, base, S, stages) {
   const poly = shapePolygon(shape);
   if (!poly) return;
   const isStage = shape.role === "stage";
   const height = isStage ? base + 1 : base + 0.25;
+  if (isStage && stages) {
+    let minX = Infinity, maxX = -Infinity, minZ = Infinity, maxZ = -Infinity;
+    for (const pt of poly) {
+      if (pt.x < minX) minX = pt.x;
+      if (pt.x > maxX) maxX = pt.x;
+      if (pt.y < minZ) minZ = pt.y;
+      if (pt.y > maxZ) maxZ = pt.y;
+    }
+    stages.push({
+      cx: (minX + maxX) / 2 * M,
+      cz: (minZ + maxZ) / 2 * M,
+      y: height,
+      halfX: Math.max((maxX - minX) / 2 * M, 0.5),
+      halfZ: Math.max((maxZ - minZ) / 2 * M, 0.5)
+    });
+  }
   const colTop = tintTop(hexToRgb(shape.fill), isStage ? S.stageTop : S.decorTop);
   const colWall = isStage ? S.stageWall : S.decorWall;
   extrudePrism(builder, poly, void 0, () => height, base, colTop, colWall, AO);
@@ -2241,6 +2851,7 @@ function buildSceneModel(input) {
   const sectionFills = resolveSectionFills(doc, seats);
   const catColor = /* @__PURE__ */ new Map();
   for (const c of doc.categories ?? []) catColor.set(c.key, c.color);
+  const stageBounds = [];
   const surfaces = buildVenueSurfaces(units, seats);
   const seatFloor = new Float32Array(seats.length);
   for (let unitIndex = 0; unitIndex < units.length; unitIndex++) {
@@ -2250,7 +2861,7 @@ function buildSceneModel(input) {
     const siblings = unit.objects.filter((o) => o.type === "section" && !!o.outline && o.outline.length >= 3);
     for (const o of unit.objects) {
       if (o.type === "section") buildTier(builder, o, unit, sectionFill(o, sectionFills), surfaces.bySection.get(o.id), claimed, siblings, S);
-      else if (o.type === "shape") buildShape(builder, o, unit.baseHeightM, S);
+      else if (o.type === "shape") buildShape(builder, o, unit.baseHeightM, S, stageBounds);
       else if (o.type === "gaArea") buildGa(builder, o, unit.baseHeightM, hexToRgb(catColor.get(o.categoryKey)), S);
       else if (o.type === "booth") buildBooth(builder, o, unit.baseHeightM, hexToRgb(catColor.get(o.categoryKey)), S);
       else if (o.type === "table") buildTable(builder, o, unit.baseHeightM, hexToRgb(catColor.get(o.categoryKey)), S);
@@ -2259,7 +2870,7 @@ function buildSceneModel(input) {
   }
   const focal = doc.focalPoint ?? { x: (fp.minX + fp.maxX) / 2, y: (fp.minY + fp.maxY) / 2 };
   const solids = mergeMeshData([builder.build()]);
-  const seatData = buildSeatInstances(seats, input.initialState, surfaces, seatFloor);
+  const seatData = buildSeatInstances(seats, input.initialState, surfaces, seatFloor, catColor);
   const zoneDefs = doc.zones ?? [];
   const zones = [];
   if (zoneDefs.length) {
@@ -2490,6 +3101,15 @@ function buildSceneModel(input) {
       });
     }
   }
+  seatData.iYaw = computeSeatYaw(
+    seatData.iPosition,
+    seats.length,
+    (i) => seats[i].rowId,
+    (i) => {
+      const f = units[seatFloor[i]]?.focal ?? focal;
+      return [f.x * M, f.y * M];
+    }
+  );
   const cx = (fp.minX + fp.maxX) / 2 * M;
   const cz = (fp.minY + fp.maxY) / 2 * M;
   const radius = 0.5 * Math.hypot((fp.maxX - fp.minX) * M, (fp.maxY - fp.minY) * M) || 10;
@@ -2503,6 +3123,7 @@ function buildSceneModel(input) {
     // Look-at target ~1.5 m up so a seated camera aims slightly down at the stage.
     focalWorld: [focal.x * M, 1.5, focal.y * M],
     zones,
+    stages: stageBounds,
     sections,
     labels,
     floors
@@ -2527,7 +3148,11 @@ var KIND_STYLE = {
 var DENSE_KINDS = /* @__PURE__ */ new Set(["row", "seat"]);
 var DENSE_SEPARATION = {
   row: { x: 62, y: 16 },
-  seat: { x: 24, y: 13 }
+  // Widened from 24: at close range seat labels stopped overlapping at all, so
+  // the separation had no work left to do and the budget was carrying the whole
+  // load. A wider box means the few labels that ARE kept are spread across the
+  // seating instead of clustering into one stack.
+  seat: { x: 46, y: 18 }
 };
 var LabelOverlay = class {
   constructor(container, opts = {}) {
@@ -2544,6 +3169,20 @@ var LabelOverlay = class {
     if (opts.fontFamily) s.fontFamily = opts.fontFamily;
     container.appendChild(this.root);
   }
+  /**
+   * Hide or show the whole overlay without disturbing which labels exist.
+   *
+   * The in-scene panorama sphere is GL, so it draws BEHIND every DOM label —
+   * row and seat labels floated on top of a 360 photo until this existed. The
+   * old DOM panorama never needed it because its opaque div covered them.
+   *
+   * Deliberately not `setLabels([])`: that destroys the nodes and the declutter
+   * state, so closing the panorama would rebuild and re-rank the whole overlay
+   * and flash. Visibility is a view concern, not a data one.
+   */
+  setVisible(visible) {
+    this.root.style.visibility = visible ? "" : "hidden";
+  }
   setLabels(labels) {
     this.labels = labels;
     for (const [id, node] of this.nodes) {
@@ -2558,7 +3197,7 @@ var LabelOverlay = class {
    *
    * `viewProjection` is column-major, as OGL supplies it.
    */
-  update(viewProjection, width, height, cameraDistance, venueRadius) {
+  update(viewProjection, width, height, cameraDistance, venueRadius, cameraWorld) {
     if (!this.labels.length) return;
     const kinds = visibleLabelKinds(cameraDistance, venueRadius);
     const candidates = [];
@@ -2566,15 +3205,24 @@ var LabelOverlay = class {
       if (!kinds.has(label.kind)) continue;
       const screen = projectToScreen(viewProjection, label.anchor, width, height);
       if (!screen.visible) continue;
-      candidates.push({ label, screen });
+      const world = cameraWorld ? Math.hypot(
+        label.anchor[0] - cameraWorld[0],
+        label.anchor[1] - cameraWorld[1],
+        label.anchor[2] - cameraWorld[2]
+      ) : 1;
+      candidates.push({ label, screen, focus: focusScore(screen, world, width, height) });
     }
     const structure = candidates.filter((c) => !DENSE_KINDS.has(c.label.kind));
     const kept = [
       ...cullOverlapping(structure, SEPARATION_X_PX, SEPARATION_Y_PX),
-      ...["row", "seat"].flatMap((kind) => cullOverlapping(
+      // The dense rungs are BUDGETED, not merely deduplicated — see
+      // DENSE_LABEL_BUDGET for why the overlap test alone gets worse the closer
+      // the camera gets.
+      ...["row", "seat"].flatMap((kind) => pickDenseLabels(
         candidates.filter((c) => c.label.kind === kind),
         DENSE_SEPARATION[kind].x,
-        DENSE_SEPARATION[kind].y
+        DENSE_SEPARATION[kind].y,
+        DENSE_LABEL_BUDGET[kind]
       ))
     ];
     const keptIds = new Set(kept.map((k) => k.label.id));
@@ -2623,6 +3271,13 @@ import { Geometry, Mesh, Transform } from "ogl";
 
 // src/view3d/scene/materials.ts
 import { Program } from "ogl";
+var CHAIR_WEIGHT_GLSL = (
+  /* glsl */
+  `
+float chairWeight(float depth) {
+  return 1.0 - smoothstep(uChairFull, uChairNone, depth);
+}`
+);
 var SOLID_VERT = (
   /* glsl */
   `#version 300 es
@@ -2702,14 +3357,23 @@ uniform float uSeatScale;
 uniform float uMinPixels;
 uniform float uPixelToWorld;   // (2*tan(fovY/2)) / viewportHeightPx
 uniform float uFocusFloor;     // -1 = show every floor
+uniform float uChairFull;      // view depth at which the chair mesh is full size
+uniform float uChairNone;      // ...and at which it has scaled away entirely
 out vec2 vUv;
 out vec3 vColor;
 out float vBudget;     // 1 = dot holds its minimum pixel size, <1 = it cannot
 out vec3 vRing;
 out float vDim;
+out float vDotWeight;  // 1 = the dot IS this seat, 0 = the chair has taken over
+${CHAIR_WEIGHT_GLSL}
 void main() {
   vec4 mv = modelViewMatrix * vec4(iOffset, 1.0);
   float depth = max(-mv.z, 0.001);
+  // Hand the seat over to the chair mesh as it comes into range. Derived from
+  // this instance's OWN depth rather than from a global uniform, so a row two
+  // metres away and the far side of the bowl resolve differently in the same
+  // frame \u2014 which is the entire point of a ladder over a switch.
+  vDotWeight = 1.0 - chairWeight(depth);
   float minR = uMinPixels * depth * uPixelToWorld;      // screen-space floor
   // Grow to hold the pixel floor, but never past this seat's own pitch ceiling:
   // unbounded growth is what merges neighbouring rows into one mass at range.
@@ -2743,6 +3407,7 @@ in vec3 vColor;
 in float vBudget;
 in vec3 vRing;
 in float vDim;
+in float vDotWeight;
 uniform float uSeatFade;      // fade toward tier colour with distance (LOD)
 uniform vec3 uFadeColor;
 out vec4 fragColor;
@@ -2767,9 +3432,173 @@ void main() {
   // Seats on an unfocused floor recede with their structure.
   c = mix(c, uFadeColor, vDim * 0.75);
   alpha *= mix(1.0, 0.30, vDim);
+  // Yield to the chair. The chair grows out of this exact point, so through the
+  // band the dot is always at least as big as the chair inside it and the seat
+  // never thins out to nothing in between.
+  alpha *= vDotWeight;
+  if (alpha <= 0.0) discard;
   fragColor = vec4(c, alpha);
 }`
 );
+var CHAIR_VERT = (
+  /* glsl */
+  `#version 300 es
+precision highp float;
+in vec3 position;      // local: x/z in units of the seat radius, y in METRES
+in vec3 normal;
+in float part;         // 0 = pedestal, 1 = pad, 2 = back, 3 = body, 4 = head
+in vec3 iOffset;       // per-instance world deck point (identical to the dot's)
+in vec3 iColor;        // per-instance state colour
+in float iRadius;      // per-instance horizontal half-width, world metres
+in float iYaw;         // per-instance facing, radians (local +Z -> facing dir)
+in vec3 iRing;         // accommodation ring colour; (0,0,0) = not accessible
+in float iFloor;
+in float iSeed;        // <0 = seat is empty; else per-person hash in [0,1)
+uniform mat4 modelViewMatrix;
+uniform mat4 projectionMatrix;
+uniform float uChairFull;
+uniform float uChairNone;
+uniform float uFocusFloor;
+uniform float uBackRake;   // metres of z per metre of rise, above uBackBase
+uniform float uBackBase;   // local height at which the back starts
+out vec3 vColor;
+out vec3 vNormalWorld;
+out vec3 vNormalView;
+out vec3 vPosView;
+out float vPart;
+out float vHeight;   // local height in metres, for the vertical occlusion ramp
+out vec3 vRing;
+out float vDim;
+out float vOccupant; // 1 = this vertex belongs to a person, not to the chair
+out vec3 vOccupantTint;
+${CHAIR_WEIGHT_GLSL}
+void main() {
+  vec4 anchor = modelViewMatrix * vec4(iOffset, 1.0);
+  float w = chairWeight(max(-anchor.z, 0.001));
+  // 1. Local units -> world metres. Only x/z scale: narrow rows get narrow
+  //    chairs, but nobody gets a short one (people are the same height at every
+  //    seat pitch).
+  vec3 p = position;
+  // The occupant. Parts 3 and 4 are a person; everything below is furniture.
+  //
+  // One instanced mesh draws both an empty seat and a taken one, because the
+  // alternative \u2014 a second geometry and a second draw call gathered per frame \u2014
+  // would double the near-field cost to show what is already known per instance.
+  // An unoccupied seat collapses its person to a point at the seat, which the
+  // rasteriser discards, exactly as the chair itself collapses at w=0.
+  float occupant = step(2.5, part);
+  float taken = step(0.0, iSeed);
+  vOccupant = occupant;
+  if (occupant > 0.5) {
+    if (taken < 0.5) {
+      p = vec3(0.0);          // empty seat: no person
+    } else {
+      // Vary the build so a sold-out row is people rather than a rank of
+      // identical mannequins: +/-6% height and +/-8% width off the hash.
+      p.y *= 0.94 + 0.12 * iSeed;
+      p.xz *= 0.92 + 0.16 * fract(iSeed * 7.13);
+    }
+  }
+  p.xz *= iRadius;
+  // 2. Lean the back. Done here rather than in the base mesh so the lean is a
+  //    real angle in METRES \u2014 baked into the mesh it would scale with the seat's
+  //    width and the same chair would lean 20 degrees on a wide stadium row and
+  //    6 on a tight theatre one.
+  // Only the BACK panel rakes. The old test (part > 1.5) meant "the back", and
+  // now also catches the occupant \u2014 leaning a person by the panel's rule would
+  // translate their head backwards by a rake measured from the panel's base.
+  float rake = (part > 1.5 && part < 2.5) ? max(p.y - uBackBase, 0.0) * uBackRake : 0.0;
+  p.z -= rake;
+  // 3. Scale-in. At w=0 the chair is a point at the seat, under a dot at full
+  //    opacity \u2014 which is what makes the handover invisible. sqrt front-loads
+  //    the growth so the chair is already near full size while the dot is still
+  //    half there; see chairScale() in lod.ts.
+  p *= sqrt(w);
+  float c = cos(iYaw), s = sin(iYaw);
+  vec3 rp = vec3(p.x * c + p.z * s, p.y, -p.x * s + p.z * c);
+  // Normals under the same two transforms, in reverse and inverted-transposed.
+  // The xz scale is non-uniform, so an axis-aligned normal does NOT survive it
+  // unchanged; and the rake is a shear, whose normal transform adds a y term.
+  // Skipping either lights the raked back as though it were still vertical.
+  vec3 n = vec3(normal.x / iRadius, normal.y, normal.z / iRadius);
+  if (part > 1.5 && part < 2.5) n.y += uBackRake * n.z;
+  n = normalize(n);
+  vec3 rn = vec3(n.x * c + n.z * s, n.y, -n.x * s + n.z * c);
+  vec4 mv = modelViewMatrix * vec4(iOffset + rp, 1.0);
+  vPosView = mv.xyz;
+  vNormalWorld = rn;
+  vNormalView = normalize(mat3(modelViewMatrix) * rn);
+  vColor = iColor;
+  // Occupant colour, resolved here so the fragment stage needs no extra
+  // varyings beyond this one. A person is NOT painted in the seat's state
+  // colour: a sold seat is red, and a hall of red people reads as a warning,
+  // not an audience. Hair/clothing for the body, a warm tone for the head,
+  // both varied by the same per-person hash.
+  float t = fract(iSeed * 3.71);
+  vec3 clothes = mix(vec3(0.13, 0.15, 0.20), vec3(0.34, 0.30, 0.36), t);
+  vec3 skin = mix(vec3(0.52, 0.38, 0.29), vec3(0.86, 0.70, 0.58), fract(iSeed * 11.3));
+  vOccupantTint = (part > 3.5) ? skin : clothes;
+  vPart = part;
+  vHeight = position.y;
+  vRing = iRing;
+  vDim = (uFocusFloor < -0.5 || abs(iFloor - uFocusFloor) < 0.5) ? 0.0 : 1.0;
+  gl_Position = projectionMatrix * mv;
+}`
+);
+var CHAIR_FRAG = (
+  /* glsl */
+  `#version 300 es
+precision highp float;
+in vec3 vColor;
+in vec3 vNormalWorld;
+in vec3 vNormalView;
+in vec3 vPosView;
+in float vPart;
+in float vHeight;
+in vec3 vRing;
+in float vDim;
+in float vOccupant;
+in vec3 vOccupantTint;
+uniform vec3 uKeyDir;
+uniform vec3 uFadeColor;
+out vec4 fragColor;
+void main() {
+  vec3 N = normalize(vNormalWorld);
+  vec3 V = normalize(-vPosView);
+  // The solids' rig, unchanged, so the chairs sit in the venue's light.
+  float hemi = 0.5 + 0.5 * N.y;
+  float key = max(dot(N, uKeyDir), 0.0);
+  vec3 fillDir = normalize(vec3(-uKeyDir.x, 0.25, -uKeyDir.z));
+  float fill = max(dot(N, fillDir), 0.0);
+  vec3 tint = vColor;
+  if (vOccupant > 0.5) tint = vOccupantTint;
+  // The accommodation ring, kept legible once the dot (which drew it) is gone:
+  // an accessible seat's PEDESTAL is painted in the ring colour, so the marker
+  // survives to close range instead of vanishing exactly when the buyer arrives.
+  float ringMask = step(0.001, dot(vRing, vRing));
+  if (vPart < 0.5 && ringMask > 0.5) tint = vRing;
+  // Pad brightest, back a step below it, pedestal darkest. Three untextured
+  // boxes only read as one object if they are separated tonally \u2014 with a single
+  // flat colour the chair silhouettes as a crate.
+  // A person is lit as a person, not as upholstery: no part shading, and less
+  // of the pad's sheen, so a head does not read as a polished box.
+  float partShade = vOccupant > 0.5 ? 0.95 : (vPart < 0.5 ? 0.50 : (vPart < 1.5 ? 1.10 : 0.80));
+  // Cheap vertical occlusion: a chair is in a dense row, so the closer a surface
+  // sits to the deck the less sky it can actually see. This is the depth cue \u2014
+  // without it the pad top, the back and the deck all resolve to the same flat
+  // value and the row loses its form entirely.
+  // Occupants rise above the 0.92 m chair back, so their ramp uses their own
+  // height or every head would clamp to full brightness and float.
+  float ao = mix(0.58, 1.0, clamp(vHeight / (vOccupant > 0.5 ? 1.30 : 0.92), 0.0, 1.0));
+  vec3 base = tint * partShade * ao * (0.52 + 0.40 * hemi) + tint * key * 0.38 + tint * fill * 0.10;
+  float fres = pow(1.0 - max(dot(normalize(vNormalView), V), 0.0), 3.0);
+  // A brighter rim than the solids get: it picks out every chair's own edge,
+  // which is what stops a block of them merging into one mass up close.
+  base += vec3(0.26, 0.31, 0.38) * fres * 0.55;
+  base = mix(base, uFadeColor, vDim * 0.75);
+  fragColor = vec4(base, 1.0);
+}`
+);
 var BG_VERT = (
   /* glsl */
   `#version 300 es
@@ -2866,7 +3695,7 @@ function createSeatPickProgram(gl) {
     uniforms: {
       uSeatRadius: { value: SEAT_DOT_RADIUS_M },
       uSeatScale: { value: 1 },
-      uMinPixels: { value: 2.5 },
+      uMinPixels: { value: SEAT_MIN_PIXELS_NEAR },
       uPixelToWorld: { value: 2e-3 }
     }
   });
@@ -2911,11 +3740,32 @@ function createSeatProgram(gl) {
     uniforms: {
       uSeatRadius: { value: SEAT_DOT_RADIUS_M },
       uSeatScale: { value: 1 },
-      uMinPixels: { value: 2.5 },
+      uMinPixels: { value: SEAT_MIN_PIXELS_NEAR },
       uPixelToWorld: { value: 2e-3 },
       uSeatFade: { value: 0 },
       uFocusFloor: { value: -1 },
-      uFadeColor: { value: new Float32Array([0.32, 0.37, 0.43]) }
+      uFadeColor: { value: new Float32Array([0.32, 0.37, 0.43]) },
+      uChairFull: { value: CHAIR_FULL_M },
+      uChairNone: { value: CHAIR_NONE_M }
+    }
+  });
+}
+function createChairProgram(gl) {
+  return new Program(gl, {
+    vertex: CHAIR_VERT,
+    fragment: CHAIR_FRAG,
+    transparent: false,
+    depthTest: true,
+    depthWrite: true,
+    cullFace: false,
+    uniforms: {
+      uKeyDir: { value: new Float32Array([0.38, 0.86, 0.34]) },
+      uFadeColor: { value: new Float32Array([0.32, 0.37, 0.43]) },
+      uChairFull: { value: CHAIR_FULL_M },
+      uChairNone: { value: CHAIR_NONE_M },
+      uBackRake: { value: BACK_RAKE_SLOPE },
+      uBackBase: { value: BACK_BASE_M },
+      uFocusFloor: { value: -1 }
     }
   });
 }
@@ -2934,12 +3784,13 @@ function createBackgroundProgram(gl, top, bottom) {
 }
 
 // src/view3d/scene/build.ts
-function writeSeatColors(iColor, iState, start, count, states) {
+function writeSeatColors(iColor, iState, start, count, states, iCategory) {
   for (let i = start; i < start + count; i++) {
-    const c = states[iState[i]] ?? states[0];
-    iColor[i * 3] = c[0];
-    iColor[i * 3 + 1] = c[1];
-    iColor[i * 3 + 2] = c[2];
+    const useCategory = iCategory && iState[i] === 0;
+    const c = useCategory ? null : states[iState[i]] ?? states[0];
+    iColor[i * 3] = c ? c[0] : iCategory[i * 3];
+    iColor[i * 3 + 1] = c ? c[1] : iCategory[i * 3 + 1];
+    iColor[i * 3 + 2] = c ? c[2] : iCategory[i * 3 + 2];
   }
 }
 var SEAT_QUAD = new Float32Array([-1, -1, 1, -1, 1, 1, -1, -1, 1, 1, -1, 1]);
@@ -2965,7 +3816,7 @@ function buildGpuScene(gl, model) {
   const seatProg = createSeatProgram(gl);
   const iColor = new Float32Array(model.seats.count * 3);
   const stateColors = SEAT_STATES.map((st) => model.theme.seatStates[st]);
-  writeSeatColors(iColor, model.seats.iState, 0, model.seats.count, stateColors);
+  writeSeatColors(iColor, model.seats.iState, 0, model.seats.count, stateColors, model.seats.iCategory);
   const seatGeo = new Geometry(gl, {
     position: { size: 2, data: SEAT_QUAD },
     iOffset: { size: 3, data: model.seats.iPosition, instanced: 1 },
@@ -2981,17 +3832,105 @@ function buildGpuScene(gl, model) {
   seatMesh.frustumCulled = false;
   if (model.seats.count > 0) seatMesh.setParent(main);
   const colorAttr = seatGeo.attributes.iColor;
-  return {
+  const chairBase = buildChairMesh();
+  const chairProg = createChairProgram(gl);
+  const CAP = CHAIR_MAX_INSTANCES;
+  const cOffset = new Float32Array(CAP * 3);
+  const cColor = new Float32Array(CAP * 3);
+  const cRadius = new Float32Array(CAP);
+  const cYaw = new Float32Array(CAP);
+  const cRing = new Float32Array(CAP * 3);
+  const cFloor = new Float32Array(CAP);
+  const cSeed = new Float32Array(CAP);
+  const chairGeo = new Geometry(gl, {
+    position: { size: 3, data: chairBase.position },
+    normal: { size: 3, data: chairBase.normal },
+    part: { size: 1, data: chairBase.part },
+    index: { data: chairBase.index },
+    iOffset: { size: 3, data: cOffset, instanced: 1 },
+    iColor: { size: 3, data: cColor, instanced: 1 },
+    iRadius: { size: 1, data: cRadius, instanced: 1 },
+    iYaw: { size: 1, data: cYaw, instanced: 1 },
+    iRing: { size: 3, data: cRing, instanced: 1 },
+    iFloor: { size: 1, data: cFloor, instanced: 1 },
+    iSeed: { size: 1, data: cSeed, instanced: 1 }
+  });
+  const chairMesh = new Mesh(gl, { geometry: chairGeo, program: chairProg });
+  chairMesh.frustumCulled = false;
+  let nearCount = 0;
+  let nearIndices = new Int32Array(0);
+  const writeChairColors = () => {
+    const src = model.seats;
+    for (let k = 0; k < nearCount; k++) {
+      const i = nearIndices[k];
+      const useCategory = src.iCategory && src.iState[i] === 0;
+      const c = useCategory ? null : stateColors[src.iState[i]] ?? stateColors[0];
+      if (c) {
+        cColor[k * 3] = c[0];
+        cColor[k * 3 + 1] = c[1];
+        cColor[k * 3 + 2] = c[2];
+      } else {
+        const u = upholsteryTone([src.iCategory[i * 3], src.iCategory[i * 3 + 1], src.iCategory[i * 3 + 2]]);
+        cColor[k * 3] = u[0];
+        cColor[k * 3 + 1] = u[1];
+        cColor[k * 3 + 2] = u[2];
+      }
+    }
+    chairGeo.attributes.iColor.needsUpdate = true;
+  };
+  const scene = {
     main,
     background,
     seatProgram: seatProg,
     solidProgram: solidProg,
+    chairProgram: chairProg,
     seatGeometry: seatGeo,
     solidGeometry: solidGeo,
     drawCalls: 3,
+    setNearSeats(indices, count) {
+      const n = Math.min(count, CAP);
+      nearIndices = indices;
+      nearCount = n;
+      if (n === 0) {
+        if (chairMesh.parent) chairMesh.setParent(null);
+        chairGeo.instancedCount = 0;
+        scene.drawCalls = 3;
+        return;
+      }
+      const src = model.seats;
+      for (let k = 0; k < n; k++) {
+        const i = indices[k];
+        cOffset[k * 3] = src.iPosition[i * 3];
+        cOffset[k * 3 + 1] = src.iPosition[i * 3 + 1];
+        cOffset[k * 3 + 2] = src.iPosition[i * 3 + 2];
+        cRadius[k] = src.iChairWidth[i];
+        cYaw[k] = src.iYaw[i];
+        cRing[k * 3] = src.iRing[i * 3];
+        cRing[k * 3 + 1] = src.iRing[i * 3 + 1];
+        cRing[k * 3 + 2] = src.iRing[i * 3 + 2];
+        cFloor[k] = src.iFloor[i];
+        cSeed[k] = seatOccupantSeed(src.iState[i], i);
+      }
+      writeChairColors();
+      chairGeo.attributes.iOffset.needsUpdate = true;
+      chairGeo.attributes.iRadius.needsUpdate = true;
+      chairGeo.attributes.iYaw.needsUpdate = true;
+      chairGeo.attributes.iRing.needsUpdate = true;
+      chairGeo.attributes.iFloor.needsUpdate = true;
+      chairGeo.attributes.iSeed.needsUpdate = true;
+      chairGeo.instancedCount = n;
+      if (!chairMesh.parent) chairMesh.setParent(main);
+      scene.drawCalls = 4;
+    },
+    nearSeatCount() {
+      return nearCount;
+    },
     uploadSeatStateRuns(runs) {
       if (!runs.length) return;
-      for (const run of runs) writeSeatColors(iColor, model.seats.iState, run.start, run.length, stateColors);
+      if (nearCount) writeChairColors();
+      for (const run of runs) {
+        writeSeatColors(iColor, model.seats.iState, run.start, run.length, stateColors, model.seats.iCategory);
+      }
       const buffer = colorAttr.buffer;
       if (!buffer) {
         colorAttr.needsUpdate = true;
@@ -3010,8 +3949,11 @@ function buildGpuScene(gl, model) {
       solidProg.remove();
       seatGeo.remove();
       seatProg.remove();
+      chairGeo.remove();
+      chairProg.remove();
     }
   };
+  return scene;
 }
 
 // src/view3d/pick/pickPipeline.ts
@@ -3494,6 +4436,317 @@ function mountPanorama(container, view, opts = {}) {
   };
 }
 
+// src/view3d/scene/panoSphere.ts
+import { Geometry as Geometry3, Mesh as Mesh3, Program as Program4, Texture } from "ogl";
+var PANO_SEGMENTS_LON = 64;
+var PANO_SEGMENTS_LAT = 32;
+var PANO_RADIUS_M = 500;
+function buildPanoSphere(segmentsLon = PANO_SEGMENTS_LON, segmentsLat = PANO_SEGMENTS_LAT, radius = PANO_RADIUS_M) {
+  const lonCount = segmentsLon + 1;
+  const latCount = segmentsLat + 1;
+  const vertexCount = lonCount * latCount;
+  const position = new Float32Array(vertexCount * 3);
+  const uv = new Float32Array(vertexCount * 2);
+  for (let iLat = 0; iLat < latCount; iLat++) {
+    const v = iLat / segmentsLat;
+    const polar = v * Math.PI;
+    const sinPolar = Math.sin(polar);
+    const cosPolar = Math.cos(polar);
+    for (let iLon = 0; iLon < lonCount; iLon++) {
+      const u = iLon / segmentsLon;
+      const azimuth = (u - 0.5) * Math.PI * 2;
+      const i = iLat * lonCount + iLon;
+      position[i * 3] = radius * sinPolar * Math.sin(azimuth);
+      position[i * 3 + 1] = radius * cosPolar;
+      position[i * 3 + 2] = -radius * sinPolar * Math.cos(azimuth);
+      uv[i * 2] = u;
+      uv[i * 2 + 1] = v;
+    }
+  }
+  const index = new Uint16Array(segmentsLon * segmentsLat * 6);
+  let w = 0;
+  for (let iLat = 0; iLat < segmentsLat; iLat++) {
+    for (let iLon = 0; iLon < segmentsLon; iLon++) {
+      const a = iLat * lonCount + iLon;
+      const b = a + lonCount;
+      index[w++] = a;
+      index[w++] = b;
+      index[w++] = a + 1;
+      index[w++] = a + 1;
+      index[w++] = b;
+      index[w++] = b + 1;
+    }
+  }
+  return { position, uv, index };
+}
+function bearingPitchToDirection(bearingDeg, pitchDeg) {
+  const yaw = bearingDeg * Math.PI / 180;
+  const pitch = pitchDeg * Math.PI / 180;
+  const cosPitch = Math.cos(pitch);
+  return [cosPitch * Math.sin(yaw), Math.sin(pitch), -cosPitch * Math.cos(yaw)];
+}
+var PANO_VERT = (
+  /* glsl */
+  `#version 300 es
+precision highp float;
+in vec3 position;
+in vec2 uv;
+uniform mat4 modelViewMatrix;
+uniform mat4 projectionMatrix;
+out vec2 vUv;
+void main() {
+  vUv = uv;
+  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
+}`
+);
+var PANO_FRAG = (
+  /* glsl */
+  `#version 300 es
+precision highp float;
+in vec2 vUv;
+uniform sampler2D uPano;
+uniform float uOpacity;
+out vec4 fragColor;
+void main() {
+  vec3 rgb = texture(uPano, vUv).rgb;
+  fragColor = vec4(rgb, uOpacity);
+}`
+);
+function createPanoSphere(gl, image) {
+  const { position, uv, index } = buildPanoSphere();
+  const geometry = new Geometry3(gl, {
+    position: { size: 3, data: position },
+    uv: { size: 2, data: uv },
+    index: { data: index }
+  });
+  const texture = new Texture(gl, {
+    image,
+    // The seam column is duplicated in geometry, so CLAMP is correct and avoids
+    // a wrapped bilinear tap bleeding the far edge of the image into it.
+    wrapS: gl.CLAMP_TO_EDGE,
+    wrapT: gl.CLAMP_TO_EDGE,
+    generateMipmaps: true,
+    // MUST be false, and this is the one line that decides whether the whole
+    // panorama is upside down.
+    //
+    // OGL defaults `flipY` to true for 2D textures, which is right for the usual
+    // case: a UV of 0 means the BOTTOM of a quad, an image's first row is its
+    // TOP, and flipping on upload reconciles the two. This sphere is the other
+    // case. Its `v` is authored in IMAGE space — v=0 is the top of the equirect
+    // and maps to the top of the sphere (`buildPanoSphere`, and the mapping
+    // `generatePanorama` and the 2D viewer both use). Flipping on upload as well
+    // applies the correction twice: the stadium pitch renders on the ceiling and
+    // the audience sits overhead.
+    //
+    // The geometry tests state the v mapping and pass either way — they never
+    // touch GL — so this is not something a unit test can defend. It was caught
+    // by looking at a stadium.
+    flipY: false
+  });
+  const program = new Program4(gl, {
+    vertex: PANO_VERT,
+    fragment: PANO_FRAG,
+    uniforms: { uPano: { value: texture }, uOpacity: { value: 0 } },
+    transparent: true,
+    depthTest: false,
+    depthWrite: false
+  });
+  const mesh = new Mesh3(gl, { geometry, program });
+  return {
+    mesh,
+    setOpacity(value) {
+      program.uniforms.uOpacity.value = Math.max(0, Math.min(1, value));
+    },
+    dispose() {
+      mesh.setParent(null);
+      geometry.remove();
+      if (texture.texture) gl.deleteTexture(texture.texture);
+      program.remove();
+    }
+  };
+}
+
+// src/view3d/crossfade/panoramaSphere.ts
+var DEG_PER_PX = 0.15;
+function loadImage(url) {
+  return new Promise((resolve, reject) => {
+    const img = new Image();
+    img.crossOrigin = "anonymous";
+    img.onload = () => resolve(img);
+    img.onerror = () => reject(new Error("panorama_image_failed"));
+    img.src = url;
+  });
+}
+async function mountPanoramaSphere(container, view, deps, opts = {}) {
+  const fadeMs = opts.fadeMs ?? 400;
+  let bearing = view?.initialBearingDeg ?? 0;
+  let pitch = 0;
+  let disposed = false;
+  if (!view && deps.focalWorld) {
+    const p = deps.camera.position;
+    const dx = deps.focalWorld[0] - p.x;
+    const dy = deps.focalWorld[1] - p.y;
+    const dz = deps.focalWorld[2] - p.z;
+    const flat = Math.hypot(dx, dz);
+    if (flat > 1e-3) {
+      bearing = Math.atan2(dx, -dz) * 180 / Math.PI;
+      pitch = Math.max(-MAX_PITCH_DEG, Math.min(MAX_PITCH_DEG, Math.atan2(dy, flat) * 180 / Math.PI));
+    }
+  }
+  let sphere = null;
+  if (view) {
+    let image;
+    try {
+      image = await loadImage(view.url);
+    } catch {
+      return null;
+    }
+    try {
+      sphere = createPanoSphere(deps.gl, image);
+    } catch {
+      return null;
+    }
+    sphere.mesh.renderOrder = 999;
+    sphere.mesh.setParent(deps.scene);
+  }
+  const priorFov = deps.camera.fov;
+  deps.camera.perspective({ fov: VFOV_DEG, aspect: deps.camera.aspect });
+  const priorQuat = deps.camera.quaternion.slice();
+  const aim = () => {
+    const p = deps.camera.position;
+    sphere?.mesh.position.set(p.x, p.y, p.z);
+    const [dx, dy, dz] = bearingPitchToDirection(bearing, pitch);
+    deps.camera.lookAt([p.x + dx, p.y + dy, p.z + dz]);
+    deps.requestRender();
+  };
+  aim();
+  const root = document.createElement("div");
+  root.setAttribute("role", "dialog");
+  root.setAttribute("aria-label", opts.seatLabel ? `View from ${opts.seatLabel}` : "View from seat");
+  Object.assign(root.style, {
+    position: "absolute",
+    inset: "0",
+    zIndex: "10",
+    cursor: "grab",
+    touchAction: "none"
+  });
+  const closeBtn = document.createElement("button");
+  closeBtn.type = "button";
+  closeBtn.setAttribute("aria-label", "Close");
+  closeBtn.textContent = "\u2715";
+  Object.assign(closeBtn.style, {
+    position: "absolute",
+    top: "12px",
+    right: "12px",
+    zIndex: "2",
+    width: "34px",
+    height: "34px",
+    borderRadius: "999px",
+    cursor: "pointer",
+    border: "1px solid rgba(255,255,255,0.25)",
+    background: "rgba(8,12,18,0.6)",
+    color: "#e6edf3",
+    fontSize: "15px",
+    lineHeight: "1"
+  });
+  root.appendChild(closeBtn);
+  const hint = document.createElement("div");
+  hint.textContent = "Drag to look around \xB7 Esc to close";
+  Object.assign(hint.style, {
+    position: "absolute",
+    bottom: "12px",
+    left: "0",
+    right: "0",
+    textAlign: "center",
+    color: "rgba(230,237,243,0.7)",
+    font: "12px ui-sans-serif, system-ui, sans-serif",
+    pointerEvents: "none"
+  });
+  root.appendChild(hint);
+  container.appendChild(root);
+  let dragging = false;
+  let lastX = 0;
+  let lastY = 0;
+  const onDown = (e) => {
+    if (e.target === closeBtn) return;
+    dragging = true;
+    lastX = e.clientX;
+    lastY = e.clientY;
+    root.setPointerCapture?.(e.pointerId);
+    root.style.cursor = "grabbing";
+  };
+  const onMove = (e) => {
+    if (!dragging) return;
+    bearing += (e.clientX - lastX) * DEG_PER_PX;
+    pitch = Math.max(-MAX_PITCH_DEG, Math.min(MAX_PITCH_DEG, pitch + (e.clientY - lastY) * DEG_PER_PX));
+    lastX = e.clientX;
+    lastY = e.clientY;
+    aim();
+  };
+  const onUp = () => {
+    dragging = false;
+    root.style.cursor = "grab";
+  };
+  root.addEventListener("pointerdown", onDown);
+  root.addEventListener("pointermove", onMove);
+  root.addEventListener("pointerup", onUp);
+  root.addEventListener("pointercancel", onUp);
+  const onKey = (e) => {
+    if (e.key !== "Escape" || disposed) return;
+    e.stopPropagation();
+    handle.close();
+  };
+  window.addEventListener("keydown", onKey);
+  let raf = 0;
+  const fadeTo = (target, done) => {
+    if (!sphere) {
+      done?.();
+      return;
+    }
+    const from = target === 1 ? 0 : 1;
+    const start = performance.now();
+    const step = () => {
+      if (disposed) return;
+      const t = fadeMs <= 0 ? 1 : Math.min(1, (performance.now() - start) / fadeMs);
+      sphere?.setOpacity(from + (target - from) * t);
+      deps.requestRender();
+      if (t < 1) raf = requestAnimationFrame(step);
+      else done?.();
+    };
+    raf = requestAnimationFrame(step);
+  };
+  fadeTo(1);
+  const teardown = () => {
+    if (disposed) return;
+    disposed = true;
+    cancelAnimationFrame(raf);
+    root.removeEventListener("pointerdown", onDown);
+    root.removeEventListener("pointermove", onMove);
+    root.removeEventListener("pointerup", onUp);
+    root.removeEventListener("pointercancel", onUp);
+    window.removeEventListener("keydown", onKey);
+    root.remove();
+    sphere?.dispose();
+    deps.camera.perspective({ fov: priorFov, aspect: deps.camera.aspect });
+    deps.camera.quaternion.set(priorQuat[0], priorQuat[1], priorQuat[2], priorQuat[3]);
+    deps.requestRender();
+  };
+  const handle = {
+    close() {
+      if (disposed) return;
+      const finish = () => {
+        teardown();
+        opts.onClose?.();
+      };
+      cancelAnimationFrame(raf);
+      fadeTo(0, finish);
+    },
+    dispose: teardown
+  };
+  closeBtn.addEventListener("click", () => handle.close());
+  return handle;
+}
+
 // src/view3d/analytics.ts
 var now = () => typeof performance !== "undefined" && performance.now ? performance.now() : Date.now();
 var Analytics3D = class {
@@ -3579,6 +4832,28 @@ function mountVenue3D(container, input, opts = {}) {
     gpu.seatProgram.uniforms.uSeatRadius.value = SEAT_DOT_RADIUS_M * model.theme.seatScale;
     gpu.seatProgram.uniforms.uFocusFloor.value = focusedFloor;
     gpu.solidProgram.uniforms.uFocusFloor.value = focusedFloor;
+    gpu.chairProgram.uniforms.uFocusFloor.value = focusedFloor;
+    lastGatherX = Infinity;
+  };
+  const nearIndex = new NearFieldIndex(model.seats.iPosition, model.seats.count);
+  const nearBuf = new Int32Array(CHAIR_MAX_INSTANCES);
+  let lastGatherX = Infinity;
+  let lastGatherZ = Infinity;
+  const updateNearField = () => {
+    if (!gpu) return;
+    const cam = orbit.camera.position;
+    const moved2 = Math.hypot(cam.x - lastGatherX, cam.z - lastGatherZ);
+    if (moved2 < CHAIR_REBUILD_M) return;
+    lastGatherX = cam.x;
+    lastGatherZ = cam.z;
+    const outside = Math.hypot(cam.x - model.bounds.center[0], cam.z - model.bounds.center[2]) - model.bounds.radius;
+    if (outside > CHAIR_GATHER_M) {
+      if (gpu.nearSeatCount()) gpu.setNearSeats(nearBuf, 0);
+      return;
+    }
+    const n = nearIndex.gather(cam.x, cam.z, CHAIR_GATHER_M, nearBuf);
+    if (n === 0 && gpu.nearSeatCount() === 0) return;
+    gpu.setNearSeats(nearBuf, n);
   };
   const glctx = new GLContext(container, {
     onContextLost: () => {
@@ -3625,7 +4900,9 @@ function mountVenue3D(container, input, opts = {}) {
     const u = gpu.seatProgram.uniforms;
     u.uSeatScale.value = lod.scale;
     u.uSeatFade.value = lod.fade;
+    u.uMinPixels.value = lod.minPixels;
     u.uPixelToWorld.value = 2 * Math.tan(orbit.camera.fov * DEG2 / 2) / Math.max(1, glctx.pixelHeight);
+    updateNearField();
     glctx.renderer.render({ scene: gpu.background, clear: true });
     glctx.renderer.render({ scene: gpu.main, camera: orbit.camera, clear: false });
     labelOverlay.update(
@@ -3633,7 +4910,10 @@ function mountVenue3D(container, input, opts = {}) {
       glctx.canvas.clientWidth || 1,
       glctx.canvas.clientHeight || 1,
       orbit.currentDistance,
-      model.bounds.radius
+      model.bounds.radius,
+      // The dense label rungs rank by real distance from the eye, not by the
+      // orbit radius — at the arrival pose those are wildly different numbers.
+      [orbit.camera.position.x, orbit.camera.position.y, orbit.camera.position.z]
     );
     return moving;
   });
@@ -3741,7 +5021,7 @@ function mountVenue3D(container, input, opts = {}) {
     zIndex: "4"
   });
   overviewChip.addEventListener("click", () => {
-    if (disposed || frozen) return;
+    if (disposed || frozen || panorama) return;
     cancelFlight();
     removeArriveChip();
     orbit.frameSoft(model.bounds, stageAzimuth);
@@ -3769,18 +5049,36 @@ function mountVenue3D(container, input, opts = {}) {
     }
     if (disposed || gen !== flightGen) return;
     removeArriveChip();
-    panorama = mountPanorama(container, view, {
-      fadeMs,
-      seatLabel: seatId,
-      onClose: () => {
-        panorama = null;
-        frozen = false;
-        analytics.panoramaClosed();
-        orbit.resumeAfterFlight(model.focalWorld);
-        loop.requestRender();
-        showArriveChip(seatId, flightGen);
-      }
-    });
+    const onClose = () => {
+      panorama = null;
+      labelOverlay.setVisible(true);
+      frozen = false;
+      analytics.panoramaClosed();
+      orbit.resumeAfterFlight(model.focalWorld);
+      loop.requestRender();
+      showArriveChip(seatId, flightGen);
+    };
+    const sceneMode = view.generated === true;
+    const spherical = gpu && !contextLost ? await mountPanoramaSphere(container, sceneMode ? null : view, {
+      gl: glctx.gl,
+      scene: gpu.main,
+      camera: orbit.camera,
+      requestRender: () => loop.requestRender(),
+      focalWorld: model.focalWorld
+    }, { fadeMs, seatLabel: seatId, onClose }) : null;
+    if (disposed || gen !== flightGen) {
+      spherical?.dispose();
+      return;
+    }
+    if (spherical) {
+      orbit.syncFromCamera();
+      labelOverlay.setVisible(false);
+      frozen = false;
+      loop.requestRender();
+      panorama = spherical;
+    } else {
+      panorama = mountPanorama(container, view, { fadeMs, seatLabel: seatId, onClose });
+    }
     analytics.panoramaOpened();
   };
   const cancelFlight = () => {
@@ -3906,6 +5204,7 @@ function mountVenue3D(container, input, opts = {}) {
       if (gpu) {
         gpu.seatProgram.uniforms.uFocusFloor.value = value;
         gpu.solidProgram.uniforms.uFocusFloor.value = value;
+        gpu.chairProgram.uniforms.uFocusFloor.value = value;
       }
       focusedFloor = value;
       if (index !== null) {