@seatlayer/core 0.46.0 → 0.47.1

package/dist/view3d/index.cjs

@@ -31,7 +31,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var view3d_exports = {};
 __export(view3d_exports, {
   buildSceneModel: () => buildSceneModel,
-  mountVenue3D: () => mountVenue3D
+  mountVenue3D: () => mountVenue3D,
+  prepareVenue3D: () => prepareVenue3D
 });
 module.exports = __toCommonJS(view3d_exports);
 var import_ogl8 = require("ogl");
@@ -134,6 +135,12 @@ var GLContext = class {
     this.canvas.style.width = "100%";
     this.canvas.style.height = "100%";
     this.canvas.style.touchAction = "none";
+    this.canvas.tabIndex = 0;
+    this.canvas.setAttribute("role", "application");
+    this.canvas.setAttribute(
+      "aria-label",
+      "Interactive 3D venue. Drag or use arrow keys to look around; pinch, scroll, plus or minus to zoom."
+    );
     this.renderer = new import_ogl.Renderer({
       canvas: this.canvas,
       dpr: computeDpr(),
@@ -242,6 +249,10 @@ var OrbitCamera = class {
     /** Venue centre + radius, so pan can be clamped to somewhere still useful. */
     this.panAnchor = new import_ogl2.Vec3();
     this.panLimit = 0;
+    /** What an unmodified primary-button / one-finger drag does. Section drill-in
+     * switches this to pan so a buyer can slide hidden seats into view without
+     * discovering a modifier gesture. Shift temporarily inverts the mode. */
+    this.primaryDragMode = "orbit";
     this.camera = new import_ogl2.Camera(gl, { fov: FOV, near: 0.1, far: 5e3, aspect: 1 });
     this.canvas = canvas;
     this.requestRender = requestRender;
@@ -253,7 +264,9 @@ var OrbitCamera = class {
       }
       this.activePointers.set(e.pointerId, { x: e.clientX, y: e.clientY });
       if (this.activePointers.size === 1) {
-        this.panning = e.button === 2 || e.button === 1 || e.shiftKey;
+        const secondaryPan = e.button === 2 || e.button === 1;
+        const primaryPan = e.button === 0 && (e.shiftKey ? this.primaryDragMode === "orbit" : this.primaryDragMode === "pan");
+        this.panning = secondaryPan || primaryPan;
         this.dragging = !this.panning;
         this.lastX = e.clientX;
         this.lastY = e.clientY;
@@ -319,15 +332,38 @@ var OrbitCamera = class {
     this.onWheel = (e) => {
       e.preventDefault();
       const unit = e.deltaMode === 1 ? 16 : e.deltaMode === 2 ? 100 : 1;
-      const norm2 = e.deltaY * unit / 100;
-      this.dollyBy(Math.exp(norm2 * 0.4));
+      const norm2 = Math.max(-2, Math.min(2, e.deltaY * unit / 100));
+      this.dollyBy(Math.exp(norm2 * 0.22));
+      this.fireGesture();
+    };
+    this.onKeyDown = (e) => {
+      const step = 7 * DEG;
+      if (e.shiftKey && (e.key === "ArrowLeft" || e.key === "ArrowRight" || e.key === "ArrowUp" || e.key === "ArrowDown")) {
+        this.panBy(
+          e.key === "ArrowLeft" ? -32 : e.key === "ArrowRight" ? 32 : 0,
+          e.key === "ArrowUp" ? -32 : e.key === "ArrowDown" ? 32 : 0
+        );
+      } else if (e.key === "ArrowLeft" || e.key === "ArrowRight") {
+        this.azT += e.key === "ArrowLeft" ? -step : step;
+      } else if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+        this.polT = Math.max(POLAR_MIN, Math.min(POLAR_MAX, this.polT + (e.key === "ArrowUp" ? -step : step)));
+      } else if (e.key === "+" || e.key === "=") {
+        this.dollyBy(0.82);
+      } else if (e.key === "-" || e.key === "_") {
+        this.dollyBy(1.22);
+      } else {
+        return;
+      }
+      e.preventDefault();
       this.fireGesture();
+      this.requestRender();
     };
     canvas.addEventListener("pointerdown", this.onPointerDown);
     canvas.addEventListener("pointermove", this.onPointerMove);
     canvas.addEventListener("pointerup", this.onPointerUp);
     canvas.addEventListener("pointercancel", this.onPointerUp);
     canvas.addEventListener("wheel", this.onWheel, { passive: false });
+    canvas.addEventListener("keydown", this.onKeyDown);
     canvas.addEventListener("contextmenu", this.onContextMenu);
   }
   pinchCentroid() {
@@ -395,20 +431,32 @@ var OrbitCamera = class {
     this.distT = Math.max(this.minDist, Math.min(this.maxDist, this.distT * factor));
     this.requestRender();
   }
+  /** Programmatic zoom used by the visible camera controls. Keeping it on the
+   * same dolly path as wheel, pinch and keyboard preserves all distance limits. */
+  zoomBy(factor) {
+    this.dollyBy(factor);
+    this.fireGesture();
+  }
+  /** Choose what a normal left/one-finger drag does. Shift temporarily performs
+   * the other action. This is intentionally public so the view can make the
+   * currently active gesture visible rather than hiding it in documentation. */
+  setPrimaryDragMode(mode) {
+    this.primaryDragMode = mode;
+  }
   /**
    * Fit a flattering 3/4 view to the bounds sphere. With `intro`, the camera
    * STARTS nearly top-down (matching the 2D map's orientation) and further out,
    * then the damped `update()` eases it up into the 3/4 architectural angle and
    * dollies in — the venue "stands up" instead of teleporting (~600ms).
    */
-  frame(bounds, intro = false, stageAzimuth) {
+  frame(bounds, intro = false, stageAzimuth, portraitCrop = false) {
     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;
+    const aspect = portraitCrop ? Math.max(0.82, this.camera.aspect || 1) : this.camera.aspect || 1;
     const halfH = Math.atan(Math.tan(halfV) * aspect);
     const fit = Math.max(r / Math.tan(halfV), r / Math.tan(halfH));
     this.azT = stageAzimuth ?? -30 * DEG;
@@ -435,7 +483,7 @@ var OrbitCamera = class {
    * seat, behind the shell, anywhere): re-pivot on the venue centre without
    * moving the camera, then glide targets back to the 3/4 architectural pose.
    */
-  frameSoft(bounds, stageAzimuth) {
+  frameSoft(bounds, stageAzimuth, portraitCrop = false) {
     this.target.set(bounds.center[0], bounds.center[1], bounds.center[2]);
     this.targetT.copy(this.target);
     this.panAnchor.copy(this.target);
@@ -444,7 +492,7 @@ var OrbitCamera = class {
     this.camera.perspective({ fov: this.fovY, aspect: this.camera.aspect });
     const r = Math.max(1, bounds.radius);
     const halfV = this.fovY * DEG / 2;
-    const aspect = this.camera.aspect || 1;
+    const aspect = portraitCrop ? Math.max(0.82, this.camera.aspect || 1) : this.camera.aspect || 1;
     const halfH = Math.atan(Math.tan(halfV) * aspect);
     const fit = Math.max(r / Math.tan(halfV), r / Math.tan(halfH));
     this.azT = stageAzimuth ?? this.azimuth;
@@ -517,6 +565,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("keydown", this.onKeyDown);
     this.canvas.removeEventListener("contextmenu", this.onContextMenu);
     this.activePointers.clear();
   }
@@ -731,7 +780,10 @@ var SURROUNDINGS_SHAPE_ROLES = [
   "sound",
   "concession",
   "coat",
-  "wall"
+  "wall",
+  "rail",
+  "suite",
+  "obstruction"
 ];
 var SURROUNDINGS_SHAPE_ROLE_SET = new Set(SURROUNDINGS_SHAPE_ROLES);
 
@@ -1455,6 +1507,7 @@ function buildSeatInstances(seats, initial, surfaces, seatFloor, categoryColor)
   const iCategory = new Float32Array(count * 3);
   const iMaxRadius = new Float32Array(count);
   const iChairWidth = new Float32Array(count);
+  const iPhysicalSeat = new Float32Array(count);
   const iRing = new Float32Array(count * 3);
   const idToIndex = /* @__PURE__ */ new Map();
   const spacing = nearestNeighbourSpacing(seats);
@@ -1464,6 +1517,7 @@ function buildSeatInstances(seats, initial, surfaces, seatFloor, categoryColor)
     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);
+    iPhysicalSeat[i] = seat.wheelchairSpaceType === "no-seat" ? 0 : 1;
     iPosition[i * 3] = seat.x * M;
     iPosition[i * 3 + 1] = surfaces ? surfaces.seatDeckY(i) : seatSurfaceY(seat);
     iPosition[i * 3 + 2] = seat.y * M;
@@ -1491,6 +1545,7 @@ function buildSeatInstances(seats, initial, surfaces, seatFloor, categoryColor)
     iRing,
     idToIndex,
     iChairWidth,
+    iPhysicalSeat,
     iFloor: seatFloor ?? new Float32Array(count),
     iYaw: new Float32Array(count)
   };
@@ -2893,15 +2948,22 @@ function buildVenueSurfaces(units, seats) {
 }
 
 // src/view3d/scene/sceneModel.ts
-function floorUnits(doc) {
+function shapeVisibleInConfiguration(shape, activeConfigurationId) {
+  const ids = shape.eventConfigurationIds;
+  return !ids?.length || !!activeConfigurationId && ids.includes(activeConfigurationId);
+}
+function visibleObjects(objects, activeConfigurationId) {
+  return objects.filter((object) => object.type !== "shape" || shapeVisibleInConfiguration(object, activeConfigurationId));
+}
+function floorUnits(doc, activeConfigurationId) {
   if (doc.floors?.length) {
     return doc.floors.map((f) => ({
-      objects: f.objects,
+      objects: visibleObjects(f.objects, activeConfigurationId),
       focal: f.focalPoint ?? doc.focalPoint,
       baseHeightM: f.baseHeightM ?? 0
     }));
   }
-  return [{ objects: doc.objects, focal: doc.focalPoint, baseHeightM: 0 }];
+  return [{ objects: visibleObjects(doc.objects, activeConfigurationId), focal: doc.focalPoint, baseHeightM: 0 }];
 }
 var AO = { top: 1, wallBottom: 0.5, bottomCap: 0.4 };
 function tintTop(fill, neutral) {
@@ -3182,23 +3244,114 @@ function buildTable(builder, table, base, fill, S) {
     AO
   );
 }
+function rotateShapePolygon(poly, degrees) {
+  if (!degrees) return poly;
+  let minX = Infinity, maxX = -Infinity, minY = Infinity, maxY = -Infinity;
+  for (const point of poly) {
+    minX = Math.min(minX, point.x);
+    maxX = Math.max(maxX, point.x);
+    minY = Math.min(minY, point.y);
+    maxY = Math.max(maxY, point.y);
+  }
+  const cx = (minX + maxX) / 2, cy = (minY + maxY) / 2;
+  const radians = degrees * Math.PI / 180;
+  const cos = Math.cos(radians), sin = Math.sin(radians);
+  return poly.map((point) => {
+    const dx = point.x - cx, dy = point.y - cy;
+    return { x: cx + dx * cos - dy * sin, y: cy + dx * sin + dy * cos };
+  });
+}
 function shapePolygon(shape) {
-  if (shape.kind === "polygon" && shape.points && shape.points.length >= 3) return shape.points;
+  let poly = null;
+  if (shape.kind === "polygon" && shape.points && shape.points.length >= 3) poly = shape.points;
   if (shape.kind === "rect" && shape.width && shape.height) {
-    return rectPolygon(shape.x ?? 0, shape.y ?? 0, shape.width, shape.height);
+    poly = rectPolygon(shape.x ?? 0, shape.y ?? 0, shape.width, shape.height);
   }
   if (shape.kind === "ellipse" && shape.width && shape.height) {
     const cx = (shape.x ?? 0) + shape.width / 2;
     const cy = (shape.y ?? 0) + shape.height / 2;
-    return ellipsePolygon(cx, cy, shape.width / 2, shape.height / 2);
+    poly = ellipsePolygon(cx, cy, shape.width / 2, shape.height / 2);
+  }
+  return poly ? rotateShapePolygon(poly, shape.rotation) : null;
+}
+function architectureForShape(shape) {
+  const role = shape.role ?? "";
+  const defaults = {
+    stage: { kind: "stage", heightM: 1 },
+    entrance: { kind: "portal", heightM: 2.7 },
+    exit: { kind: "portal", heightM: 2.7 },
+    screen: { kind: "solid", heightM: 6 },
+    wall: { kind: "solid", heightM: 2.8 },
+    rail: { kind: "solid", heightM: 1.1 },
+    suite: { kind: "suite", heightM: 3 },
+    obstruction: { kind: "solid", heightM: 4.5 },
+    sound: { kind: "solid", heightM: 1.45 },
+    restroom: { kind: "solid", heightM: 2.4 },
+    bar: { kind: "solid", heightM: 1.1 },
+    concession: { kind: "solid", heightM: 1.1 },
+    coat: { kind: "solid", heightM: 1.1 }
+  };
+  const resolved = defaults[role] ?? { kind: "plate", heightM: 0.25 };
+  return { ...resolved, heightM: shape.heightM ?? resolved.heightM };
+}
+var SHAPE_LAYER_LIFT_M = 0.08;
+function claimShapeTopOffset(shape, claimed) {
+  const poly = shapePolygon(shape);
+  const architecture = architectureForShape(shape);
+  const defaultTop = architecture.heightM;
+  if (!poly) return defaultTop;
+  if (architecture.kind !== "plate" && architecture.kind !== "stage") return defaultTop;
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+  for (const p of poly) {
+    minX = Math.min(minX, p.x);
+    minY = Math.min(minY, p.y);
+    maxX = Math.max(maxX, p.x);
+    maxY = Math.max(maxY, p.y);
+  }
+  let topOffsetM = defaultTop;
+  for (const prior of claimed) {
+    const overlaps = maxX > prior.minX && minX < prior.maxX && maxY > prior.minY && minY < prior.maxY;
+    if (overlaps && topOffsetM <= prior.topOffsetM + 1e-6) {
+      topOffsetM = prior.topOffsetM + SHAPE_LAYER_LIFT_M;
+    }
   }
-  return null;
+  claimed.push({ minX, minY, maxX, maxY, topOffsetM });
+  return topOffsetM;
 }
-function buildShape(builder, shape, base, S, stages) {
+function lerpPoint(a, b, t) {
+  return { x: a.x + (b.x - a.x) * t, y: a.y + (b.y - a.y) * t };
+}
+function orientQuadLong(poly) {
+  if (poly.length !== 4) return poly;
+  const edge0 = Math.hypot(poly[1].x - poly[0].x, poly[1].y - poly[0].y);
+  const edge1 = Math.hypot(poly[2].x - poly[1].x, poly[2].y - poly[1].y);
+  return edge0 >= edge1 ? poly : [poly[1], poly[2], poly[3], poly[0]];
+}
+function quadWidthSlice(poly, t0, t1) {
+  return [
+    lerpPoint(poly[0], poly[1], t0),
+    lerpPoint(poly[0], poly[1], t1),
+    lerpPoint(poly[3], poly[2], t1),
+    lerpPoint(poly[3], poly[2], t0)
+  ];
+}
+function quadDepthSlice(poly, t0, t1) {
+  return [
+    lerpPoint(poly[0], poly[3], t0),
+    lerpPoint(poly[1], poly[2], t0),
+    lerpPoint(poly[1], poly[2], t1),
+    lerpPoint(poly[0], poly[3], t1)
+  ];
+}
+function emitArchitecturalPrism(builder, poly, top, bottom, colTop, colWall) {
+  extrudePrism(builder, poly, void 0, () => top, bottom, colTop, colWall, AO);
+}
+function buildShape(builder, shape, base, topOffsetM, S, focal, stages) {
   const poly = shapePolygon(shape);
   if (!poly) return;
   const isStage = shape.role === "stage";
-  const height = isStage ? base + 1 : base + 0.25;
+  const architecture = architectureForShape(shape);
+  const height = base + topOffsetM;
   if (isStage && stages) {
     let minX = Infinity, maxX = -Infinity, minZ = Infinity, maxZ = -Infinity;
     for (const pt of poly) {
@@ -3216,8 +3369,29 @@ function buildShape(builder, shape, base, S, stages) {
     });
   }
   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);
+  const colWall = isStage ? S.stageWall : shape.role === "screen" ? [0.24, 0.46, 0.82] : tintTop(hexToRgb(shape.fill), S.decorWall);
+  if (architecture.kind === "portal" && poly.length === 4) {
+    const quad = orientQuadLong(poly);
+    emitArchitecturalPrism(builder, quadWidthSlice(quad, 0, 0.16), height, base, colTop, colWall);
+    emitArchitecturalPrism(builder, quadWidthSlice(quad, 0.84, 1), height, base, colTop, colWall);
+    emitArchitecturalPrism(builder, quad, height, Math.max(base, height - 0.35), colTop, colWall);
+    return;
+  }
+  if (architecture.kind === "suite" && poly.length === 4) {
+    const edgeDistances = poly.map((point, index) => {
+      const next = poly[(index + 1) % 4];
+      const mx = (point.x + next.x) / 2, my = (point.y + next.y) / 2;
+      return Math.hypot(mx - focal.x, my - focal.y);
+    });
+    const front = edgeDistances.indexOf(Math.min(...edgeDistances));
+    const quad = [0, 1, 2, 3].map((offset) => poly[(front + offset) % 4]);
+    emitArchitecturalPrism(builder, quadWidthSlice(quad, 0, 0.08), height, base, colTop, colWall);
+    emitArchitecturalPrism(builder, quadWidthSlice(quad, 0.92, 1), height, base, colTop, colWall);
+    emitArchitecturalPrism(builder, quadDepthSlice(quad, 0.88, 1), height, base, colTop, colWall);
+    emitArchitecturalPrism(builder, quad, height, Math.max(base, height - 0.18), colTop, colWall);
+    return;
+  }
+  emitArchitecturalPrism(builder, poly, height, base, colTop, colWall);
 }
 function decorPolygon(decor) {
   const { x, y, width, height } = decor;
@@ -3315,7 +3489,7 @@ function buildSceneModel(input) {
   const { doc, seats } = input;
   const theme = resolveTheme3D(doc.theme);
   const S = theme.structure;
-  const units = floorUnits(doc);
+  const units = floorUnits(doc, input.eventConfigurationId ?? doc.eventConfigurationId);
   const builder = new MeshBuilder();
   const fp = chartFootprint(units, seats);
   const padU = Math.max(60, (fp.maxX - fp.minX + fp.maxY - fp.minY) * 0.06);
@@ -3331,10 +3505,19 @@ function buildSceneModel(input) {
     const unit = units[unitIndex];
     builder.setFloor(unitIndex);
     const claimed = new ClaimedArea();
+    const claimedShapeLayers = [];
     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, stageBounds);
+      else if (o.type === "shape") buildShape(
+        builder,
+        o,
+        unit.baseHeightM,
+        claimShapeTopOffset(o, claimedShapeLayers),
+        S,
+        unit.focal,
+        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);
@@ -3404,6 +3587,7 @@ function buildSceneModel(input) {
   }
   const labels = [];
   const sections = [];
+  const rows = [];
   for (const z of zones) {
     if (z.seatCount === 0) continue;
     labels.push({
@@ -3500,6 +3684,49 @@ function buildSceneModel(input) {
         anchor: [end.seat.x * M, surfaces.seatDeckY(end.index) + ROW_LABEL_LIFT_M, end.seat.y * M]
       });
     }
+    const rowAcc = /* @__PURE__ */ new Map();
+    for (let i = 0; i < seats.length; i++) {
+      const seat = seats[i];
+      const cut = seat.label ? seat.label.lastIndexOf("-") : -1;
+      let acc = rowAcc.get(seat.rowId);
+      if (!acc) {
+        acc = {
+          n: 0,
+          x: 0,
+          y: 0,
+          z: 0,
+          minX: Infinity,
+          maxX: -Infinity,
+          minZ: Infinity,
+          maxZ: -Infinity,
+          label: cut > 0 ? seat.label.slice(0, cut) : seat.rowId,
+          sectionId: seat.sectionId
+        };
+        rowAcc.set(seat.rowId, acc);
+      }
+      const offset = i * 3;
+      const x = seatData.iPosition[offset];
+      const y = seatData.iPosition[offset + 1];
+      const z = seatData.iPosition[offset + 2];
+      acc.n++;
+      acc.x += x;
+      acc.y += y;
+      acc.z += z;
+      acc.minX = Math.min(acc.minX, x);
+      acc.maxX = Math.max(acc.maxX, x);
+      acc.minZ = Math.min(acc.minZ, z);
+      acc.maxZ = Math.max(acc.maxZ, z);
+    }
+    for (const [id, acc] of rowAcc) {
+      rows.push({
+        id,
+        label: acc.label,
+        sectionId: acc.sectionId,
+        seatCount: acc.n,
+        center: [acc.x / acc.n, acc.y / acc.n, acc.z / acc.n],
+        radius: Math.max(0.8, Math.hypot(acc.maxX - acc.minX, acc.maxZ - acc.minZ) * 0.5)
+      });
+    }
     if (seats.length <= SEAT_LABEL_MAX) {
       for (let i = 0; i < seats.length; i++) {
         const s = seats[i];
@@ -3516,7 +3743,18 @@ function buildSceneModel(input) {
   }
   for (const unit of units) {
     for (const o of unit.objects) {
-      if (o.type === "text") {
+      if (o.type === "shape" && o.role && ["entrance", "exit", "screen", "suite", "obstruction"].includes(o.role)) {
+        const poly = shapePolygon(o);
+        const centre = poly ? centroidOf(poly) : null;
+        if (!centre || !o.label) continue;
+        labels.push({
+          id: `architecture:${o.id}`,
+          kind: "annotation",
+          text: o.label,
+          anchor: [centre.x * M, unit.baseHeightM + architectureForShape(o).heightM + ANNOTATION_LIFT_M, centre.y * M],
+          color: o.fill
+        });
+      } else if (o.type === "text") {
         if (!o.text) continue;
         labels.push({
           id: `text:${o.id}`,
@@ -3598,6 +3836,7 @@ function buildSceneModel(input) {
     zones,
     stages: stageBounds,
     sections,
+    rows,
     labels,
     floors
   };
@@ -3631,6 +3870,7 @@ var LabelOverlay = class {
   constructor(container, opts = {}) {
     this.nodes = /* @__PURE__ */ new Map();
     this.labels = [];
+    this.forcedDense = false;
     this.opts = opts;
     this.root = document.createElement("div");
     this.root.setAttribute("data-view3d-labels", "");
@@ -3665,6 +3905,11 @@ var LabelOverlay = class {
       }
     }
   }
+  /** Section/row drill-in makes their dense labels explicit, regardless of the
+   * whole-venue distance heuristic used during free orbit. */
+  setForcedDense(enabled) {
+    this.forcedDense = enabled;
+  }
   /**
    * Reposition every label for the current camera.
    *
@@ -3673,6 +3918,10 @@ var LabelOverlay = class {
   update(viewProjection, width, height, cameraDistance, venueRadius, cameraWorld) {
     if (!this.labels.length) return;
     const kinds = visibleLabelKinds(cameraDistance, venueRadius);
+    if (this.forcedDense) {
+      kinds.add("row");
+      kinds.add("seat");
+    }
     const candidates = [];
     for (const label of this.labels) {
       if (!kinds.has(label.kind)) continue;
@@ -3821,6 +4070,7 @@ in vec2 position;      // quad corner in [-1,1]
 in vec3 iOffset;       // per-instance world position
 in vec3 iColor;        // per-instance state colour (resolved CPU-side)
 in float iMaxRadius;   // per-instance world-radius ceiling (seat pitch derived)
+in float iPhysicalSeat;// 1 = chair; 0 = empty wheelchair bay
 in vec3 iRing;         // accommodation ring colour; (0,0,0) = not accessible
 in float iFloor;       // owning floor index
 uniform mat4 modelViewMatrix;
@@ -3838,6 +4088,7 @@ 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
+out float vPhysicalSeat;
 ${CHAIR_WEIGHT_GLSL}
 void main() {
   vec4 mv = modelViewMatrix * vec4(iOffset, 1.0);
@@ -3867,6 +4118,7 @@ void main() {
   vUv = position;
   vColor = iColor;
   vRing = iRing;
+  vPhysicalSeat = iPhysicalSeat;
   vDim = (uFocusFloor < -0.5 || abs(iFloor - uFocusFloor) < 0.5) ? 0.0 : 1.0;
   gl_Position = projectionMatrix * mv;
 }`
@@ -3881,11 +4133,13 @@ in float vBudget;
 in vec3 vRing;
 in float vDim;
 in float vDotWeight;
+in float vPhysicalSeat;
 uniform float uSeatFade;      // fade toward tier colour with distance (LOD)
 uniform vec3 uFadeColor;
 out vec4 fragColor;
 void main() {
-  float d = length(vUv);
+  // Empty wheelchair provision is a square bay, never a round chair marker.
+  float d = mix(max(abs(vUv.x), abs(vUv.y)), length(vUv), vPhysicalSeat);
   if (d > 1.0) discard;
   float alpha = smoothstep(1.0, 0.72, d);
   float shade = 0.80 + 0.28 * (0.5 - vUv.y * 0.5);       // subtle top-lit
@@ -3927,6 +4181,7 @@ 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)
+in float iPhysicalSeat;// 1 = chair; 0 = empty wheelchair bay
 uniform mat4 modelViewMatrix;
 uniform mat4 projectionMatrix;
 uniform float uChairFull;
@@ -3962,7 +4217,9 @@ void main() {
   float occupant = step(2.5, part);
   float taken = step(0.0, iSeed);
   vOccupant = occupant;
-  if (occupant > 0.5) {
+  if (iPhysicalSeat < 0.5) {
+    p = vec3(0.0);            // sellable space, but no physical chair/person
+  } else if (occupant > 0.5) {
     if (taken < 0.5) {
       p = vec3(0.0);          // empty seat: no person
     } else {
@@ -4105,6 +4362,7 @@ precision highp float;
 in vec2 position;
 in vec3 iOffset;
 in float iMaxRadius;
+in float iPhysicalSeat;
 uniform mat4 modelViewMatrix;
 uniform mat4 projectionMatrix;
 uniform float uSeatRadius;
@@ -4112,6 +4370,7 @@ uniform float uSeatScale;
 uniform float uMinPixels;
 uniform float uPixelToWorld;
 out vec2 vUv;
+out float vPhysicalSeat;
 flat out vec3 vPick;
 void main() {
   int id = gl_InstanceID + 1;                 // 0 reserved for no-hit
@@ -4124,6 +4383,7 @@ void main() {
   // Must match SEAT_VERT exactly, or the hit mask drifts off the drawn dot.
   mv.xy += normalize(vec3(modelViewMatrix * vec4(0.0, 1.0, 0.0, 0.0))).xy * r;
   vUv = position;
+  vPhysicalSeat = iPhysicalSeat;
   gl_Position = projectionMatrix * mv;
 }`
 );
@@ -4132,10 +4392,12 @@ var SEAT_PICK_FRAG = (
   `#version 300 es
 precision highp float;
 in vec2 vUv;
+in float vPhysicalSeat;
 flat in vec3 vPick;
 out vec4 fragColor;
 void main() {
-  if (length(vUv) > 1.0) discard;             // round hit-mask matches the dot
+  float d = mix(max(abs(vUv.x), abs(vUv.y)), length(vUv), vPhysicalSeat);
+  if (d > 1.0) discard;                        // hit-mask matches chair/bay shape
   fragColor = vec4(vPick, 1.0);
 }`
 );
@@ -4297,6 +4559,7 @@ function buildGpuScene(gl, model) {
     // Per-seat world-radius ceiling: what stops distant rows merging into one
     // mass when the shader grows a dot to hold its minimum pixel size.
     iMaxRadius: { size: 1, data: model.seats.iMaxRadius, instanced: 1 },
+    iPhysicalSeat: { size: 1, data: model.seats.iPhysicalSeat, instanced: 1 },
     // Accommodation ring colour; (0,0,0) means the seat carries no access type.
     iRing: { size: 3, data: model.seats.iRing, instanced: 1 },
     iFloor: { size: 1, data: model.seats.iFloor, instanced: 1 }
@@ -4314,6 +4577,7 @@ function buildGpuScene(gl, model) {
   const cYaw = new Float32Array(CAP);
   const cRing = new Float32Array(CAP * 3);
   const cFloor = new Float32Array(CAP);
+  const cPhysicalSeat = new Float32Array(CAP);
   const cSeed = new Float32Array(CAP);
   const chairGeo = new import_ogl4.Geometry(gl, {
     position: { size: 3, data: chairBase.position },
@@ -4326,6 +4590,7 @@ function buildGpuScene(gl, model) {
     iYaw: { size: 1, data: cYaw, instanced: 1 },
     iRing: { size: 3, data: cRing, instanced: 1 },
     iFloor: { size: 1, data: cFloor, instanced: 1 },
+    iPhysicalSeat: { size: 1, data: cPhysicalSeat, instanced: 1 },
     iSeed: { size: 1, data: cSeed, instanced: 1 }
   });
   const chairMesh = new import_ogl4.Mesh(gl, { geometry: chairGeo, program: chairProg });
@@ -4382,6 +4647,7 @@ function buildGpuScene(gl, model) {
         cRing[k * 3 + 1] = src.iRing[i * 3 + 1];
         cRing[k * 3 + 2] = src.iRing[i * 3 + 2];
         cFloor[k] = src.iFloor[i];
+        cPhysicalSeat[k] = src.iPhysicalSeat[i];
         cSeed[k] = seatOccupantSeed(src.iState[i], i);
       }
       writeChairColors();
@@ -4390,6 +4656,7 @@ function buildGpuScene(gl, model) {
       chairGeo.attributes.iYaw.needsUpdate = true;
       chairGeo.attributes.iRing.needsUpdate = true;
       chairGeo.attributes.iFloor.needsUpdate = true;
+      chairGeo.attributes.iPhysicalSeat.needsUpdate = true;
       chairGeo.attributes.iSeed.needsUpdate = true;
       chairGeo.instancedCount = n;
       if (!chairMesh.parent) chairMesh.setParent(main);
@@ -4720,8 +4987,120 @@ var Cinematic = class {
   }
 };
 
+// src/view3d/camera/seatViewPose.ts
+var SEAT_EYE_ABOVE_DECK_M = 1.02;
+var FOCAL_LOOK_HEIGHT_M = 1.5;
+function seatViewPose(seatDeckWorld, focalPoint, floorBaseHeightM = 0) {
+  return {
+    eye: [seatDeckWorld[0], seatDeckWorld[1] + SEAT_EYE_ABOVE_DECK_M, seatDeckWorld[2]],
+    focal: [
+      focalPoint.x * M,
+      floorBaseHeightM + FOCAL_LOOK_HEIGHT_M,
+      focalPoint.y * M
+    ]
+  };
+}
+
+// src/view/panoramaDelivery.ts
+function estimatePanoramaTextureBytes(width, height) {
+  if (!Number.isFinite(width) || !Number.isFinite(height) || width <= 0 || height <= 0) return 0;
+  return Math.ceil(width * height * 4 * (4 / 3));
+}
+function panoramaTextureBudgetBytes(deviceMemoryGb) {
+  const mib = deviceMemoryGb !== void 0 && deviceMemoryGb <= 2 ? 32 : deviceMemoryGb !== void 0 && deviceMemoryGb >= 8 ? 192 : 96;
+  return mib * 1024 * 1024;
+}
+function browserPanoramaConstraints(maxTextureSize) {
+  const nav = typeof navigator === "undefined" ? void 0 : navigator;
+  return {
+    saveData: nav?.connection?.saveData === true,
+    maxTextureSize,
+    maxDecodedBytes: panoramaTextureBudgetBytes(nav?.deviceMemory)
+  };
+}
+function planPanoramaDelivery(source, constraints = {}) {
+  const previewUrl = source.previewUrl?.trim();
+  if (!previewUrl || previewUrl === source.url) {
+    return {
+      initialUrl: source.url,
+      initialWidth: source.sourceWidth,
+      initialHeight: source.sourceHeight,
+      reason: "full-only"
+    };
+  }
+  const initial = {
+    initialUrl: previewUrl,
+    initialWidth: source.previewWidth,
+    initialHeight: source.previewHeight
+  };
+  if (constraints.saveData) return { ...initial, reason: "save-data" };
+  if (constraints.maxTextureSize !== void 0 && source.sourceWidth !== void 0 && source.sourceHeight !== void 0 && Math.max(source.sourceWidth, source.sourceHeight) > constraints.maxTextureSize) {
+    return { ...initial, reason: "texture-limit" };
+  }
+  if (constraints.maxDecodedBytes !== void 0 && source.sourceWidth !== void 0 && source.sourceHeight !== void 0 && estimatePanoramaTextureBytes(source.sourceWidth, source.sourceHeight) > constraints.maxDecodedBytes) {
+    return { ...initial, reason: "memory-limit" };
+  }
+  return { ...initial, upgradeUrl: source.url, reason: "progressive" };
+}
+function abortError() {
+  return new DOMException("Panorama image load aborted", "AbortError");
+}
+function loadPanoramaImage(url, signal) {
+  return new Promise((resolve, reject) => {
+    if (signal?.aborted) {
+      reject(abortError());
+      return;
+    }
+    const image = new Image();
+    image.crossOrigin = "anonymous";
+    let settled = false;
+    const cleanup = () => {
+      image.onload = null;
+      image.onerror = null;
+      signal?.removeEventListener("abort", onAbort);
+    };
+    const finish = (error) => {
+      if (settled) return;
+      settled = true;
+      cleanup();
+      if (error) reject(error);
+      else resolve(image);
+    };
+    const onAbort = () => {
+      image.src = "";
+      finish(abortError());
+    };
+    image.onload = () => {
+      const decoded = typeof image.decode === "function" ? image.decode() : Promise.resolve();
+      void decoded.then(() => finish(), () => finish());
+    };
+    image.onerror = () => finish(new Error("panorama_image_failed"));
+    signal?.addEventListener("abort", onAbort, { once: true });
+    image.src = url;
+  });
+}
+function schedulePanoramaUpgrade(work) {
+  const host = globalThis;
+  if (host.requestIdleCallback) {
+    const id2 = host.requestIdleCallback(work, { timeout: 1200 });
+    return () => host.cancelIdleCallback?.(id2);
+  }
+  const id = globalThis.setTimeout(work, 32);
+  return () => globalThis.clearTimeout(id);
+}
+
 // src/view3d/crossfade/panorama.ts
+function seatViewDisclosure(view) {
+  const coverage = view.generated ? "Live 3D \xB7 exact seat-eye" : view.coverage === "exact-seat" ? "Exact seat photo" : view.coverage === "row-representative" ? "Representative row view" : view.coverage === "section-representative" ? "Representative section view" : view.coverage === "venue-representative" ? "Representative venue view" : "Venue photo";
+  const year = view.capturedAt && /^\d{4}/.test(view.capturedAt) ? view.capturedAt.slice(0, 4) : "";
+  return [coverage, year ? `captured ${year}` : "", view.sourceLabel ?? ""].filter(Boolean).join(" \xB7 ");
+}
 var VFOV_DEG = 70;
+var MIN_VFOV_DEG = 35;
+var MAX_VFOV_DEG = 90;
+function clampPanoramaFov(fovDeg) {
+  return Math.max(MIN_VFOV_DEG, Math.min(MAX_VFOV_DEG, fovDeg));
+}
 var MAX_PITCH_DEG = 35;
 function bearingToOffsetPx(bearingDeg, viewportW, bgW) {
   const col = (0.5 + bearingDeg / 360) * bgW;
@@ -4740,9 +5119,16 @@ function clampPitchPx(pitchPx, bgH) {
 function mountPanorama(container, view, opts = {}) {
   const fadeMs = opts.fadeMs ?? 400;
   const bearing = view.initialBearingDeg ?? 0;
+  const delivery = planPanoramaDelivery(view, browserPanoramaConstraints());
+  const loadAbort = new AbortController();
+  const abortFromCaller = () => loadAbort.abort();
+  opts.signal?.addEventListener("abort", abortFromCaller, { once: true });
   const root = document.createElement("div");
+  const priorFocus = document.activeElement instanceof HTMLElement ? document.activeElement : null;
   root.setAttribute("role", "dialog");
+  root.setAttribute("aria-modal", "true");
   root.setAttribute("aria-label", opts.seatLabel ? `View from ${opts.seatLabel}` : "View from seat");
+  root.tabIndex = -1;
   Object.assign(root.style, {
     position: "absolute",
     inset: "0",
@@ -4757,7 +5143,7 @@ function mountPanorama(container, view, opts = {}) {
   Object.assign(pano.style, {
     position: "absolute",
     inset: "0",
-    backgroundImage: `url("${view.url}")`,
+    backgroundImage: `url("${delivery.initialUrl}")`,
     backgroundRepeat: "repeat-x",
     cursor: "grab"
   });
@@ -4771,8 +5157,8 @@ function mountPanorama(container, view, opts = {}) {
     top: "12px",
     right: "12px",
     zIndex: "2",
-    width: "34px",
-    height: "34px",
+    width: "44px",
+    height: "44px",
     borderRadius: "999px",
     cursor: "pointer",
     border: "1px solid rgba(255,255,255,0.25)",
@@ -4782,8 +5168,30 @@ function mountPanorama(container, view, opts = {}) {
     lineHeight: "1"
   });
   root.appendChild(closeBtn);
+  if (opts.disclosure) {
+    const disclosure = document.createElement("div");
+    disclosure.textContent = `360\xB0 panorama \xB7 ${opts.disclosure}`;
+    Object.assign(disclosure.style, {
+      position: "absolute",
+      top: "12px",
+      left: "12px",
+      zIndex: "2",
+      maxWidth: "calc(100% - 88px)",
+      padding: "8px 11px",
+      borderRadius: "999px",
+      overflow: "hidden",
+      color: "#dce6f8",
+      background: "rgba(8,12,18,0.68)",
+      font: "600 11px/1.2 ui-sans-serif, system-ui, sans-serif",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap",
+      pointerEvents: "none",
+      backdropFilter: "blur(6px)"
+    });
+    root.appendChild(disclosure);
+  }
   const hint = document.createElement("div");
-  hint.textContent = "Drag to look around \xB7 Esc to close";
+  hint.textContent = "Drag to look \xB7 pinch or scroll to zoom \xB7 Esc to close";
   Object.assign(hint.style, {
     position: "absolute",
     bottom: "12px",
@@ -4796,23 +5204,28 @@ function mountPanorama(container, view, opts = {}) {
   });
   root.appendChild(hint);
   container.appendChild(root);
+  closeBtn.focus({ preventScroll: true });
   let bgW = 0;
   let bgH = 0;
   let posX = 0;
   let pitchPx = 0;
+  let viewFov = VFOV_DEG;
   const layout = () => {
     const vh = root.clientHeight || 1;
     const vw = root.clientWidth || 1;
     const natW = img.naturalWidth || vw * 2;
     const natH = img.naturalHeight || vh;
-    bgH = windowedBgHeight(vh);
+    const centredImageRatio = bgW > 0 ? (vw / 2 - posX) / bgW : 0;
+    const pitchRatio = bgH > 0 ? pitchPx / bgH : 0;
+    bgH = windowedBgHeight(vh, viewFov);
     bgW = bgH * (natW / natH);
     pano.style.backgroundSize = `${bgW}px ${bgH}px`;
     if (!posInitialised) {
       posX = bearingToOffsetPx(bearing, vw, bgW);
+      pitchPx = clampPitchPx((view.initialPitchDeg ?? 0) / 180 * bgH, bgH);
       posInitialised = true;
-    }
-    pitchPx = clampPitchPx(pitchPx, bgH);
+    } else posX = vw / 2 - centredImageRatio * bgW;
+    pitchPx = clampPitchPx(pitchRatio * bgH, bgH);
     pano.style.backgroundPosition = `${posX}px ${horizonOffsetPy(vh, bgH, pitchPx)}px`;
   };
   let posInitialised = false;
@@ -4821,17 +5234,44 @@ function mountPanorama(container, view, opts = {}) {
     pitchPx = clampPitchPx(pitchPx, bgH);
     pano.style.backgroundPosition = `${posX}px ${horizonOffsetPy(vh, bgH, pitchPx)}px`;
   };
-  const img = new Image();
+  let img = new Image();
   img.onload = layout;
-  img.src = view.url;
+  img.src = delivery.initialUrl;
+  let cancelUpgrade = () => {
+  };
+  if (delivery.upgradeUrl) {
+    cancelUpgrade = schedulePanoramaUpgrade(() => {
+      void loadPanoramaImage(delivery.upgradeUrl, loadAbort.signal).then((full) => {
+        if (disposed || loadAbort.signal.aborted) return;
+        img = full;
+        pano.style.backgroundImage = `url("${delivery.upgradeUrl}")`;
+        layout();
+      }).catch(() => {
+      });
+    });
+  }
   requestAnimationFrame(layout);
   let dragging = false;
   let lastX = 0;
   let lastY = 0;
+  let pinchDistance = 0;
+  const pointers = /* @__PURE__ */ new Map();
+  const distanceBetweenPointers = () => {
+    const [a, b] = [...pointers.values()];
+    return a && b ? Math.hypot(a.x - b.x, a.y - b.y) : 0;
+  };
+  const setViewFov = (nextFov) => {
+    const clamped = clampPanoramaFov(nextFov);
+    if (clamped === viewFov) return;
+    viewFov = clamped;
+    layout();
+  };
   const onDown = (e) => {
-    dragging = true;
+    pointers.set(e.pointerId, { x: e.clientX, y: e.clientY });
+    dragging = pointers.size === 1;
     lastX = e.clientX;
     lastY = e.clientY;
+    if (pointers.size === 2) pinchDistance = distanceBetweenPointers();
     pano.style.cursor = "grabbing";
     try {
       pano.setPointerCapture?.(e.pointerId);
@@ -4839,6 +5279,15 @@ function mountPanorama(container, view, opts = {}) {
     }
   };
   const onMove = (e) => {
+    if (!pointers.has(e.pointerId)) return;
+    pointers.set(e.pointerId, { x: e.clientX, y: e.clientY });
+    if (pointers.size >= 2) {
+      const nextDistance = distanceBetweenPointers();
+      if (pinchDistance > 0 && nextDistance > 0) setViewFov(viewFov * (pinchDistance / nextDistance));
+      pinchDistance = nextDistance;
+      dragging = false;
+      return;
+    }
     if (!dragging) return;
     posX += e.clientX - lastX;
     pitchPx += e.clientY - lastY;
@@ -4847,17 +5296,28 @@ function mountPanorama(container, view, opts = {}) {
     applyPos();
   };
   const onUp = (e) => {
-    dragging = false;
-    pano.style.cursor = "grab";
+    pointers.delete(e.pointerId);
+    pinchDistance = pointers.size === 2 ? distanceBetweenPointers() : 0;
+    const remaining = pointers.values().next().value;
+    dragging = pointers.size === 1;
+    if (remaining) {
+      lastX = remaining.x;
+      lastY = remaining.y;
+    } else pano.style.cursor = "grab";
     try {
       pano.releasePointerCapture?.(e.pointerId);
     } catch {
     }
   };
+  const onWheel = (e) => {
+    e.preventDefault();
+    setViewFov(viewFov + e.deltaY * 0.04);
+  };
   pano.addEventListener("pointerdown", onDown);
   pano.addEventListener("pointermove", onMove);
   pano.addEventListener("pointerup", onUp);
   pano.addEventListener("pointercancel", onUp);
+  pano.addEventListener("wheel", onWheel, { passive: false });
   let closed = false;
   let disposed = false;
   let fadeTimer = 0;
@@ -4866,15 +5326,20 @@ function mountPanorama(container, view, opts = {}) {
     pano.removeEventListener("pointermove", onMove);
     pano.removeEventListener("pointerup", onUp);
     pano.removeEventListener("pointercancel", onUp);
+    pano.removeEventListener("wheel", onWheel);
     window.removeEventListener("keydown", onKey);
   };
   const teardown = () => {
+    cancelUpgrade();
+    loadAbort.abort();
+    opts.signal?.removeEventListener("abort", abortFromCaller);
     if (fadeTimer) {
       window.clearTimeout(fadeTimer);
       fadeTimer = 0;
     }
     removeListeners();
     if (root.parentNode) root.parentNode.removeChild(root);
+    if (priorFocus?.isConnected) priorFocus.focus({ preventScroll: true });
   };
   const close = () => {
     if (closed) return;
@@ -4889,10 +5354,33 @@ function mountPanorama(container, view, opts = {}) {
     fadeTimer = window.setTimeout(done, fadeMs);
   };
   const onKey = (e) => {
+    if (e.key === "Tab") {
+      e.preventDefault();
+      closeBtn.focus({ preventScroll: true });
+      return;
+    }
     if (e.key === "Escape") {
       e.stopPropagation();
       close();
+      return;
     }
+    if (e.key === "ArrowLeft" || e.key === "ArrowRight") {
+      posX += e.key === "ArrowLeft" ? -32 : 32;
+    } else if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+      pitchPx += (e.key === "ArrowUp" ? 4 : -4) * (bgH / 180);
+    } else if (e.key === "+" || e.key === "=") {
+      setViewFov(viewFov - 5);
+      e.preventDefault();
+      return;
+    } else if (e.key === "-") {
+      setViewFov(viewFov + 5);
+      e.preventDefault();
+      return;
+    } else {
+      return;
+    }
+    e.preventDefault();
+    applyPos();
   };
   window.addEventListener("keydown", onKey);
   closeBtn.addEventListener("click", close);
@@ -5030,6 +5518,10 @@ function createPanoSphere(gl, image) {
     setOpacity(value) {
       program.uniforms.uOpacity.value = Math.max(0, Math.min(1, value));
     },
+    setImage(nextImage) {
+      texture.image = nextImage;
+      texture.needsUpdate = true;
+    },
     dispose() {
       mesh.setParent(null);
       geometry.remove();
@@ -5041,20 +5533,29 @@ function createPanoSphere(gl, image) {
 
 // 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 pitch = Math.max(-MAX_PITCH_DEG, Math.min(MAX_PITCH_DEG, view?.initialPitchDeg ?? 0));
+  let viewFov = VFOV_DEG;
   let disposed = false;
+  const loadAbort = new AbortController();
+  const abortFromCaller = () => loadAbort.abort();
+  opts.signal?.addEventListener("abort", abortFromCaller, { once: true });
+  let cancelUpgrade = () => {
+  };
+  const priorPosition = [
+    deps.camera.position.x,
+    deps.camera.position.y,
+    deps.camera.position.z
+  ];
+  if (!view && deps.cameraOriginWorld) {
+    deps.camera.position.set(
+      deps.cameraOriginWorld[0],
+      deps.cameraOriginWorld[1],
+      deps.cameraOriginWorld[2]
+    );
+  }
   if (!view && deps.focalWorld) {
     const p = deps.camera.position;
     const dx = deps.focalWorld[0] - p.x;
@@ -5068,22 +5569,37 @@ async function mountPanoramaSphere(container, view, deps, opts = {}) {
   }
   let sphere = null;
   if (view) {
+    const maxTextureSize = deps.gl.getParameter(deps.gl.MAX_TEXTURE_SIZE);
+    const delivery = planPanoramaDelivery(view, browserPanoramaConstraints(maxTextureSize));
     let image;
     try {
-      image = await loadImage(view.url);
+      image = await loadPanoramaImage(delivery.initialUrl, loadAbort.signal);
     } catch {
+      opts.signal?.removeEventListener("abort", abortFromCaller);
       return null;
     }
     try {
       sphere = createPanoSphere(deps.gl, image);
     } catch {
+      loadAbort.abort();
+      opts.signal?.removeEventListener("abort", abortFromCaller);
       return null;
     }
     sphere.mesh.renderOrder = 999;
     sphere.mesh.setParent(deps.scene);
+    if (delivery.upgradeUrl) {
+      cancelUpgrade = schedulePanoramaUpgrade(() => {
+        void loadPanoramaImage(delivery.upgradeUrl, loadAbort.signal).then((full) => {
+          if (disposed || loadAbort.signal.aborted) return;
+          sphere?.setImage(full);
+          deps.requestRender();
+        }).catch(() => {
+        });
+      });
+    }
   }
   const priorFov = deps.camera.fov;
-  deps.camera.perspective({ fov: VFOV_DEG, aspect: deps.camera.aspect });
+  deps.camera.perspective({ fov: viewFov, aspect: deps.camera.aspect });
   const priorQuat = deps.camera.quaternion.slice();
   const aim = () => {
     const p = deps.camera.position;
@@ -5094,8 +5610,11 @@ async function mountPanoramaSphere(container, view, deps, opts = {}) {
   };
   aim();
   const root = document.createElement("div");
+  const priorFocus = document.activeElement instanceof HTMLElement ? document.activeElement : null;
   root.setAttribute("role", "dialog");
+  root.setAttribute("aria-modal", "true");
   root.setAttribute("aria-label", opts.seatLabel ? `View from ${opts.seatLabel}` : "View from seat");
+  root.tabIndex = -1;
   Object.assign(root.style, {
     position: "absolute",
     inset: "0",
@@ -5112,8 +5631,8 @@ async function mountPanoramaSphere(container, view, deps, opts = {}) {
     top: "12px",
     right: "12px",
     zIndex: "2",
-    width: "34px",
-    height: "34px",
+    width: "44px",
+    height: "44px",
     borderRadius: "999px",
     cursor: "pointer",
     border: "1px solid rgba(255,255,255,0.25)",
@@ -5123,8 +5642,30 @@ async function mountPanoramaSphere(container, view, deps, opts = {}) {
     lineHeight: "1"
   });
   root.appendChild(closeBtn);
+  if (opts.disclosure) {
+    const disclosure = document.createElement("div");
+    disclosure.textContent = `360\xB0 panorama \xB7 ${opts.disclosure}`;
+    Object.assign(disclosure.style, {
+      position: "absolute",
+      top: "12px",
+      left: "12px",
+      zIndex: "2",
+      maxWidth: "calc(100% - 88px)",
+      padding: "8px 11px",
+      borderRadius: "999px",
+      overflow: "hidden",
+      color: "#dce6f8",
+      background: "rgba(8,12,18,0.68)",
+      font: "600 11px/1.2 ui-sans-serif, system-ui, sans-serif",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap",
+      pointerEvents: "none",
+      backdropFilter: "blur(6px)"
+    });
+    root.appendChild(disclosure);
+  }
   const hint = document.createElement("div");
-  hint.textContent = "Drag to look around \xB7 Esc to close";
+  hint.textContent = "Drag to look \xB7 pinch or scroll to zoom \xB7 Esc to close";
   Object.assign(hint.style, {
     position: "absolute",
     bottom: "12px",
@@ -5137,18 +5678,43 @@ async function mountPanoramaSphere(container, view, deps, opts = {}) {
   });
   root.appendChild(hint);
   container.appendChild(root);
+  closeBtn.focus({ preventScroll: true });
   let dragging = false;
   let lastX = 0;
   let lastY = 0;
+  let pinchDistance = 0;
+  const pointers = /* @__PURE__ */ new Map();
+  const distanceBetweenPointers = () => {
+    const [a, b] = [...pointers.values()];
+    return a && b ? Math.hypot(a.x - b.x, a.y - b.y) : 0;
+  };
+  const setViewFov = (nextFov) => {
+    const clamped = clampPanoramaFov(nextFov);
+    if (clamped === viewFov) return;
+    viewFov = clamped;
+    deps.camera.perspective({ fov: viewFov, aspect: deps.camera.aspect });
+    aim();
+  };
   const onDown = (e) => {
     if (e.target === closeBtn) return;
-    dragging = true;
+    pointers.set(e.pointerId, { x: e.clientX, y: e.clientY });
+    dragging = pointers.size === 1;
     lastX = e.clientX;
     lastY = e.clientY;
+    if (pointers.size === 2) pinchDistance = distanceBetweenPointers();
     root.setPointerCapture?.(e.pointerId);
     root.style.cursor = "grabbing";
   };
   const onMove = (e) => {
+    if (!pointers.has(e.pointerId)) return;
+    pointers.set(e.pointerId, { x: e.clientX, y: e.clientY });
+    if (pointers.size >= 2) {
+      const nextDistance = distanceBetweenPointers();
+      if (pinchDistance > 0 && nextDistance > 0) setViewFov(viewFov * (pinchDistance / nextDistance));
+      pinchDistance = nextDistance;
+      dragging = false;
+      return;
+    }
     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));
@@ -5156,18 +5722,58 @@ async function mountPanoramaSphere(container, view, deps, opts = {}) {
     lastY = e.clientY;
     aim();
   };
-  const onUp = () => {
-    dragging = false;
-    root.style.cursor = "grab";
+  const onUp = (e) => {
+    pointers.delete(e.pointerId);
+    pinchDistance = pointers.size === 2 ? distanceBetweenPointers() : 0;
+    const remaining = pointers.values().next().value;
+    dragging = pointers.size === 1;
+    if (remaining) {
+      lastX = remaining.x;
+      lastY = remaining.y;
+    } else root.style.cursor = "grab";
+    try {
+      root.releasePointerCapture?.(e.pointerId);
+    } catch {
+    }
+  };
+  const onWheel = (e) => {
+    e.preventDefault();
+    setViewFov(viewFov + e.deltaY * 0.04);
   };
   root.addEventListener("pointerdown", onDown);
   root.addEventListener("pointermove", onMove);
   root.addEventListener("pointerup", onUp);
   root.addEventListener("pointercancel", onUp);
+  root.addEventListener("wheel", onWheel, { passive: false });
   const onKey = (e) => {
-    if (e.key !== "Escape" || disposed) return;
-    e.stopPropagation();
-    handle.close();
+    if (disposed) return;
+    if (e.key === "Tab") {
+      e.preventDefault();
+      closeBtn.focus({ preventScroll: true });
+      return;
+    }
+    if (e.key === "Escape") {
+      e.stopPropagation();
+      handle.close();
+      return;
+    }
+    if (e.key === "ArrowLeft" || e.key === "ArrowRight") {
+      bearing += e.key === "ArrowLeft" ? -4 : 4;
+    } else if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+      pitch = Math.max(-MAX_PITCH_DEG, Math.min(MAX_PITCH_DEG, pitch + (e.key === "ArrowUp" ? 4 : -4)));
+    } else if (e.key === "+" || e.key === "=") {
+      setViewFov(viewFov - 5);
+      e.preventDefault();
+      return;
+    } else if (e.key === "-") {
+      setViewFov(viewFov + 5);
+      e.preventDefault();
+      return;
+    } else {
+      return;
+    }
+    e.preventDefault();
+    aim();
   };
   window.addEventListener("keydown", onKey);
   let raf = 0;
@@ -5192,14 +5798,20 @@ async function mountPanoramaSphere(container, view, deps, opts = {}) {
   const teardown = () => {
     if (disposed) return;
     disposed = true;
+    cancelUpgrade();
+    loadAbort.abort();
+    opts.signal?.removeEventListener("abort", abortFromCaller);
     cancelAnimationFrame(raf);
     root.removeEventListener("pointerdown", onDown);
     root.removeEventListener("pointermove", onMove);
     root.removeEventListener("pointerup", onUp);
     root.removeEventListener("pointercancel", onUp);
+    root.removeEventListener("wheel", onWheel);
     window.removeEventListener("keydown", onKey);
     root.remove();
+    if (priorFocus?.isConnected) priorFocus.focus({ preventScroll: true });
     sphere?.dispose();
+    deps.camera.position.set(priorPosition[0], priorPosition[1], priorPosition[2]);
     deps.camera.perspective({ fov: priorFov, aspect: deps.camera.aspect });
     deps.camera.quaternion.set(priorQuat[0], priorQuat[1], priorQuat[2], priorQuat[3]);
     deps.requestRender();
@@ -5236,8 +5848,13 @@ var Analytics3D = class {
     } catch {
     }
   }
-  opened(seats, hasHeights) {
-    this.emit("3d_opened", { seats, hasHeights });
+  opened(seats, hasHeights, buildMs, prepSource) {
+    this.emit("3d_opened", {
+      seats,
+      hasHeights,
+      ...buildMs === void 0 ? {} : { buildMs: Math.round(buildMs) },
+      ...prepSource === void 0 ? {} : { prepSource }
+    });
   }
   /** First user-driven orbit/dolly per mount only (the intro ease is not user
    * input, so callers must gate this on real pointer/wheel gestures). */
@@ -5267,18 +5884,78 @@ var Analytics3D = class {
     this.panoramaOpenedAt = 0;
     this.emit("3d_panorama_closed", { viewMs });
   }
+  panoramaFailed(seatId, phase) {
+    this.emit("3d_panorama_failed", { seatId, phase });
+  }
+  panoramaFallback(seatId) {
+    this.emit("3d_panorama_fallback", { seatId });
+  }
+  contextLost() {
+    this.emit("3d_context_lost");
+  }
+  contextRestored() {
+    this.emit("3d_context_restored");
+  }
 };
 
+// src/view3d/positioningContext.ts
+function establishPositioningContext(container) {
+  const originalInline = container.style.position;
+  if (getComputedStyle(container).position !== "static") return () => {
+  };
+  container.style.position = "relative";
+  return () => {
+    if (container.style.position === "relative") container.style.position = originalInline;
+  };
+}
+
+// src/view3d/prepareScene.ts
+var import_meta = {};
+function prepareOnMain(input) {
+  const started = performance.now();
+  const model = buildSceneModel(input);
+  return { model, buildMs: performance.now() - started, source: "main" };
+}
+function prepareVenue3D(input) {
+  if (typeof Worker === "undefined") return Promise.resolve(prepareOnMain(input));
+  return new Promise((resolve) => {
+    const worker = new Worker(new URL("./scene/scene.worker.ts", import_meta.url), { type: "module" });
+    let settled = false;
+    const finish = (result) => {
+      if (settled) return;
+      settled = true;
+      clearTimeout(timeout);
+      worker.terminate();
+      resolve(result);
+    };
+    const fallback = () => finish(prepareOnMain(input));
+    const timeout = window.setTimeout(fallback, 15e3);
+    worker.onerror = fallback;
+    worker.onmessage = (event) => {
+      finish({ model: event.data.model, buildMs: event.data.buildMs, source: "worker" });
+    };
+    worker.postMessage(input);
+  });
+}
+
 // src/view3d/index.ts
-var SEAT_EYE_ABOVE_DECK = 1.02;
 var DEG3 = Math.PI / 180;
 var TAP_SLOP = 6;
 var TAP_MS = 500;
 function mountVenue3D(container, input, opts = {}) {
-  const model = buildSceneModel(input);
+  const buildStartedAt = performance.now();
+  const model = input.prepared?.model ?? buildSceneModel(input);
   const analytics = new Analytics3D(opts.onAnalytics);
   const seatIdByIndex = new Array(model.seats.count);
   for (const [id, idx] of model.seats.idToIndex) seatIdByIndex[idx] = id;
+  const expandedSeatById = new Map(input.seats.map((seat) => [seat.id, seat]));
+  const seatIdsByRow = /* @__PURE__ */ new Map();
+  for (const seat of input.seats) {
+    if (!seat.rowId) continue;
+    const row = seatIdsByRow.get(seat.rowId);
+    if (row) row.push(seat.id);
+    else seatIdsByRow.set(seat.rowId, [seat.id]);
+  }
   const sectionIdBySeatId = /* @__PURE__ */ new Map();
   for (const s of input.seats) sectionIdBySeatId.set(s.id, s.sectionId);
   const hasHeights = (() => {
@@ -5293,10 +5970,22 @@ function mountVenue3D(container, input, opts = {}) {
   let disposed = false;
   let selection = /* @__PURE__ */ new Map();
   let panorama = null;
+  let panoramaLoadAbort = null;
+  let panoramaPriorZIndex = null;
   const prefetch = /* @__PURE__ */ new Map();
   let flightGen = 0;
   let reducedForced = null;
   let focusedFloor = -1;
+  const raisePanoramaLayer = () => {
+    if (panoramaPriorZIndex !== null) return;
+    panoramaPriorZIndex = container.style.zIndex;
+    container.style.zIndex = "20";
+  };
+  const restorePanoramaLayer = () => {
+    if (panoramaPriorZIndex === null) return;
+    if (container.style.zIndex === "20") container.style.zIndex = panoramaPriorZIndex;
+    panoramaPriorZIndex = null;
+  };
   const rebuildGpu = () => {
     gpu = buildGpuScene(glctx.gl, model);
     pick = new PickPipeline(glctx.renderer, gpu.seatGeometry, gpu.solidGeometry, model.seats.count);
@@ -5330,6 +6019,7 @@ function mountVenue3D(container, input, opts = {}) {
   };
   const glctx = new GLContext(container, {
     onContextLost: () => {
+      if (!disposed) analytics.contextLost();
       contextLost = true;
       loop.stop();
       gpu = null;
@@ -5338,6 +6028,7 @@ function mountVenue3D(container, input, opts = {}) {
     onContextRestored: () => {
       rebuildGpu();
       contextLost = false;
+      if (!disposed) analytics.contextRestored();
       loop.requestRender();
     }
   });
@@ -5354,16 +6045,48 @@ function mountVenue3D(container, input, opts = {}) {
     const dz = model.focalWorld[2] - model.bounds.center[2];
     return Math.hypot(dx, dz) > model.bounds.radius * 0.12 ? Math.atan2(dx, dz) : void 0;
   })();
-  orbit.frame(model.bounds, true, stageAzimuth);
+  orbit.frame(model.bounds, true, stageAzimuth, opts.portraitOverviewCrop === true);
   const cinematic = new Cinematic(orbit.camera);
-  if (!container.style.position || container.style.position === "static") {
-    container.style.position = "relative";
-  }
+  const restoreContainerPosition = establishPositioningContext(container);
   const labelOverlay = new LabelOverlay(container, {
     fontFamily: input.doc.theme?.fontFamily,
     ink: input.doc.theme?.textColor
   });
   labelOverlay.setLabels(model.labels);
+  const baseLabels = model.labels;
+  let focusedSectionId = null;
+  const showSectionSeatLabels = (sectionId) => {
+    focusedSectionId = sectionId;
+    labelOverlay.setForcedDense(!!sectionId);
+    if (!sectionId) {
+      labelOverlay.setLabels(baseLabels);
+      return;
+    }
+    const sectionSeats = input.seats.filter((seat) => seat.sectionId === sectionId);
+    const seatIds = new Set(sectionSeats.map((seat) => seat.id));
+    const rowIds = new Set(sectionSeats.map((seat) => seat.rowId));
+    const focusedBase = baseLabels.filter((label) => label.kind !== "row" && label.kind !== "seat" || (label.kind === "row" ? rowIds.has(label.id.slice("row:".length)) : seatIds.has(label.id.slice("seat:".length))));
+    if (model.seatCount <= 6e3) {
+      labelOverlay.setLabels(focusedBase);
+      return;
+    }
+    const labels = sectionSeats.flatMap((seat) => {
+      const index = model.seats.idToIndex.get(seat.id);
+      if (index === void 0) return [];
+      const offset = index * 3;
+      return [{
+        id: `seat:${seat.id}`,
+        kind: "seat",
+        text: seat.displayLabel || seat.label,
+        anchor: [
+          model.seats.iPosition[offset],
+          model.seats.iPosition[offset + 1] + 0.55,
+          model.seats.iPosition[offset + 2]
+        ]
+      }];
+    });
+    labelOverlay.setLabels([...focusedBase, ...labels]);
+  };
   rebuildGpu();
   const loop = new RenderLoop(() => {
     if (contextLost || !gpu || frozen) return false;
@@ -5416,6 +6139,9 @@ function mountVenue3D(container, input, opts = {}) {
     if (!p) {
       p = Promise.resolve(opts.getSeatView(seatId));
       prefetch.set(seatId, p);
+      void p.catch(() => {
+        if (prefetch.get(seatId) === p) prefetch.delete(seatId);
+      });
       while (prefetch.size > PREFETCH_CAP) {
         const oldest = prefetch.keys().next().value;
         if (oldest === void 0) break;
@@ -5424,56 +6150,212 @@ function mountVenue3D(container, input, opts = {}) {
     }
     return p;
   };
-  const seatEyeWorld = (idx) => [
-    model.seats.iPosition[idx * 3],
-    model.seats.iPosition[idx * 3 + 1] + SEAT_EYE_ABOVE_DECK,
-    model.seats.iPosition[idx * 3 + 2]
-  ];
+  const resolvedSeatViewPose = (seatId, idx) => {
+    const seat = expandedSeatById.get(seatId);
+    const floorIndex = Math.max(0, Math.round(model.seats.iFloor[idx] ?? 0));
+    const floor = input.doc.floors?.[floorIndex];
+    const focalPoint = seat?.focalPoint ?? floor?.focalPoint ?? input.doc.focalPoint;
+    const deck = [
+      model.seats.iPosition[idx * 3],
+      model.seats.iPosition[idx * 3 + 1],
+      model.seats.iPosition[idx * 3 + 2]
+    ];
+    return seatViewPose(deck, focalPoint, floor?.baseHeightM ?? 0);
+  };
   const placeCameraFinal = (finalPos, focal) => {
     orbit.camera.position.set(finalPos[0], finalPos[1], finalPos[2]);
     orbit.camera.lookAt(new import_ogl8.Vec3(focal[0], focal[1], focal[2]));
     orbit.camera.fov = FOV_END;
     orbit.camera.updateProjectionMatrix();
   };
+  const isNarrow = () => (container.clientWidth || glctx.canvas.clientWidth) <= 520;
   let arriveChip = null;
+  const layoutArriveChip = () => {
+    if (!arriveChip) return;
+    const narrow = isNarrow();
+    Object.assign(arriveChip.style, narrow ? {
+      left: "12px",
+      right: "12px",
+      bottom: "70px",
+      transform: "none",
+      justifyContent: "center"
+    } : {
+      left: "50%",
+      right: "auto",
+      bottom: "18px",
+      transform: "translateX(-50%)",
+      justifyContent: "initial"
+    });
+  };
   const removeArriveChip = () => {
     arriveChip?.remove();
     arriveChip = null;
   };
-  const showArriveChip = (seatId, gen) => {
+  const showArriveChip = (seatId, gen, retry = false) => {
     removeArriveChip();
-    if (disposed || !opts.getSeatView) return;
-    const chip = document.createElement("button");
-    chip.type = "button";
-    chip.textContent = "\u25C9 View in 360\xB0";
-    chip.setAttribute("aria-label", `Open the 360\xB0 view from seat ${seatId}`);
-    Object.assign(chip.style, {
+    if (disposed) return null;
+    const controls = document.createElement("div");
+    controls.setAttribute("role", "group");
+    Object.assign(controls.style, {
       position: "absolute",
-      left: "50%",
-      bottom: "18px",
-      transform: "translateX(-50%)",
-      minHeight: "44px",
-      padding: "10px 18px",
-      borderRadius: "999px",
-      background: "rgba(12,18,32,0.78)",
-      color: "#eef1f8",
-      border: "1px solid rgba(150,165,205,0.4)",
-      backdropFilter: "blur(6px)",
-      font: "600 13px/1 inherit",
-      cursor: "pointer",
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      gap: "6px",
       zIndex: "4"
     });
-    chip.addEventListener("click", () => {
-      if (disposed || gen !== flightGen) {
+    const seat = expandedSeatById.get(seatId);
+    const section = seat?.sectionId ? model.sections.find((candidate) => candidate.id === seat.sectionId) : void 0;
+    const seatLabel = seat?.label ?? seatId;
+    controls.setAttribute("aria-label", `Explore views near ${section?.label ? `${section.label}, ` : ""}seat ${seatLabel}`);
+    const location = document.createElement("span");
+    location.textContent = ["Live 3D seat view", section?.label, seatLabel].filter(Boolean).join(" \xB7 ");
+    Object.assign(location.style, {
+      maxWidth: "min(320px, calc(100vw - 32px))",
+      padding: "5px 10px",
+      borderRadius: "999px",
+      overflow: "hidden",
+      color: "#d9e3f5",
+      background: "rgba(12,18,32,0.72)",
+      font: "600 11px/1.2 inherit",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap",
+      backdropFilter: "blur(6px)"
+    });
+    controls.appendChild(location);
+    const actions = document.createElement("div");
+    Object.assign(actions.style, {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      gap: "6px"
+    });
+    controls.appendChild(actions);
+    const row = seat?.rowId ? seatIdsByRow.get(seat.rowId) : void 0;
+    const at = row?.indexOf(seatId) ?? -1;
+    const neighbours = at >= 0 ? [row?.[at - 1], row?.[at + 1]] : [void 0, void 0];
+    const addButton = (label, ariaLabel, action, primary = false) => {
+      const button = document.createElement("button");
+      button.type = "button";
+      button.textContent = label;
+      button.setAttribute("aria-label", ariaLabel);
+      Object.assign(button.style, {
+        minHeight: "44px",
+        padding: primary ? "10px 16px" : "10px",
+        borderRadius: "999px",
+        background: "rgba(12,18,32,0.78)",
+        color: "#eef1f8",
+        border: "1px solid rgba(150,165,205,0.4)",
+        backdropFilter: "blur(6px)",
+        font: "600 13px/1 inherit",
+        cursor: "pointer",
+        whiteSpace: "nowrap"
+      });
+      if (!primary) button.style.minWidth = "44px";
+      if (primary) button.dataset.panoramaTrigger = "";
+      button.addEventListener("click", action);
+      actions.appendChild(button);
+    };
+    if (neighbours[0]) {
+      const label = expandedSeatById.get(neighbours[0])?.label ?? neighbours[0];
+      addButton("\u2039", `View previous seat ${label}`, () => {
+        void flyToSeat(neighbours[0]);
+      });
+    }
+    if (opts.getSeatView) {
+      addButton(retry ? "\u21BB Retry 360\xB0 panorama" : "\u25C9 Open 360\xB0 panorama", `${retry ? "Retry" : "Open"} the 360\xB0 panorama from seat ${seatLabel}`, () => {
+        if (disposed || gen !== flightGen) {
+          removeArriveChip();
+          return;
+        }
         removeArriveChip();
-        return;
-      }
-      removeArriveChip();
-      void openPanorama(seatId, 400, gen);
+        void openPanorama(seatId, 400, gen);
+      }, true);
+    }
+    if (neighbours[1]) {
+      const label = expandedSeatById.get(neighbours[1])?.label ?? neighbours[1];
+      addButton("\u203A", `View next seat ${label}`, () => {
+        void flyToSeat(neighbours[1]);
+      });
+    }
+    if (!actions.childElementCount) return null;
+    container.appendChild(controls);
+    arriveChip = controls;
+    layoutArriveChip();
+    return controls;
+  };
+  const navigationModeChip = document.createElement("div");
+  navigationModeChip.setAttribute("role", "group");
+  navigationModeChip.setAttribute("aria-label", "3D navigation mode");
+  Object.assign(navigationModeChip.style, {
+    position: "absolute",
+    left: "14px",
+    top: "62px",
+    display: "flex",
+    gap: "3px",
+    padding: "3px",
+    borderRadius: "999px",
+    zIndex: "4",
+    background: "rgba(12,18,32,0.72)",
+    border: "1px solid rgba(150,165,205,0.35)",
+    backdropFilter: "blur(6px)"
+  });
+  const rotateModeButton = document.createElement("button");
+  rotateModeButton.type = "button";
+  rotateModeButton.textContent = "\u21BB Rotate";
+  rotateModeButton.setAttribute("aria-label", "Drag to rotate the 3D venue");
+  const moveModeButton = document.createElement("button");
+  moveModeButton.type = "button";
+  moveModeButton.textContent = "\u2725 Move";
+  moveModeButton.setAttribute("aria-label", "Drag to move the 3D venue left, right, up or down");
+  const zoomOutButton = document.createElement("button");
+  zoomOutButton.type = "button";
+  zoomOutButton.textContent = "\u2212";
+  zoomOutButton.setAttribute("aria-label", "Zoom out of the 3D venue");
+  zoomOutButton.title = "Zoom out";
+  const zoomInButton = document.createElement("button");
+  zoomInButton.type = "button";
+  zoomInButton.textContent = "+";
+  zoomInButton.setAttribute("aria-label", "Zoom into the 3D venue");
+  zoomInButton.title = "Zoom in";
+  for (const button of [rotateModeButton, moveModeButton, zoomOutButton, zoomInButton]) {
+    Object.assign(button.style, {
+      minHeight: "34px",
+      padding: "6px 10px",
+      border: "0",
+      borderRadius: "999px",
+      color: "#c9d4ea",
+      background: "transparent",
+      font: "600 11px/1 inherit",
+      cursor: "pointer",
+      whiteSpace: "nowrap"
     });
-    container.appendChild(chip);
-    arriveChip = chip;
+    if (button === zoomOutButton || button === zoomInButton) {
+      button.style.minWidth = "34px";
+      button.style.padding = "6px";
+      button.style.fontSize = "17px";
+    }
+    navigationModeChip.appendChild(button);
+  }
+  const setNavigationMode = (mode) => {
+    orbit.setPrimaryDragMode(mode);
+    const rotateActive = mode === "orbit";
+    rotateModeButton.setAttribute("aria-pressed", String(rotateActive));
+    moveModeButton.setAttribute("aria-pressed", String(!rotateActive));
+    rotateModeButton.style.background = rotateActive ? "rgba(96,110,150,0.48)" : "transparent";
+    moveModeButton.style.background = rotateActive ? "transparent" : "rgba(96,110,150,0.48)";
+    navigationModeChip.title = rotateActive ? "Drag to rotate \xB7 Shift-drag to move" : "Drag to move \xB7 Shift-drag to rotate";
   };
+  rotateModeButton.addEventListener("click", () => setNavigationMode("orbit"));
+  moveModeButton.addEventListener("click", () => setNavigationMode("pan"));
+  zoomOutButton.addEventListener("click", () => orbit.zoomBy(1.22));
+  zoomInButton.addEventListener("click", () => orbit.zoomBy(0.82));
+  setNavigationMode("orbit");
+  container.appendChild(navigationModeChip);
+  const layoutNavigationChip = () => {
+    navigationModeChip.style.display = isNarrow() ? "none" : "flex";
+  };
+  layoutNavigationChip();
   const overviewChip = document.createElement("button");
   overviewChip.type = "button";
   overviewChip.textContent = "\u2302 Overview";
@@ -5493,17 +6375,46 @@ function mountVenue3D(container, input, opts = {}) {
     cursor: "pointer",
     zIndex: "4"
   });
-  overviewChip.addEventListener("click", () => {
-    if (disposed || frozen || panorama) return;
+  const focusOverview = () => {
+    if (disposed) return;
+    if (panorama) {
+      panorama.dispose();
+      panorama = null;
+      analytics.panoramaClosed();
+    }
+    panoramaLoadAbort?.abort();
+    panoramaLoadAbort = null;
+    restorePanoramaLayer();
+    overviewChip.style.display = "";
+    labelOverlay.setVisible(true);
+    frozen = false;
     cancelFlight();
     removeArriveChip();
-    orbit.frameSoft(model.bounds, stageAzimuth);
+    setNavigationMode("orbit");
+    if (reducedMotion()) orbit.frame(model.bounds, false, stageAzimuth, opts.portraitOverviewCrop === true);
+    else orbit.frameSoft(model.bounds, stageAzimuth, opts.portraitOverviewCrop === true);
+    opts.onViewTargetChange?.(null);
+    showSectionSeatLabels(null);
+    opts.onSectionFocusChange?.(null);
     loop.requestRender();
-  });
+  };
+  overviewChip.addEventListener("click", focusOverview);
   container.appendChild(overviewChip);
   const openPanorama = async (seatId, fadeMs, gen) => {
+    panoramaLoadAbort?.abort();
+    const loadAbort = new AbortController();
+    panoramaLoadAbort = loadAbort;
+    const seatIndex = model.seats.idToIndex.get(seatId);
+    if (seatIndex === void 0) {
+      orbit.syncFromCamera();
+      return;
+    }
+    const seatLabel = expandedSeatById.get(seatId)?.label ?? seatId;
+    const seatPose = resolvedSeatViewPose(seatId, seatIndex);
     const viewPromise = ensureSeatView(seatId);
     if (!viewPromise) {
+      loadAbort.abort();
+      if (panoramaLoadAbort === loadAbort) panoramaLoadAbort = null;
       orbit.syncFromCamera();
       return;
     }
@@ -5513,34 +6424,56 @@ function mountVenue3D(container, input, opts = {}) {
     try {
       view = await viewPromise;
     } catch {
+      if (panoramaLoadAbort === loadAbort) panoramaLoadAbort = null;
+      analytics.panoramaFailed(seatId, "source");
       if (!disposed && gen === flightGen) {
         frozen = false;
-        orbit.resumeAfterFlight(model.focalWorld);
+        orbit.resumeAfterFlight(seatPose.focal);
         loop.requestRender();
+        const controls = showArriveChip(seatId, gen, true);
+        requestAnimationFrame(() => controls?.querySelector("[data-panorama-trigger]")?.focus());
       }
       return;
     }
-    if (disposed || gen !== flightGen) return;
+    if (disposed || gen !== flightGen) {
+      loadAbort.abort();
+      if (panoramaLoadAbort === loadAbort) panoramaLoadAbort = null;
+      return;
+    }
     removeArriveChip();
     const onClose = () => {
+      loadAbort.abort();
+      if (panoramaLoadAbort === loadAbort) panoramaLoadAbort = null;
       panorama = null;
+      restorePanoramaLayer();
+      overviewChip.style.display = "";
       labelOverlay.setVisible(true);
       frozen = false;
       analytics.panoramaClosed();
-      orbit.resumeAfterFlight(model.focalWorld);
+      orbit.resumeAfterFlight(seatPose.focal);
       loop.requestRender();
-      showArriveChip(seatId, flightGen);
+      const controls = showArriveChip(seatId, flightGen);
+      requestAnimationFrame(() => controls?.querySelector("[data-panorama-trigger]")?.focus());
     };
     const sceneMode = view.generated === true;
+    const disclosure = seatViewDisclosure(view);
+    raisePanoramaLayer();
+    overviewChip.style.display = "none";
+    const effectiveFadeMs = reducedMotion() ? 0 : fadeMs;
     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;
+      cameraOriginWorld: sceneMode ? seatPose.eye : void 0,
+      focalWorld: seatPose.focal
+    }, { fadeMs: effectiveFadeMs, seatLabel, disclosure, onClose, signal: loadAbort.signal }) : null;
     if (disposed || gen !== flightGen) {
+      loadAbort.abort();
+      if (panoramaLoadAbort === loadAbort) panoramaLoadAbort = null;
       spherical?.dispose();
+      overviewChip.style.display = "";
+      restorePanoramaLayer();
       return;
     }
     if (spherical) {
@@ -5550,12 +6483,21 @@ function mountVenue3D(container, input, opts = {}) {
       loop.requestRender();
       panorama = spherical;
     } else {
-      panorama = mountPanorama(container, view, { fadeMs, seatLabel: seatId, onClose });
+      analytics.panoramaFallback(seatId);
+      panorama = mountPanorama(container, view, {
+        fadeMs: effectiveFadeMs,
+        seatLabel,
+        disclosure,
+        onClose,
+        signal: loadAbort.signal
+      });
     }
     analytics.panoramaOpened();
   };
   const cancelFlight = () => {
     flightGen++;
+    panoramaLoadAbort?.abort();
+    panoramaLoadAbort = null;
     if (cinematic.active) {
       cinematic.cancel();
       orbit.resumeAfterFlight(model.focalWorld);
@@ -5565,15 +6507,19 @@ function mountVenue3D(container, input, opts = {}) {
     if (disposed || !gpu) return Promise.resolve();
     const idx = model.seats.idToIndex.get(seatId);
     if (idx === void 0) return Promise.resolve();
+    opts.onViewTargetChange?.(seatId);
     if (panorama) {
       panorama.dispose();
       panorama = null;
+      overviewChip.style.display = "";
+      restorePanoramaLayer();
     }
+    panoramaLoadAbort?.abort();
+    panoramaLoadAbort = null;
     frozen = false;
     const gen = ++flightGen;
     removeArriveChip();
-    const seatEye = seatEyeWorld(idx);
-    const focal = model.focalWorld;
+    const { eye: seatEye, focal } = resolvedSeatViewPose(seatId, idx);
     const start = [orbit.camera.position.x, orbit.camera.position.y, orbit.camera.position.z];
     const { waypoints, finalPos } = buildWaypoints(start, seatEye, focal, model.bounds.center, model.bounds.radius);
     if (reducedMotion()) {
@@ -5590,11 +6536,26 @@ function mountVenue3D(container, input, opts = {}) {
     return cinematic.start(waypoints, startQuat, endQuat).then(() => {
       if (disposed || gen !== flightGen) return;
       analytics.cinematicPlayed(FLIGHT_DURATION_MS);
-      orbit.resumeAfterFlight(model.focalWorld);
+      orbit.resumeAfterFlight(focal);
       loop.requestRender();
       showArriveChip(seatId, gen);
     });
   };
+  const focusSectionCamera = (sectionId) => {
+    const sec = model.sections.find((candidate) => candidate.id === sectionId);
+    if (!sec || sec.seatCount === 0) return false;
+    cinematic.cancel();
+    removeArriveChip();
+    setNavigationMode("pan");
+    showSectionSeatLabels(sectionId);
+    const dx = sec.focalWorld[0] - sec.center[0];
+    const dz = sec.focalWorld[2] - sec.center[2];
+    const azimuth = Math.hypot(dx, dz) > sec.radius * 0.12 ? Math.atan2(dx, dz) : void 0;
+    orbit.frame({ center: sec.center, radius: Math.max(5, sec.radius * 0.5) }, false, azimuth);
+    opts.onSectionFocusChange?.(sectionId);
+    loop.requestRender();
+    return true;
+  };
   let downX = 0, downY = 0, downT = 0, downId = -1, moved = false, suppressTap = false;
   const onDown = (e) => {
     if (downId !== -1) return;
@@ -5613,6 +6574,50 @@ function mountVenue3D(container, input, opts = {}) {
     if (e.pointerId !== downId) return;
     if (Math.hypot(e.clientX - downX, e.clientY - downY) > TAP_SLOP) moved = true;
   };
+  const pickNearestProjectedSeat = (clientX, clientY, sectionId, maxDistance, bookableOnly) => {
+    const rect = glctx.canvas.getBoundingClientRect();
+    const width = glctx.canvas.clientWidth || rect.width || 1;
+    const height = glctx.canvas.clientHeight || rect.height || 1;
+    const tapX = clientX - rect.left;
+    const tapY = clientY - rect.top;
+    const maxDistanceSq = maxDistance * maxDistance;
+    let bestIndex = -1;
+    let bestDistanceSq = maxDistanceSq;
+    let bestDepth = Infinity;
+    for (const seat of input.seats) {
+      if (sectionId && seat.sectionId !== sectionId) continue;
+      const index = model.seats.idToIndex.get(seat.id);
+      if (index === void 0) continue;
+      if (bookableOnly) {
+        const state = Math.round(model.seats.iState[index] ?? 0);
+        if (state !== 0 && state !== 3) continue;
+      }
+      const offset = index * 3;
+      const screen = projectToScreen(
+        orbit.camera.projectionViewMatrix,
+        [
+          model.seats.iPosition[offset],
+          // Match the visible chair/number rather than the deck-level instance
+          // origin. At strong zoom the vertical difference is dozens of pixels
+          // and a perfectly reasonable click on the chair otherwise misses.
+          model.seats.iPosition[offset + 1] + 0.55,
+          model.seats.iPosition[offset + 2]
+        ],
+        width,
+        height
+      );
+      if (!screen.visible) continue;
+      const dx = screen.x - tapX;
+      const dy = screen.y - tapY;
+      const distanceSq = dx * dx + dy * dy;
+      if (distanceSq < bestDistanceSq || Math.abs(distanceSq - bestDistanceSq) < 1 && screen.depth < bestDepth) {
+        bestIndex = index;
+        bestDistanceSq = distanceSq;
+        bestDepth = screen.depth;
+      }
+    }
+    return bestIndex;
+  };
   const onUp = (e) => {
     if (e.pointerId !== downId) return;
     const isTap = !moved && performance.now() - downT < TAP_MS;
@@ -5622,12 +6627,25 @@ function mountVenue3D(container, input, opts = {}) {
       return;
     }
     if (!isTap || !gpu || !pick) return;
-    pick.syncFromSeatProgram(gpu.seatProgram);
-    const rect = glctx.canvas.getBoundingClientRect();
-    const dpr = glctx.renderer.dpr;
-    const { x, y } = pickPixelCoords(e.clientX, e.clientY, rect, dpr, glctx.gl.drawingBufferWidth, glctx.gl.drawingBufferHeight);
-    const radius = Math.max(2, Math.round(8 * dpr));
-    const idx = pick.pick(orbit.camera, x, y, radius);
+    let idx = focusedSectionId ? pickNearestProjectedSeat(e.clientX, e.clientY, focusedSectionId, 44, true) : -1;
+    if (focusedSectionId && idx < 0) {
+      const sectionIndex = pickNearestProjectedSeat(e.clientX, e.clientY, null, 72, false);
+      const sectionSeatId = sectionIndex >= 0 ? seatIdByIndex[sectionIndex] : void 0;
+      const nextSectionId = sectionSeatId ? sectionIdBySeatId.get(sectionSeatId) : void 0;
+      if (nextSectionId && nextSectionId !== focusedSectionId && focusSectionCamera(nextSectionId)) return;
+    }
+    if (!focusedSectionId) {
+      pick.syncFromSeatProgram(gpu.seatProgram);
+      const rect = glctx.canvas.getBoundingClientRect();
+      const dpr = glctx.renderer.dpr;
+      const { x, y } = pickPixelCoords(e.clientX, e.clientY, rect, dpr, glctx.gl.drawingBufferWidth, glctx.gl.drawingBufferHeight);
+      const radius = Math.max(2, Math.round(8 * dpr));
+      idx = pick.pick(orbit.camera, x, y, radius);
+      if (idx < 0) idx = pickNearestProjectedSeat(e.clientX, e.clientY, null, 42, false);
+      const overviewSeatId = idx >= 0 ? seatIdByIndex[idx] : void 0;
+      const sectionId = overviewSeatId ? sectionIdBySeatId.get(overviewSeatId) : void 0;
+      if (sectionId && focusSectionCamera(sectionId)) return;
+    }
     if (idx < 0 || idx >= seatIdByIndex.length) {
       if (selection.size) setSelection([]);
       return;
@@ -5653,9 +6671,12 @@ function mountVenue3D(container, input, opts = {}) {
     },
     setSelection,
     flyToSeat,
+    focusOverview,
     resize() {
       const { width, height } = glctx.resize();
       orbit.setAspect(width / Math.max(1, height));
+      layoutArriveChip();
+      layoutNavigationChip();
       loop.requestRender();
     },
     stats() {
@@ -5680,6 +6701,7 @@ function mountVenue3D(container, input, opts = {}) {
         gpu.chairProgram.uniforms.uFocusFloor.value = value;
       }
       focusedFloor = value;
+      setNavigationMode("orbit");
       if (index !== null) {
         const f = model.floors[index];
         if (f.seatCount > 0) {
@@ -5697,6 +6719,9 @@ function mountVenue3D(container, input, opts = {}) {
       const zone = model.zones.find((z) => z.id === zoneId);
       if (!zone || zone.seatCount === 0) return false;
       cinematic.cancel();
+      setNavigationMode("orbit");
+      showSectionSeatLabels(null);
+      opts.onSectionFocusChange?.(null);
       const dx = zone.focalWorld[0] - zone.center[0];
       const dz = zone.focalWorld[2] - zone.center[2];
       const azimuth = Math.hypot(dx, dz) > zone.radius * 0.12 ? Math.atan2(dx, dz) : void 0;
@@ -5708,13 +6733,24 @@ function mountVenue3D(container, input, opts = {}) {
       return model.sections;
     },
     focusSection(sectionId) {
-      const sec = model.sections.find((s) => s.id === sectionId);
-      if (!sec || sec.seatCount === 0) return false;
+      return focusSectionCamera(sectionId);
+    },
+    rows(sectionId) {
+      return sectionId ? model.rows.filter((row) => row.sectionId === sectionId) : model.rows;
+    },
+    seatsInRow(rowId) {
+      return input.seats.filter((seat) => seat.rowId === rowId).map((seat) => ({ id: seat.id, label: seat.displayLabel || seat.label }));
+    },
+    focusRow(rowId) {
+      const row = model.rows.find((candidate) => candidate.id === rowId);
+      if (!row || row.seatCount === 0) return false;
       cinematic.cancel();
-      const dx = sec.focalWorld[0] - sec.center[0];
-      const dz = sec.focalWorld[2] - sec.center[2];
-      const azimuth = Math.hypot(dx, dz) > sec.radius * 0.12 ? Math.atan2(dx, dz) : void 0;
-      orbit.frame({ center: sec.center, radius: sec.radius * 1.45 }, false, azimuth);
+      setNavigationMode("pan");
+      if (row.sectionId) {
+        showSectionSeatLabels(row.sectionId);
+        opts.onSectionFocusChange?.(row.sectionId);
+      }
+      orbit.frame({ center: row.center, radius: Math.max(2.5, row.radius * 0.65) });
       loop.requestRender();
       return true;
     },
@@ -5725,6 +6761,7 @@ function mountVenue3D(container, input, opts = {}) {
       disposed = true;
       removeArriveChip();
       overviewChip.remove();
+      navigationModeChip.remove();
       cancelFlight();
       loop.stop();
       labelOverlay.dispose();
@@ -5733,6 +6770,8 @@ function mountVenue3D(container, input, opts = {}) {
         panorama.dispose();
         panorama = null;
       }
+      restorePanoramaLayer();
+      restoreContainerPosition();
       glctx.canvas.removeEventListener("pointerdown", onDown);
       glctx.canvas.removeEventListener("pointermove", onMove);
       glctx.canvas.removeEventListener("pointerup", onUp);
@@ -5745,12 +6784,21 @@ function mountVenue3D(container, input, opts = {}) {
       glctx.dispose();
     }
   };
-  analytics.opened(model.seatCount, hasHeights);
+  analytics.opened(
+    model.seatCount,
+    hasHeights,
+    input.prepared?.buildMs ?? performance.now() - buildStartedAt,
+    // Known synchronously at mount: either the caller handed us a scene
+    // prepared by `prepareVenue3D` (which reports worker vs. main-thread
+    // fallback) or we compiled it inline here. Never delays the event.
+    input.prepared?.source ?? "inline"
+  );
   return handle;
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   buildSceneModel,
-  mountVenue3D
+  mountVenue3D,
+  prepareVenue3D
 });
 //# sourceMappingURL=index.cjs.map