@seatlayer/core 0.25.0 → 0.26.0

package/dist/index.js

@@ -4,6 +4,7 @@ var ACCESSIBILITY_TYPES = [
   { key: "companion", label: "Companion seat", short: "Companion", icon: "\u{1F9D1}\u200D\u{1F91D}\u200D\u{1F9D1}" },
   { key: "semi-ambulatory", label: "Semi-ambulatory (limited mobility)", short: "Limited mobility", icon: "\u{1F9AF}" },
   { key: "hearing", label: "Assistive listening", short: "Hearing", icon: "\u{1F9BB}" },
+  { key: "cart", label: "CART live-caption view", short: "CART captions", icon: "CC" },
   { key: "sign-language", label: "Sign-language view", short: "Sign language", icon: "\u{1F91F}" },
   { key: "plus-size", label: "Plus-size seat", short: "Plus-size", icon: "\u{1F4BA}" },
   { key: "lift-armrest", label: "Lift-up armrest", short: "Lift armrest", icon: "\u2195\uFE0F" }
@@ -17,6 +18,7 @@ var ACCESSIBILITY_RING_COLOR = {
   companion: "#8b5cf6",
   "semi-ambulatory": "#0ea5e9",
   hearing: "#14b8a6",
+  cart: "#7c3aed",
   "sign-language": "#f59e0b",
   "plus-size": "#ec4899",
   "lift-armrest": "#22c55e"
@@ -27,6 +29,19 @@ function accessibilityRingColor(types) {
 }
 var LABEL_STYLE_MIN_SIZE = 8;
 var LABEL_STYLE_MAX_SIZE = 24;
+var SURROUNDINGS_SHAPE_ROLES = [
+  "reference-focal",
+  "bar",
+  "entrance",
+  "exit",
+  "restroom",
+  "screen",
+  "sound",
+  "concession",
+  "coat",
+  "wall"
+];
+var SURROUNDINGS_SHAPE_ROLE_SET = new Set(SURROUNDINGS_SHAPE_ROLES);
 function layerOf(obj) {
   switch (obj.type) {
     case "row":
@@ -35,10 +50,17 @@ function layerOf(obj) {
     case "booth":
     case "section":
       return "interactive";
-    // stage / décor live on 'shape'; free text + decor images are background furniture.
+    // Raster décor follows its explicit authored z-layer. Absence retains the
+    // legacy Background default; bitmap content is never guessed semantically.
+    case "decorImage":
+      return obj.layer === "foreground" ? "foreground" : "background";
+    // Source-backed focal geometry and curated venue landmarks help an author
+    // orient around the sellable plan. A stage and an ordinary authored shape
+    // remain Background even when they carry an arbitrary/custom role.
     case "shape":
+      return obj.role && SURROUNDINGS_SHAPE_ROLE_SET.has(obj.role) ? "surroundings" : "background";
+    // Free text — including semantic icon text — is background furniture.
     case "text":
-    case "decorImage":
       return "background";
     default:
       return "interactive";
@@ -158,10 +180,57 @@ function toRoman(value) {
   return out;
 }
 
+// src/core/units.ts
+var METRES_PER_CHART_UNIT = 0.55 / 24;
+var CHART_UNITS_PER_METRE = 1 / METRES_PER_CHART_UNIT;
+var LIFT_PER_STEP_WORLD = 58;
+var TIER_HEIGHT_M = LIFT_PER_STEP_WORLD * METRES_PER_CHART_UNIT;
+var SECTION_ELEVATION_TIER_MIN = 0;
+var SECTION_ELEVATION_TIER_MAX = 3;
+var SECTION_HEIGHT_MIN_M = 0;
+var SECTION_HEIGHT_MAX_M = 120;
+var SECTION_RAKE_MIN_DEG = 0;
+var SECTION_RAKE_MAX_DEG = 45;
+var LEGACY_SECTION_ELEVATION_TIER_MAX = 7;
+var SEATED_EYE_HEIGHT_M = 1.2;
+function finiteClamped(value, min, max, fallback) {
+  return Number.isFinite(value) ? Math.max(min, Math.min(max, value)) : fallback;
+}
+function sectionElevationTier(value) {
+  if (!Number.isFinite(value)) return SECTION_ELEVATION_TIER_MIN;
+  return Math.max(
+    SECTION_ELEVATION_TIER_MIN,
+    Math.min(SECTION_ELEVATION_TIER_MAX, Math.round(value))
+  );
+}
+function compatibleAutomaticTier(value) {
+  if (!Number.isFinite(value) || !Number.isInteger(value) || value < 0) return 0;
+  if (value <= LEGACY_SECTION_ELEVATION_TIER_MAX) return value;
+  return SECTION_ELEVATION_TIER_MAX;
+}
+function sectionGeometry(section, context = {}) {
+  const floorBaseHeightM = finiteClamped(
+    context.floorBaseHeightM,
+    SECTION_HEIGHT_MIN_M,
+    SECTION_HEIGHT_MAX_M,
+    0
+  );
+  const automaticHeight = Math.min(
+    SECTION_HEIGHT_MAX_M,
+    floorBaseHeightM + compatibleAutomaticTier(section.elevation) * TIER_HEIGHT_M
+  );
+  const height = section.height === void 0 ? automaticHeight : finiteClamped(section.height, SECTION_HEIGHT_MIN_M, SECTION_HEIGHT_MAX_M, automaticHeight);
+  const rake = finiteClamped(section.rake, SECTION_RAKE_MIN_DEG, SECTION_RAKE_MAX_DEG, 0);
+  return { height, rake };
+}
+
 // src/core/layout.ts
 function overrideAccessibility(o) {
   if (!o) return [];
-  if (o.accessibility && o.accessibility.length) return o.accessibility;
+  if (o.accessibility && o.accessibility.length) {
+    return o.wheelchairSpaceType && !o.accessibility.includes("wheelchair") ? ["wheelchair", ...o.accessibility] : o.accessibility;
+  }
+  if (o.wheelchairSpaceType) return ["wheelchair"];
   return o.accessible ? ["wheelchair"] : [];
 }
 var DEG = Math.PI / 180;
@@ -203,6 +272,10 @@ function overrideMap(row) {
   if (row.overrides) for (const o of row.overrides) m.set(o.index, o);
   return m;
 }
+function rowInventoryCount(row) {
+  const skipped = new Set((row.overrides ?? []).filter((override) => override.skip && Number.isInteger(override.index) && override.index >= 0 && override.index < row.seatCount).map((override) => override.index));
+  return Math.max(0, row.seatCount - skipped.size);
+}
 function centerRank(n) {
   const rank = new Array(n);
   Array.from({ length: n }, (_, i) => i).sort((a, b) => Math.abs(2 * a - (n - 1)) - Math.abs(2 * b - (n - 1)) || a - b).forEach((idx, k) => rank[idx] = k);
@@ -216,9 +289,9 @@ function seatLabelPart(row, i) {
   const prefix = row.seatNumbering?.prefix ?? "";
   const endAt = row.seatNumbering?.endAt;
   const n = row.seatCount;
-  if (scheme === "updown") {
+  if (scheme === "updown" || scheme === "updown-descending") {
     const half = Math.ceil(n / 2);
-    const core2 = i < half ? rawStart + 2 * i : rawStart - 1 + 2 * (n - i);
+    const core2 = scheme === "updown" ? i < half ? rawStart + 2 * i : rawStart - 1 + 2 * (n - i) : i < half ? rawStart + 2 * (half - 1 - i) : rawStart + 1 + 2 * (i - half);
     return `${prefix}${core2}`;
   }
   const effStep = scheme === "odd" || scheme === "even" ? 2 : step;
@@ -271,6 +344,7 @@ function expandRowSlots(row) {
       skipped: !!o?.skip,
       accessible: accessibility.length > 0,
       accessibility,
+      wheelchairSpaceType: o?.wheelchairSpaceType,
       commercial: Object.values(commercial).some((value) => value !== void 0 && value !== false && value !== "") ? commercial : void 0,
       viewUrl: o?.viewFromSeatUrl ?? row.viewFromSeatUrl,
       labelStyle: o?.labelStyle
@@ -291,6 +365,7 @@ function expandRow(row) {
       categoryKey: slot.categoryKey,
       accessible: slot.accessible || void 0,
       accessibility: slot.accessibility.length ? slot.accessibility : void 0,
+      wheelchairSpaceType: slot.wheelchairSpaceType,
       commercial: slot.commercial,
       viewUrl: slot.viewUrl,
       labelStyle: slot.labelStyle
@@ -298,18 +373,43 @@ function expandRow(row) {
   }
   return seats;
 }
-function expandTable(t2) {
+function tableSeatCountsBySide(t2) {
+  if (t2.seatCountsBySide) return { ...t2.seatCountsBySide };
+  const enabled = t2.sides && t2.sides.length ? t2.sides : ["top", "bottom"];
+  const order = ["top", "bottom", "left", "right"].filter((side) => enabled.includes(side));
+  const counts = { top: 0, bottom: 0, left: 0, right: 0 };
+  if (!order.length) return counts;
+  const n = Math.max(0, Math.round(t2.seatCount));
+  for (let index = 0; index < n; index++) counts[order[index % order.length]] += 1;
+  return counts;
+}
+function expandTableSlots(t2) {
   const seats = [];
   const n = Math.max(0, Math.round(t2.seatCount));
   if (n === 0) return seats;
-  const mk = (i, x, y) => ({
-    id: `${t2.id}:${i}`,
-    label: `${t2.label}-${i + 1}`,
-    x,
-    y,
-    rowId: t2.id,
-    categoryKey: t2.categoryKey
-  });
+  const overrides2 = new Map((t2.overrides ?? []).map((override) => [override.index, override]));
+  const mk = (index, x, y, side) => {
+    const override = overrides2.get(index);
+    const accessibility = overrideAccessibility(override);
+    const label = override?.label ?? `${t2.label}-${index + 1}`;
+    const displayPrefix = t2.displayLabel ?? t2.label;
+    return {
+      index,
+      label,
+      displayLabel: override?.displayLabel ?? `${displayPrefix}-${index + 1}`,
+      x: x + (override?.dx ?? 0),
+      y: y + (override?.dy ?? 0),
+      categoryKey: override?.categoryKey ?? t2.categoryKey,
+      skipped: !!override?.skip,
+      accessible: accessibility.length > 0,
+      accessibility,
+      wheelchairSpaceType: override?.wheelchairSpaceType,
+      commercial: override?.commercial,
+      viewUrl: override?.viewFromSeatUrl,
+      labelStyle: override?.labelStyle,
+      ...side ? { side } : {}
+    };
+  };
   if (t2.shape === "round") {
     const R = (t2.radius ?? 40) + TABLE_SEAT_OFFSET;
     const base = t2.rotation * DEG;
@@ -332,17 +432,11 @@ function expandTable(t2) {
   }
   const w = t2.width ?? 80;
   const h = t2.height ?? 50;
-  const enabled = t2.sides && t2.sides.length ? t2.sides : ["top", "bottom"];
-  const order = ["top", "bottom", "left", "right"].filter((s) => enabled.includes(s));
-  if (!order.length) return seats;
-  const counts = new Map(order.map((s) => [s, 0]));
-  for (let i = 0; i < n; i++) {
-    const s = order[i % order.length];
-    counts.set(s, counts.get(s) + 1);
-  }
+  const counts = tableSeatCountsBySide(t2);
+  const order = ["top", "bottom", "left", "right"];
   let idx = 0;
   for (const side of order) {
-    const count = counts.get(side);
+    const count = counts[side];
     for (let j = 0; j < count; j++) {
       let localX;
       let localY;
@@ -359,17 +453,39 @@ function expandTable(t2) {
         localX = w / 2 + TABLE_SEAT_OFFSET;
         localY = -h / 2 + (j + 0.5) * h / count;
       }
-      const p = place(localX, localY, t2.rotation, t2.center);
-      seats.push(mk(idx++, p.x, p.y));
+      const point = place(localX, localY, t2.rotation, t2.center);
+      seats.push(mk(idx++, point.x, point.y, side));
     }
   }
   return seats;
 }
+function tableInventoryCount(t2) {
+  if (t2.bookAsWhole || t2.variableOccupancy) return Math.max(0, Math.round(t2.seatCount));
+  return expandTableSlots(t2).filter((slot) => !slot.skipped).length;
+}
+function expandTable(t2) {
+  return expandTableSlots(t2).filter((slot) => !slot.skipped).map((slot) => ({
+    id: `${t2.id}:${slot.index}`,
+    label: slot.label,
+    ...slot.displayLabel !== slot.label ? { displayLabel: slot.displayLabel } : {},
+    x: slot.x,
+    y: slot.y,
+    rowId: t2.id,
+    categoryKey: slot.categoryKey,
+    ...slot.accessible ? { accessible: true } : {},
+    ...slot.accessibility.length ? { accessibility: slot.accessibility } : {},
+    ...slot.wheelchairSpaceType ? { wheelchairSpaceType: slot.wheelchairSpaceType } : {},
+    ...slot.commercial ? { commercial: slot.commercial } : {},
+    ...slot.viewUrl ? { viewUrl: slot.viewUrl } : {},
+    ...slot.labelStyle ? { labelStyle: slot.labelStyle } : {}
+  }));
+}
 function expandBooth(b) {
   return [
     {
       id: `${b.id}:0`,
       label: b.label,
+      ...b.displayLabel && b.displayLabel !== b.label ? { displayLabel: b.displayLabel } : {},
       x: b.center.x,
       y: b.center.y,
       rowId: b.id,
@@ -407,7 +523,7 @@ function polygonLabelPoint(outer, holes) {
   if (!outer.length) return { x: 0, y: 0 };
   const xs = outer.map((point) => point.x);
   const ys = outer.map((point) => point.y);
-  const bounds = { minX: Math.min(...xs), maxX: Math.max(...xs), minY: Math.min(...ys), maxY: Math.max(...ys) };
+  const bounds2 = { minX: Math.min(...xs), maxX: Math.max(...xs), minY: Math.min(...ys), maxY: Math.max(...ys) };
   const centroid2 = polygonCentroid(outer);
   if (pointInPolygonWithHoles(centroid2, outer, holes)) return centroid2;
   let best = outer[0];
@@ -416,8 +532,8 @@ function polygonLabelPoint(outer, holes) {
   for (let row = 1; row < 24; row += 1) {
     for (let column = 1; column < 24; column += 1) {
       const point = {
-        x: bounds.minX + (bounds.maxX - bounds.minX) * column / 24,
-        y: bounds.minY + (bounds.maxY - bounds.minY) * row / 24
+        x: bounds2.minX + (bounds2.maxX - bounds2.minX) * column / 24,
+        y: bounds2.minY + (bounds2.maxY - bounds2.minY) * row / 24
       };
       if (!pointInPolygonWithHoles(point, outer, holes)) continue;
       const score = Math.min(...rings.flatMap((ring) => ring.map((start, index) => {
@@ -479,9 +595,32 @@ function objectCenter(o) {
       return { x: o.x + o.width / 2, y: o.y + o.height / 2 };
   }
 }
+function samePoints(left, right) {
+  return left.length === right.length && left.every((point, index) => point.x === right[index].x && point.y === right[index].y);
+}
+function sameGASurfaceAsSection(object, section) {
+  if (object.type !== "gaArea" || !samePoints(object.points, section.outline)) return false;
+  const objectHoles = object.holes ?? [];
+  const sectionHoles = section.holes ?? [];
+  return objectHoles.length === sectionHoles.length && objectHoles.every((hole, index) => samePoints(hole, sectionHoles[index]));
+}
+function owningSectionForObject(objects, object) {
+  const sections = objects.filter((candidate) => candidate.type === "section");
+  const referencedLogicalId = "referenceInventorySource" in object ? object.referenceInventorySource?.logicalSectionId : void 0;
+  const center = objectCenter(object);
+  const referencedOwner = referencedLogicalId ? sections.find((section) => (section.logicalSectionId ?? section.id) === referencedLogicalId && (sameGASurfaceAsSection(object, section) || pointInPolygonWithHoles(center, section.outline, section.holes))) : void 0;
+  return referencedOwner ?? sections.find((section) => pointInPolygonWithHoles(center, section.outline, section.holes));
+}
 function floorsOf(doc) {
   if (doc.floors && doc.floors.length) return doc.floors;
-  return [{ id: "floor-0", name: "Main", objects: doc.objects, focalPoint: doc.focalPoint, backgroundImage: doc.backgroundImage }];
+  return [{
+    id: "floor-0",
+    name: "Main",
+    objects: doc.objects,
+    focalPoint: doc.focalPoint,
+    referenceImage: doc.referenceImage,
+    backgroundImage: doc.backgroundImage
+  }];
 }
 function floorObjects(doc, floorId) {
   const floors = floorsOf(doc);
@@ -530,15 +669,138 @@ function stackFloors(doc, spread = 900) {
   });
   return { ...doc, objects, floors: void 0 };
 }
-function expandChart(doc) {
+function expandFloorObjects(objects, zones, fallbackFocal) {
   const out = [];
-  for (const obj of allObjects(doc)) {
-    if (obj.type === "row") out.push(...expandRow(obj));
-    else if (obj.type === "table") out.push(...expandTable(obj));
-    else if (obj.type === "booth") out.push(...expandBooth(obj));
+  const segmented = /* @__PURE__ */ new Map();
+  const grouped = /* @__PURE__ */ new Map();
+  for (const object of objects) {
+    if (object.type !== "row" || !object.segmentedRow) continue;
+    const list = grouped.get(object.segmentedRow.groupId) ?? [];
+    list.push(object);
+    grouped.set(object.segmentedRow.groupId, list);
+  }
+  for (const [groupId, members] of grouped) {
+    const ordered = members.slice().sort((left, right) => left.segmentedRow.componentIndex - right.segmentedRow.componentIndex);
+    const expectedCount = ordered[0]?.segmentedRow?.componentCount ?? 0;
+    const first = ordered[0]?.segmentedRow;
+    if (!first) continue;
+    const valid = expectedCount >= 2 && ordered.length === expectedCount && first?.boundaryBefore === "start" && ordered.every((row, index) => row.segmentedRow?.kind === "segmented-row-v1" && row.segmentedRow.groupId === groupId && row.segmentedRow.componentCount === expectedCount && row.segmentedRow.componentIndex === index && (index === 0 ? row.segmentedRow.boundaryBefore === "start" : row.segmentedRow.boundaryBefore !== "start") && row.segmentedRow.displayLabel === first.displayLabel);
+    if (!valid) continue;
+    const totalSeats = ordered.reduce((sum, row) => sum + row.seatCount, 0);
+    let adjacencyOffset = 0;
+    let displayOffset = 0;
+    for (const row of ordered) {
+      if (row.segmentedRow.boundaryBefore === "break") adjacencyOffset += 1;
+      segmented.set(row.id, {
+        groupId,
+        adjacencyOffset,
+        displayOffset,
+        displayLabel: first.displayLabel,
+        totalSeats,
+        canonical: ordered[0],
+        viewFromSeatUrl: first.viewFromSeatUrl
+      });
+      adjacencyOffset += row.seatCount;
+      displayOffset += row.seatCount;
+    }
+  }
+  for (const obj of objects) {
+    let seats = [];
+    if (obj.type === "row") seats = expandRow(obj);
+    else if (obj.type === "table") seats = expandTable(obj);
+    else if (obj.type === "booth") seats = expandBooth(obj);
+    if (!seats.length) continue;
+    if (obj.type === "row") {
+      const logical = segmented.get(obj.id);
+      if (logical) {
+        const overrides2 = new Map((obj.overrides ?? []).map((override) => [override.index, override]));
+        for (const seat of seats) {
+          const physicalIndex = Number(seat.id.slice(seat.id.lastIndexOf(":") + 1));
+          if (!Number.isInteger(physicalIndex)) continue;
+          const displayOrdinal = logical.displayOffset + physicalIndex;
+          seat.logicalRowId = logical.groupId;
+          seat.logicalSeatIndex = logical.adjacencyOffset + physicalIndex;
+          if (!overrides2.get(physicalIndex)?.displayLabel) {
+            const numberingRow = {
+              ...logical.canonical,
+              seatCount: logical.totalSeats,
+              label: logical.displayLabel,
+              displayLabel: logical.displayLabel
+            };
+            seat.displayLabel = `${logical.displayLabel}-${seatLabelPart(numberingRow, displayOrdinal)}`;
+          }
+          seat.viewUrl ??= logical.viewFromSeatUrl;
+        }
+      }
+    }
+    const owner = owningSectionForObject(objects, obj);
+    const inheritedView = owner?.viewFromSeatUrl;
+    const zone = owner?.zone ? zones?.find((candidate) => candidate.id === owner.zone) : void 0;
+    const resolvedFocal = zone?.focalPoint ?? fallbackFocal;
+    for (const seat of seats) {
+      if (inheritedView) seat.viewUrl ??= inheritedView;
+      if (owner) seat.sectionId = owner.logicalSectionId ?? owner.id;
+      if (owner?.zone) seat.zoneId = owner.zone;
+      if (resolvedFocal) seat.focalPoint = { ...resolvedFocal };
+    }
+    out.push(...seats);
   }
   return out;
 }
+function expandChart(doc, options = {}) {
+  if (doc.floors?.length) {
+    const out2 = [];
+    for (const floor of doc.floors) {
+      const floorFocal = floor.focalPoint ?? doc.focalPoint;
+      const seats = expandFloorObjects(floor.objects, doc.zones, floorFocal);
+      assignEyeHeights(floor.objects, floor.focalPoint ?? doc.focalPoint, floor.baseHeightM ?? 0, seats);
+      out2.push(...seats);
+    }
+    return out2;
+  }
+  const out = expandFloorObjects(doc.objects, doc.zones, doc.focalPoint);
+  assignEyeHeights(doc.objects, doc.focalPoint, options.floorBaseHeightM ?? 0, out);
+  return out;
+}
+function assignEyeHeights(objects, focal, floorBaseHeightM, seats) {
+  const sections = objects.filter((o) => o.type === "section");
+  const hasGeometry = floorBaseHeightM > 0 || sections.some((s) => s.height !== void 0 || s.rake !== void 0 || (s.elevation ?? 0) > 0);
+  if (!sections.length || !hasGeometry || !focal) {
+    for (const seat of seats) seat.eyeHeightM = floorBaseHeightM + SEATED_EYE_HEIGHT_M;
+    return;
+  }
+  const owner = new Array(seats.length);
+  const geo = /* @__PURE__ */ new Map();
+  const frontDistU = /* @__PURE__ */ new Map();
+  for (let i = 0; i < seats.length; i++) {
+    const seat = seats[i];
+    const sec = sections.find((s) => pointInPolygonWithHoles({ x: seat.x, y: seat.y }, s.outline, s.holes)) ?? null;
+    owner[i] = sec;
+    if (!sec) continue;
+    if (!geo.has(sec.id)) geo.set(sec.id, sectionGeometry(sec, { floorBaseHeightM }));
+    const seatFocal = seat.focalPoint ?? focal;
+    const d = Math.hypot(seat.x - seatFocal.x, seat.y - seatFocal.y);
+    const cur = frontDistU.get(sec.id);
+    if (cur === void 0 || d < cur) frontDistU.set(sec.id, d);
+  }
+  for (let i = 0; i < seats.length; i++) {
+    const seat = seats[i];
+    const sec = owner[i];
+    if (!sec) {
+      seat.eyeHeightM = floorBaseHeightM + SEATED_EYE_HEIGHT_M;
+      continue;
+    }
+    const g = geo.get(sec.id);
+    let riseM = 0;
+    if (g.rake > 0) {
+      const seatFocal = seat.focalPoint ?? focal;
+      const d = Math.hypot(seat.x - seatFocal.x, seat.y - seatFocal.y);
+      const depthU = Math.max(0, d - (frontDistU.get(sec.id) ?? d));
+      riseM = depthU * METRES_PER_CHART_UNIT * Math.tan(g.rake * Math.PI / 180);
+    }
+    seat.eyeHeightM = g.height + riseM + SEATED_EYE_HEIGHT_M;
+  }
+}
 var PAD = 40;
 function chartBounds(doc) {
   let minX = Infinity;
@@ -582,8 +844,9 @@ function chartBounds(doc) {
       acc(obj.position.x + w, obj.position.y + obj.fontSize);
     }
   }
-  if (doc.backgroundImage) {
-    const { center, width } = doc.backgroundImage;
+  for (const image of [doc.referenceImage, doc.backgroundImage]) {
+    if (!image) continue;
+    const { center, width } = image;
     const bh = width * 3 / 4;
     acc(center.x - width / 2, center.y - bh / 2);
     acc(center.x + width / 2, center.y + bh / 2);
@@ -607,9 +870,55 @@ var MAX_EVENT_INVENTORY = 1e5;
 function gaUnitLabel(areaId, index) {
   return `${PREFIX}${encodeURIComponent(areaId)}__${index + 1}`;
 }
-function gaUnitLabels(area) {
+function validGAInventorySegments(area) {
+  const segments = area.inventorySegments;
+  if (segments === void 0) return true;
+  if (!Array.isArray(segments) || segments.length < 1 || segments.length > 256) return false;
+  let total = 0;
+  const ranges = /* @__PURE__ */ new Map();
+  for (const segment of segments) {
+    if (!segment || typeof segment.sourceAreaId !== "string" || !segment.sourceAreaId.trim() || segment.sourceAreaId.length > 160 || !Number.isInteger(segment.startIndex) || segment.startIndex < 0 || !Number.isInteger(segment.count) || segment.count < 1 || segment.startIndex + segment.count > MAX_GA_CAPACITY) return false;
+    total += segment.count;
+    if (total > MAX_GA_CAPACITY) return false;
+    const sourceRanges = ranges.get(segment.sourceAreaId) ?? [];
+    const end = segment.startIndex + segment.count;
+    if (sourceRanges.some((range) => segment.startIndex < range.end && end > range.start)) return false;
+    sourceRanges.push({ start: segment.startIndex, end });
+    ranges.set(segment.sourceAreaId, sourceRanges);
+  }
+  return total === area.capacity;
+}
+function gaInventorySegments(area) {
   const capacity = Math.min(MAX_GA_CAPACITY, Math.max(0, Math.floor(area.capacity)));
-  return Array.from({ length: capacity }, (_, i) => gaUnitLabel(area.id, i));
+  if (area.inventorySegments === void 0) {
+    return capacity ? [{ sourceAreaId: area.id, startIndex: 0, count: capacity }] : [];
+  }
+  if (!validGAInventorySegments(area)) return [];
+  return area.inventorySegments.map((segment) => ({ ...segment }));
+}
+function gaUnitLabels(area) {
+  return gaInventorySegments(area).flatMap((segment) => Array.from(
+    { length: segment.count },
+    (_, offset) => gaUnitLabel(segment.sourceAreaId, segment.startIndex + offset)
+  ));
+}
+function growJoinedGAInventory(area, nextCapacity) {
+  if (area.inventorySegments === void 0 || nextCapacity === area.capacity) return area.inventorySegments;
+  if (nextCapacity < area.capacity) return void 0;
+  const segments = gaInventorySegments(area);
+  if (!segments.length) return void 0;
+  const extra = nextCapacity - area.capacity;
+  if (!extra) return segments;
+  const ownRanges = segments.filter((segment) => segment.sourceAreaId === area.id);
+  const startIndex = ownRanges.reduce((max, segment) => Math.max(max, segment.startIndex + segment.count), 0);
+  const last = segments[segments.length - 1];
+  if (last?.sourceAreaId === area.id && last.startIndex + last.count === startIndex) {
+    last.count += extra;
+  } else {
+    if (segments.length >= 256) return void 0;
+    segments.push({ sourceAreaId: area.id, startIndex, count: extra });
+  }
+  return segments;
 }
 function gaAreasOf(doc) {
   return allObjects(doc).filter((o) => o.type === "gaArea");
@@ -630,15 +939,6 @@ function objectSeatLabels(o) {
 function isSeatObject(o) {
   return o.type === "row" || o.type === "table" || o.type === "booth" || o.type === "gaArea";
 }
-function samePoints(left, right) {
-  return left.length === right.length && left.every((point, index) => point.x === right[index].x && point.y === right[index].y);
-}
-function sameGASurfaceAsSection(object, section) {
-  if (object.type !== "gaArea" || !samePoints(object.points, section.outline)) return false;
-  const objectHoles = object.holes ?? [];
-  const sectionHoles = section.holes ?? [];
-  return objectHoles.length === sectionHoles.length && objectHoles.every((hole, index) => samePoints(hole, sectionHoles[index]));
-}
 function computeSections(doc) {
   const objs = allObjects(doc);
   const sectionObjs = objs.filter((o) => o.type === "section");
@@ -664,10 +964,7 @@ function computeSections(doc) {
     if (!isSeatObject(obj)) continue;
     const labels = objectSeatLabels(obj);
     if (labels.length === 0) continue;
-    const referencedLogicalId = obj.referenceInventorySource?.logicalSectionId;
-    const c = objectCenter(obj);
-    const referencedOwner = referencedLogicalId ? sectionObjs.find((section) => (section.logicalSectionId ?? section.id) === referencedLogicalId && (sameGASurfaceAsSection(obj, section) || pointInPolygonWithHoles(c, section.outline, section.holes))) : void 0;
-    const owner = referencedOwner ?? sectionObjs.find((s) => pointInPolygonWithHoles(c, s.outline, s.holes));
+    const owner = owningSectionForObject(objs, obj);
     const node = owner ? nodes.get(owner.logicalSectionId ?? owner.id) : ungrouped;
     node.seatCount += labels.length;
     node.objectIds.push(obj.id);
@@ -1238,11 +1535,310 @@ import { Circle } from "konva/lib/shapes/Circle";
 import { Rect } from "konva/lib/shapes/Rect";
 import { Ellipse } from "konva/lib/shapes/Ellipse";
 import { Line } from "konva/lib/shapes/Line";
+import { Arrow } from "konva/lib/shapes/Arrow";
 import { Text } from "konva/lib/shapes/Text";
 import { Path } from "konva/lib/shapes/Path";
 import { Image as KImage } from "konva/lib/shapes/Image";
 import { Shape } from "konva/lib/Shape";
 
+// src/core/chartBackgrounds.ts
+function buyerBackgroundImage(owner) {
+  const background = owner.backgroundImage;
+  return background?.url && !background.assetId ? background : void 0;
+}
+
+// src/core/spatialIndex.ts
+var DEFAULT_SEAT_RADIUS = 9;
+function halfExtents(shape) {
+  if (shape.kind === "circle") return { hx: shape.r, hy: shape.r };
+  const hw = shape.width / 2;
+  const hh = shape.height / 2;
+  const rot = shape.rotation ?? 0;
+  if (!rot) return { hx: hw, hy: hh };
+  const rad = rot * Math.PI / 180;
+  const c = Math.abs(Math.cos(rad));
+  const s = Math.abs(Math.sin(rad));
+  return { hx: hw * c + hh * s, hy: hw * s + hh * c };
+}
+function shapeIntersectsRect(e, x0, y0, x1, y1) {
+  if (e.shape.kind === "circle") {
+    const cx = Math.min(Math.max(e.seat.x, x0), x1);
+    const cy = Math.min(Math.max(e.seat.y, y0), y1);
+    const dx = e.seat.x - cx;
+    const dy = e.seat.y - cy;
+    return dx * dx + dy * dy <= e.shape.r * e.shape.r;
+  }
+  const rot = e.shape.rotation ?? 0;
+  if (!rot) {
+    return e.seat.x - e.hx <= x1 && e.seat.x + e.hx >= x0 && e.seat.y - e.hy <= y1 && e.seat.y + e.hy >= y0;
+  }
+  const rad = rot * Math.PI / 180;
+  const c = Math.cos(rad);
+  const s = Math.sin(rad);
+  const hw = e.shape.width / 2;
+  const hh = e.shape.height / 2;
+  const corners = [
+    [-hw, -hh],
+    [hw, -hh],
+    [hw, hh],
+    [-hw, hh]
+  ].map(([lx, ly]) => [e.seat.x + lx * c - ly * s, e.seat.y + lx * s + ly * c]);
+  const query = [
+    [x0, y0],
+    [x1, y0],
+    [x1, y1],
+    [x0, y1]
+  ];
+  const axes = [
+    [1, 0],
+    [0, 1],
+    [c, s],
+    [-s, c]
+  ];
+  for (const [ax, ay] of axes) {
+    let minA = Infinity;
+    let maxA = -Infinity;
+    for (const [px, py] of corners) {
+      const d = px * ax + py * ay;
+      if (d < minA) minA = d;
+      if (d > maxA) maxA = d;
+    }
+    let minB = Infinity;
+    let maxB = -Infinity;
+    for (const [px, py] of query) {
+      const d = px * ax + py * ay;
+      if (d < minB) minB = d;
+      if (d > maxB) maxB = d;
+    }
+    if (maxA < minB || maxB < minA) return false;
+  }
+  return true;
+}
+function buildSeatIndex(seats, opts = {}) {
+  const seatRadius = opts.seatRadius ?? DEFAULT_SEAT_RADIUS;
+  const n = seats.length;
+  const entries = new Array(n);
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxHalf = 0;
+  for (let i = 0; i < n; i++) {
+    const seat = seats[i];
+    const shape = opts.shapeOf?.(seat) ?? { kind: "circle", r: seatRadius };
+    const { hx, hy } = halfExtents(shape);
+    entries[i] = { seat, shape, hx, hy };
+    if (seat.x - hx < minX) minX = seat.x - hx;
+    if (seat.y - hy < minY) minY = seat.y - hy;
+    if (seat.x + hx > maxX) maxX = seat.x + hx;
+    if (seat.y + hy > maxY) maxY = seat.y + hy;
+    if (hx > maxHalf) maxHalf = hx;
+    if (hy > maxHalf) maxHalf = hy;
+  }
+  if (n === 0) {
+    minX = 0;
+    minY = 0;
+    maxX = 0;
+    maxY = 0;
+  }
+  const nominal = maxHalf > 0 ? maxHalf * 4 : 1;
+  const spanX = Math.max(maxX - minX, 0);
+  const spanY = Math.max(maxY - minY, 0);
+  const maxCells = Math.max(64, opts.maxCells ?? n * 4);
+  let cell = nominal;
+  let cols = Math.max(1, Math.ceil(spanX / cell) || 1);
+  let rows = Math.max(1, Math.ceil(spanY / cell) || 1);
+  while (cols * rows > maxCells && (cols > 1 || rows > 1)) {
+    cell *= 2;
+    cols = Math.max(1, Math.ceil(spanX / cell) || 1);
+    rows = Math.max(1, Math.ceil(spanY / cell) || 1);
+  }
+  const cellCount = cols * rows;
+  const cellStart = new Int32Array(cellCount + 1);
+  let total = 0;
+  for (let i = 0; i < n; i++) {
+    const e = entries[i];
+    const cx0 = clampInt(Math.floor((e.seat.x - e.hx - minX) / cell), 0, cols - 1);
+    const cx1 = clampInt(Math.floor((e.seat.x + e.hx - minX) / cell), 0, cols - 1);
+    const cy0 = clampInt(Math.floor((e.seat.y - e.hy - minY) / cell), 0, rows - 1);
+    const cy1 = clampInt(Math.floor((e.seat.y + e.hy - minY) / cell), 0, rows - 1);
+    for (let cy = cy0; cy <= cy1; cy++) {
+      for (let cx = cx0; cx <= cx1; cx++) {
+        cellStart[cy * cols + cx + 1]++;
+        total++;
+      }
+    }
+  }
+  for (let c = 0; c < cellCount; c++) cellStart[c + 1] += cellStart[c];
+  const items = new Int32Array(total);
+  const cursor = cellStart.slice(0, cellCount);
+  for (let i = 0; i < n; i++) {
+    const e = entries[i];
+    const cx0 = clampInt(Math.floor((e.seat.x - e.hx - minX) / cell), 0, cols - 1);
+    const cx1 = clampInt(Math.floor((e.seat.x + e.hx - minX) / cell), 0, cols - 1);
+    const cy0 = clampInt(Math.floor((e.seat.y - e.hy - minY) / cell), 0, rows - 1);
+    const cy1 = clampInt(Math.floor((e.seat.y + e.hy - minY) / cell), 0, rows - 1);
+    for (let cy = cy0; cy <= cy1; cy++) {
+      for (let cx = cx0; cx <= cx1; cx++) {
+        const c = cy * cols + cx;
+        items[cursor[c]++] = i;
+      }
+    }
+  }
+  return {
+    seats,
+    entries,
+    minX,
+    minY,
+    cell,
+    cols,
+    rows,
+    cellStart,
+    items,
+    stamp: new Int32Array(n),
+    epoch: 0
+  };
+}
+function clampInt(v, lo, hi) {
+  return v < lo ? lo : v > hi ? hi : v;
+}
+function queryRect(index, rect, opts = {}) {
+  const x0 = Math.min(rect.x, rect.x + rect.width);
+  const x1 = Math.max(rect.x, rect.x + rect.width);
+  const y0 = Math.min(rect.y, rect.y + rect.height);
+  const y1 = Math.max(rect.y, rect.y + rect.height);
+  const mode = opts.mode ?? "center";
+  const { cols, rows, cell, minX, minY, cellStart, items, entries } = index;
+  const cx0 = Math.max(0, Math.floor((x0 - minX) / cell));
+  const cx1 = Math.min(cols - 1, Math.floor((x1 - minX) / cell));
+  const cy0 = Math.max(0, Math.floor((y0 - minY) / cell));
+  const cy1 = Math.min(rows - 1, Math.floor((y1 - minY) / cell));
+  if (cx0 > cx1 || cy0 > cy1) return [];
+  const found = [];
+  const stamp = index.stamp;
+  const ep = ++index.epoch;
+  for (let cy = cy0; cy <= cy1; cy++) {
+    const rowBase = cy * cols;
+    for (let cx = cx0; cx <= cx1; cx++) {
+      const c = rowBase + cx;
+      const end = cellStart[c + 1];
+      for (let k = cellStart[c]; k < end; k++) {
+        const i = items[k];
+        if (stamp[i] === ep) continue;
+        stamp[i] = ep;
+        const e = entries[i];
+        if (opts.filter && !opts.filter(e.seat.id, e.seat)) continue;
+        const ok = mode === "center" ? e.seat.x >= x0 && e.seat.x <= x1 && e.seat.y >= y0 && e.seat.y <= y1 : shapeIntersectsRect(e, x0, y0, x1, y1);
+        if (ok) found.push(i);
+      }
+    }
+  }
+  found.sort((a, b) => a - b);
+  return found.map((i) => entries[i].seat.id);
+}
+
+// src/core/perspectiveProjection.ts
+function createPerspectiveCamera(bounds2, maxSurfaceHeightWorld = 0) {
+  const span = Math.max(1, bounds2.width, bounds2.height);
+  const target = {
+    x: bounds2.x + bounds2.width / 2,
+    y: bounds2.y + bounds2.height / 2
+  };
+  const distance = span * 1.55;
+  const height = Math.max(span * 0.82, Math.max(0, maxSurfaceHeightWorld) + span * 0.45);
+  return {
+    target,
+    distance,
+    height,
+    focalLength: Math.hypot(distance, height),
+    yawRad: -8 * Math.PI / 180
+  };
+}
+function projectPerspectivePoint(camera, point, heightWorld = 0) {
+  const dx = point.x - camera.target.x;
+  const dy = point.y - camera.target.y;
+  const cos = Math.cos(camera.yawRad);
+  const sin = Math.sin(camera.yawRad);
+  const x = dx * cos - dy * sin;
+  const y = dx * sin + dy * cos;
+  const translatedY = y - camera.distance;
+  const translatedZ = heightWorld - camera.height;
+  const cameraLength = Math.hypot(camera.distance, camera.height);
+  const depth = (-camera.distance * translatedY - camera.height * translatedZ) / cameraLength;
+  const up = (-camera.height * translatedY + camera.distance * translatedZ) / cameraLength;
+  const safeDepth = Math.max(cameraLength * 0.08, depth);
+  const scale = camera.focalLength / safeDepth;
+  return {
+    x: camera.target.x + x * scale,
+    y: camera.target.y - up * scale,
+    depth: safeDepth,
+    scale
+  };
+}
+function applyAffine(affine, point) {
+  return {
+    x: affine.a * point.x + affine.c * point.y + affine.e,
+    y: affine.b * point.x + affine.d * point.y + affine.f
+  };
+}
+function invertAffine(affine) {
+  const determinant = affine.a * affine.d - affine.b * affine.c;
+  if (!Number.isFinite(determinant) || Math.abs(determinant) < 1e-9) {
+    throw new Error("perspective projection produced a singular affine");
+  }
+  const a = affine.d / determinant;
+  const b = -affine.b / determinant;
+  const c = -affine.c / determinant;
+  const d = affine.a / determinant;
+  return {
+    a,
+    b,
+    c,
+    d,
+    e: -(a * affine.e + c * affine.f),
+    f: -(b * affine.e + d * affine.f)
+  };
+}
+function composeAffine(left, right) {
+  return {
+    a: left.a * right.a + left.c * right.b,
+    b: left.b * right.a + left.d * right.b,
+    c: left.a * right.c + left.c * right.d,
+    d: left.b * right.c + left.d * right.d,
+    e: left.a * right.e + left.c * right.f + left.e,
+    f: left.b * right.e + left.d * right.f + left.f
+  };
+}
+function perspectiveTangentAffine(camera, anchor, heightAt = () => 0) {
+  const origin = projectPerspectivePoint(camera, anchor, heightAt(anchor));
+  const alongXPoint = { x: anchor.x + 1, y: anchor.y };
+  const alongYPoint = { x: anchor.x, y: anchor.y + 1 };
+  const alongX = projectPerspectivePoint(camera, alongXPoint, heightAt(alongXPoint));
+  const alongY = projectPerspectivePoint(camera, alongYPoint, heightAt(alongYPoint));
+  const a = alongX.x - origin.x;
+  const b = alongX.y - origin.y;
+  const c = alongY.x - origin.x;
+  const d = alongY.y - origin.y;
+  return {
+    a,
+    b,
+    c,
+    d,
+    e: origin.x - a * anchor.x - c * anchor.y,
+    f: origin.y - b * anchor.x - d * anchor.y
+  };
+}
+function decomposeAffineLinear(affine) {
+  const scaleX = Math.hypot(affine.a, affine.b);
+  const determinant = affine.a * affine.d - affine.b * affine.c;
+  return {
+    rotationDeg: Math.atan2(affine.b, affine.a) * 180 / Math.PI,
+    scaleX,
+    scaleY: determinant / Math.max(scaleX, 1e-9),
+    skewX: (affine.a * affine.c + affine.b * affine.d) / Math.max(determinant, 1e-9)
+  };
+}
+
 // src/lib/money.ts
 var DEFAULT_CURRENCY = "USD";
 var displayLocale;
@@ -1363,6 +1959,25 @@ function formatDate(value, opts) {
   return new Intl.DateTimeFormat(active, opts ?? { dateStyle: "medium", timeStyle: "short" }).format(value);
 }
 
+// src/core/shapeLineStyle.ts
+var DEFAULT_SHAPE_LINE_CAP = "round";
+var DEFAULT_SHAPE_LINE_JOIN = "round";
+var DEFAULT_SHAPE_LINE_ENDING = "none";
+function resolvedShapeLineStyle(shape) {
+  return {
+    lineCap: shape.lineCap ?? DEFAULT_SHAPE_LINE_CAP,
+    lineJoin: shape.lineJoin ?? DEFAULT_SHAPE_LINE_JOIN,
+    startEnding: shape.startEnding ?? DEFAULT_SHAPE_LINE_ENDING,
+    endEnding: shape.endEnding ?? DEFAULT_SHAPE_LINE_ENDING
+  };
+}
+function shapeArrowMetrics(strokeWidth) {
+  return {
+    pointerLength: Math.min(48, Math.max(8, strokeWidth * 3)),
+    pointerWidth: Math.min(40, Math.max(8, strokeWidth * 2.25))
+  };
+}
+
 // src/engine/SeatmapRenderer.ts
 var SEAT_RADIUS = 9;
 var SEAT_LEGIBLE_SCALE = 0.9;
@@ -1370,17 +1985,18 @@ var CACHE_THRESHOLD = 0.55 * SEAT_LEGIBLE_SCALE;
 var LABEL_SCALE = MIN_VISIBLE_BOOKABLE_LABEL_PX / SEAT_LABEL_FONT_SIZE;
 var MIN_FITTED_SEAT_LABEL_FONT_SIZE = 4;
 var SEAT_TAP_SLOP_PX = 14;
-var SEAT_GLYPH_MIN_PX = 6.5;
+var WHEELCHAIR_GLYPH_MIN_PX = 10;
+var FILTERED_WHEELCHAIR_GLYPH_MIN_PX = 14;
 var SECTION_PROMINENT_SCALE = 0.45 * SEAT_LEGIBLE_SCALE;
 var BLOCK_MELT_TOP = 0.9 * SEAT_LEGIBLE_SCALE;
 var SEAT_FOCUS_SCALE = Math.max(SEAT_LEGIBLE_SCALE * 1.1, BLOCK_MELT_TOP);
 var PAN_START_SLOP_PX = 8;
+var GHOST_CLICK_MS = 700;
 var ZONE_PROMINENT_SCALE = 0.55 * SECTION_PROMINENT_SCALE;
 var MAX_LABELS = 700;
 var MARQUEE_RING_CAP = 2500;
 var ISO_ANGLE_DEG = -11.5;
 var ISO_SQUASH = 0.58;
-var LIFT_PER_STEP = 58;
 var ISO_TWEEN_MS = 320;
 var CAMERA_GLIDE_MS = 650;
 var BLOCK_FILL_ALPHA = 1;
@@ -1417,6 +2033,10 @@ var DEF_SELECTION = "#ffffff";
 var DEF_SELECTION_ON_LIGHT = "#0b1220";
 var DEF_DECOR_FILL = "#232c40";
 var DEF_TEXT = "#8b93a7";
+function konvaFontStyle(bold, italic, defaultWeight = "normal") {
+  const weight = bold ? "bold" : defaultWeight;
+  return italic ? `italic ${weight}`.trim() : weight;
+}
 var DEF_CANVAS_BACKGROUND = "#0e1117";
 function colorLuminance(color) {
   const s = color.trim();
@@ -1522,8 +2142,8 @@ function rotatedRectPoints(center, width, height, rotation) {
   }));
 }
 function pointsBounds(points) {
-  const bounds = polyBounds(points);
-  return { x: bounds.x, y: bounds.y, width: bounds.width, height: bounds.height };
+  const bounds2 = polyBounds(points);
+  return { x: bounds2.x, y: bounds2.y, width: bounds2.width, height: bounds2.height };
 }
 function rotatedRectFitsPolygon(center, width, height, rotation, outer, holes) {
   const radians = rotation * Math.PI / 180;
@@ -1543,14 +2163,14 @@ function rotatedRectFitsPolygon(center, width, height, rotation, outer, holes) {
   return true;
 }
 function polygonLabelCandidates(outer, holes, preferred) {
-  const bounds = polyBounds(outer);
-  const centre = { x: bounds.x + bounds.width / 2, y: bounds.y + bounds.height / 2 };
+  const bounds2 = polyBounds(outer);
+  const centre = { x: bounds2.x + bounds2.width / 2, y: bounds2.y + bounds2.height / 2 };
   const points = [preferred];
   for (let row = 1; row < 12; row += 1) {
     for (let column = 1; column < 12; column += 1) {
       const point = {
-        x: bounds.x + bounds.width * column / 12,
-        y: bounds.y + bounds.height * row / 12
+        x: bounds2.x + bounds2.width * column / 12,
+        y: bounds2.y + bounds2.height * row / 12
       };
       if (pointInPolygonWithHoles(point, outer, holes)) points.push(point);
     }
@@ -1615,6 +2235,33 @@ function rgba(hex, a) {
   const n = parseInt(m[1], 16);
   return `rgba(${n >> 16 & 255},${n >> 8 & 255},${n & 255},${a})`;
 }
+var ViewportGroup = class extends Group {
+  constructor() {
+    super(...arguments);
+    this.viewportCulled = false;
+  }
+  setViewportCulled(culled) {
+    if (culled === this.viewportCulled) return;
+    this.viewportCulled = culled;
+    if (!culled) super._clearSelfAndDescendantCache();
+  }
+  isViewportCulled() {
+    return this.viewportCulled;
+  }
+  drawScene(...args) {
+    return this.viewportCulled ? this : super.drawScene(...args);
+  }
+  drawHit(...args) {
+    return this.viewportCulled ? this : super.drawHit(...args);
+  }
+  _clearSelfAndDescendantCache(attr) {
+    if (!this.viewportCulled) {
+      super._clearSelfAndDescendantCache(attr);
+      return;
+    }
+    this._clearCache(attr);
+  }
+};
 function hexToRgb(hex) {
   const m = /^#?([\da-f]{6})$/i.exec(hex.trim());
   if (!m) return null;
@@ -1645,8 +2292,15 @@ function lerpColor(a, b, t2) {
 }
 var _SeatmapRenderer = class _SeatmapRenderer {
   constructor(container, options = {}) {
+    /** Per-elevated-section label containers. Keeping the labels grouped lets the
+     *  Phase-B lift move thousands of seat labels with one transform per section
+     *  instead of rewriting every label on every tween frame. */
+    this.labelLiftGroups = /* @__PURE__ */ new Map();
     this.seats = [];
     this.seatById = /* @__PURE__ */ new Map();
+    /** One build per chart/floor; section membership queries only inspect seats in
+     *  the section bounds instead of rescanning the full 13k venue per section. */
+    this.seatIndex = null;
     /** Multi-floor (Batch 5): the last-set chart + which floor we're rendering. */
     this.chartDoc = null;
     this.activeFloorId = "";
@@ -1662,13 +2316,11 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.seatLabelById = /* @__PURE__ */ new Map();
     /** Coloured accommodation ring per accessible seat (few per chart). */
     this.accessRingById = /* @__PURE__ */ new Map();
-    /** Centred accessibility glyph per accessible seat — shown once the seat is
-     *  big enough on-screen (see {@link SEAT_GLYPH_MIN_PX}); the ring is the
-     *  smaller-zoom fallback. Kept in a map so zoom toggles touch only the handful
-     *  of accessible seats, never all 13k nodes. */
+    /** Centred ♿ glyph per physical wheelchair provision. It keeps a small
+     *  screen-space floor at every LOD and grows when the Wheelchair filter is
+     *  active. Kept in a map so zoom updates touch only the handful of matching
+     *  seats, never all 13k nodes. */
     this.accessGlyphById = /* @__PURE__ */ new Map();
-    /** Whether the accessibility glyph is legible at the current camera scale. */
-    this.accessGlyphVisible = false;
     /** Authored free-text nodes obey the same rendered-size visibility floor. */
     this.freeTextById = /* @__PURE__ */ new Map();
     /** Stage/rink landmarks retain a readable screen-space caption at overview. */
@@ -1693,6 +2345,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.ownedHold = /* @__PURE__ */ new Set();
     /** One selected seat being inspected before it is committed to the cart. */
     this.selectionFocusId = null;
+    /** Seat currently owning the shared hover ring (null while not hovering). */
+    this.hoveredId = null;
     this.focusedId = null;
     /**
      * Accessibility filter: `null` = off; `[]` = dim all non-accessible free seats;
@@ -1711,6 +2365,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.sections = [];
     this.zones = [];
     this.seatSection = /* @__PURE__ */ new Map();
+    /** Seats outside every authored section retain the legacy path in one group. */
+    this.unsectionedSeatGroup = null;
     this.catPrice = /* @__PURE__ */ new Map();
     /** Section/zone ids to render dimmed (organizer manager: held-back inventory). */
     this.dimmedSections = /* @__PURE__ */ new Set();
@@ -1723,6 +2379,9 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.focusedSectionId = null;
     /** Light backdrop panel drawn behind the focused section (removed on clear). */
     this.focusBackdrop = null;
+    /** Non-listening visual dim outside the focused section. One overlay replaces
+     *  descendant opacity mutations across every seat in the venue. */
+    this.focusDimOverlay = null;
     /** Object id → floor id (multi-floor only) — resolves a deck tap in the 3D stack. */
     this.objectFloor = /* @__PURE__ */ new Map();
     /** Zone id → colour (drives extruded side faces in iso view). */
@@ -1735,10 +2394,33 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.isoT = 0;
     this.isoTarget = 0;
     this.isoRaf = 0;
+    /** Public view target; perspective is a separate non-affine Phase-C lane. */
+    this.viewMode = "flat";
+    this.perspectiveCamera = null;
+    /** Ground-plane tangent applied once to every renderer layer. */
+    this.perspectiveBaseAffine = null;
+    this.perspectiveBaseInverse = null;
+    /** Exact pinhole anchor expressed in the overlay tangent-layer coordinates. */
+    this.perspectiveSeatLocal = /* @__PURE__ */ new Map();
+    /** Exact projected point (before Stage pan/zoom), keyed by seat. */
+    this.perspectiveSeatProjected = /* @__PURE__ */ new Map();
+    /** Positive camera depth, used for deterministic far→near paint order. */
+    this.perspectiveSeatDepth = /* @__PURE__ */ new Map();
+    /** Exact pinhole size ratio at each seat anchor. */
+    this.perspectiveSeatScale = /* @__PURE__ */ new Map();
+    /** Seats whose native Konva nodes currently carry the exact projected pose.
+     * Large sectioned venues apply these lazily as a section enters the live-seat
+     * viewport; the overview rung hides the seat layer completely. */
+    this.perspectiveAppliedSeats = /* @__PURE__ */ new Set();
+    this.perspectiveBounds = null;
     /** Chart centre the iso projection pivots about (bounds centre). */
     this.isoCentre = { x: 0, y: 0 };
     /** rAF for an in-flight camera glide (focusRegion / setRung); 0 = none. */
     this.glideRaf = 0;
+    /** While the camera tween is active, defer polygon label fitting/collision to
+     *  the settled frame. Geometry remains smoothly stage-scaled, while expensive
+     *  point-in-polygon text work no longer repeats at 120 Hz. */
+    this.glideInProgress = false;
     /** Set in destroy() so an in-flight iso tween bails. */
     this.destroyed = false;
     /** Cached scale the section/zone labels were last sized for (scale-compensation). */
@@ -1768,6 +2450,19 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.panStarted = false;
     /** Maximum displacement from gesture start — suppress taps only after a real pan/pinch. */
     this.moved = 0;
+    /**
+     * Ghost-click guard. Konva binds `_pointerup` to mouseup, touchend AND
+     * pointerup, so `on('click tap')` is two handlers for one finger tap unless
+     * the browser's synthesized compatibility click is suppressed. Konva only
+     * suppresses it when the touch lands on a LISTENING SHAPE (Stage.js returns
+     * early before its preventDefault() when `!shape || !shape.isListening()`),
+     * so a near-miss rescued by nearestSeatToScreen used to fire `tap` (select)
+     * then `click` (deselect) 1-3ms apart and net to nothing. With
+     * SEAT_TAP_SLOP_PX=14 against a ~12px seat radius, that broken annulus is
+     * ~3.7x the area of the seat itself — i.e. most successful mobile taps.
+     * `touch-action: none` does NOT suppress compatibility mouse events.
+     */
+    this.lastTapAt = 0;
     /**
      * Manage-mode rubber-band marquee (option-gated). `start`/`cur` are WORLD-space
      * points (overlayLayer rides the stage transform); `rect` is the on-canvas
@@ -1864,6 +2559,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
           x: mid.x - this.pinch.worldMid.x * scale,
           y: mid.y - this.pinch.worldMid.y * scale
         });
+        this.updateSeatGroupVisibility();
         this.stage.batchDraw();
         this.scheduleViewChange();
       } else if (this.panLast && this.pointers.size === 1) {
@@ -1876,6 +2572,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
           y: this.stage.y() + (p.y - this.panLast.y)
         });
         this.panLast = p;
+        this.updateSeatGroupVisibility();
         this.stage.batchDraw();
         this.scheduleViewChange();
       }
@@ -1928,6 +2625,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.overlayLayer = new Layer({ listening: false });
     this.labelGroup = new Group({ listening: false });
     this.overlayLayer.add(this.labelGroup);
+    this.fgDecorGroup = new Group({ listening: false });
+    this.overlayLayer.add(this.fgDecorGroup);
     this.hoverRing = new Circle({
       radius: SEAT_RADIUS + 2,
       stroke: "#ffffff",
@@ -1962,6 +2661,21 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       this.resizeObs.observe(container);
     }
   }
+  /**
+   * True when this is the browser's synthesized compatibility click following a
+   * finger tap we already handled. Discriminates on `e.type` deliberately —
+   * `PointerEvent extends MouseEvent`, so an `instanceof MouseEvent` test
+   * matches genuine pointer taps too. One shared timestamp across the layer and
+   * stage handlers: a tap consumed at the layer must also suppress the ghost at
+   * the stage, and only `click` is ever rejected, so bubbling stays intact.
+   */
+  isGhostClick(e) {
+    if (e.type === "tap") {
+      this.lastTapAt = performance.now();
+      return false;
+    }
+    return this.lastTapAt > 0 && performance.now() - this.lastTapAt < GHOST_CLICK_MS;
+  }
   // ---- ISeatmapRenderer -----------------------------------------------------
   setChart(doc, opts) {
     if (doc !== this.chartDoc) this.stacked = false;
@@ -1975,8 +2689,15 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.focusedId = null;
     this.focusRing.visible(false);
     this.bgLayer.destroyChildren();
+    this.focusDimOverlay?.destroy();
+    this.focusDimOverlay = null;
+    this.seatLayer.clearCache();
+    this.seatLayer.listening(true);
     this.seatLayer.destroyChildren();
+    this.unsectionedSeatGroup = null;
     this.labelGroup.destroyChildren();
+    this.labelLiftGroups.clear();
+    this.fgDecorGroup.destroyChildren();
     this.circleById.clear();
     this.boothDims.clear();
     this.boothLabelById.clear();
@@ -1993,6 +2714,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.statusById.clear();
     this.selection.clear();
     this.seatById.clear();
+    this.seatIndex = null;
     this.cached = false;
     this.accessFilter = null;
     this.sections = [];
@@ -2010,11 +2732,22 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     }
     this.isoT = 0;
     this.isoTarget = 0;
+    this.viewMode = "flat";
+    this.perspectiveCamera = null;
+    this.perspectiveBaseAffine = null;
+    this.perspectiveBaseInverse = null;
+    this.perspectiveSeatLocal.clear();
+    this.perspectiveSeatProjected.clear();
+    this.perspectiveSeatDepth.clear();
+    this.perspectiveSeatScale.clear();
+    this.perspectiveAppliedSeats.clear();
+    this.perspectiveBounds = null;
     this.resetLayerTransforms();
     this.hasSections = view.objects.some((o) => o.type === "section");
     for (const z of doc.zones ?? []) if (z.color) this.zoneColor.set(z.id, z.color);
     this.seatLayer.opacity(1);
     this.hoverRing.visible(false);
+    this.hoveredId = null;
     this.theme = doc.theme ?? {};
     this.seatR = clamp(this.theme.seatScale ?? 1, 0.7, 1.6) * SEAT_RADIUS;
     this.container.style.background = "";
@@ -2035,26 +2768,61 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         this.boothDims.set(obj.id, { width: obj.width, height: obj.height, rotation: obj.rotation });
       }
     }
-    this.seats = expandChart(view);
+    this.seats = expandChart(view, {
+      // A stacked overview is presentation-only and never opens a seat POV. The
+      // per-section renderer below still resolves each object's real floor base.
+      floorBaseHeightM: this.stacked ? 0 : this.floorBaseHeightMFor()
+    });
     for (const s of this.seats) {
       this.seatById.set(s.id, s);
       this.statusById.set(s.id, "free");
     }
+    this.seatIndex = buildSeatIndex(this.seats, { seatRadius: this.seatR });
+    this.bounds = chartBounds(view);
+    this.isoCentre = { x: this.bounds.x + this.bounds.width / 2, y: this.bounds.y + this.bounds.height / 2 };
+    this.buildPerspectiveProjection(view);
     this.renderBackground(view);
+    this.unsectionedSeatGroup = new Group({ listening: true });
+    this.seatLayer.add(this.unsectionedSeatGroup);
     this.renderSeats();
     this.overlayLayer.add(this.labelGroup);
+    this.overlayLayer.add(this.fgDecorGroup);
     this.overlayLayer.add(this.hoverRing);
-    this.bounds = chartBounds(view);
-    this.isoCentre = { x: this.bounds.x + this.bounds.width / 2, y: this.bounds.y + this.bounds.height / 2 };
+    this.overlayLayer.add(this.focusRing);
     this.zoomToFit();
   }
   /** The chart to render: all floors stacked (3D overview), the active floor, or
    *  the whole chart for single-floor charts. */
   floorView(doc) {
-    if (!doc.floors || !doc.floors.length) return doc;
-    if (this.stacked && doc.floors.length >= 2) return stackFloors(doc);
+    if (!doc.floors || !doc.floors.length) return {
+      ...doc,
+      referenceImage: void 0,
+      backgroundImage: buyerBackgroundImage(doc)
+    };
+    if (this.stacked && doc.floors.length >= 2) {
+      return {
+        ...stackFloors(doc),
+        referenceImage: void 0,
+        backgroundImage: buyerBackgroundImage(doc)
+      };
+    }
     const floor = doc.floors.find((f) => f.id === this.activeFloorId) ?? doc.floors[0];
-    return { ...doc, objects: floor.objects, focalPoint: floor.focalPoint, backgroundImage: floor.backgroundImage, floors: void 0 };
+    return {
+      ...doc,
+      objects: floor.objects,
+      focalPoint: floor.focalPoint,
+      referenceImage: void 0,
+      backgroundImage: buyerBackgroundImage(floor),
+      floors: void 0
+    };
+  }
+  /** Physical floor height is authored data; the 900-unit stacked overview
+   * spread is presentation-only and must never leak into real 3D geometry. */
+  floorBaseHeightMFor(objectId) {
+    const floors = this.chartDoc?.floors;
+    if (!floors?.length) return 0;
+    const floorId = this.stacked && objectId ? this.objectFloor.get(objectId) ?? this.activeFloorId : this.activeFloorId;
+    return floors.find((floor) => floor.id === floorId)?.baseHeightM ?? 0;
   }
   /** Toggle the 3D all-floors stacked overview (Batch 5). Re-renders; no-op on
    *  single-floor charts. The caller re-applies statuses + animates the iso view. */
@@ -2367,7 +3135,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     }
     const ids = [];
     for (const seat of this.seats) {
-      if (seat.x < x0 || seat.x > x1 || seat.y < y0 || seat.y > y1) continue;
+      const rendered = this.renderedSeatPoint(seat);
+      if (rendered.x < x0 || rendered.x > x1 || rendered.y < y0 || rendered.y > y1) continue;
       if (!this.isSelectable(seat.id)) continue;
       ids.push(seat.id);
     }
@@ -2377,9 +3146,10 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   flashSeat(seatId, color = "#f43f5e") {
     const seat = this.seatById.get(seatId);
     if (!seat) return;
+    const rendered = this.renderedSeatPoint(seat);
     const ring = new Circle({
-      x: seat.x,
-      y: seat.y,
+      x: rendered.x,
+      y: rendered.y,
       radius: this.seatR,
       stroke: color,
       strokeWidth: 3,
@@ -2388,6 +3158,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       perfectDrawEnabled: false,
       shadowForStrokeEnabled: false
     });
+    const projectionScale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(seatId) ?? 1 : 1;
+    ring.scale({ x: projectionScale, y: projectionScale });
     this.overlayLayer.add(ring);
     const start = performance.now();
     const dur = 620;
@@ -2414,17 +3186,20 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const matches = this.sections.filter((section) => section.id === sectionId || section.zone === sectionId);
     if (!matches.length) return;
     for (const section of matches) {
-      const centre = section.outline.reduce(
+      const outline = this.viewMode === "perspective" && section.perspectiveAffine ? section.outline.map((point) => this.perspectiveLocalPoint(this.projectedSectionPoint(section, point))) : section.outline.map((point) => {
+        const lift = section.liftWorld > 0 ? this.isoLiftLocal(section.liftWorld) : { x: 0, y: 0 };
+        return { x: point.x + lift.x, y: point.y + lift.y };
+      });
+      const centre = outline.reduce(
         (sum, point) => ({ x: sum.x + point.x, y: sum.y + point.y }),
         { x: 0, y: 0 }
       );
-      centre.x /= section.outline.length;
-      centre.y /= section.outline.length;
-      const lift = section.elevation > 0 ? this.isoLiftLocal(section.elevation) : { x: 0, y: 0 };
+      centre.x /= outline.length;
+      centre.y /= outline.length;
       const halo = new Line({
-        x: centre.x + lift.x,
-        y: centre.y + lift.y,
-        points: section.outline.flatMap((point) => [point.x - centre.x, point.y - centre.y]),
+        x: centre.x,
+        y: centre.y,
+        points: outline.flatMap((point) => [point.x - centre.x, point.y - centre.y]),
         closed: true,
         stroke: color,
         strokeWidth: 3,
@@ -2468,12 +3243,14 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   nearestSeat(fromId, dir) {
     const from = this.seatById.get(fromId);
     if (!from) return null;
+    const fromPoint = this.viewMode === "perspective" ? this.perspectiveSeatProjected.get(from.id) ?? from : from;
     let best = null;
     let bestScore = Infinity;
     for (const s of this.seats) {
       if (s.id === fromId) continue;
-      const dx = s.x - from.x;
-      const dy = s.y - from.y;
+      const candidatePoint = this.viewMode === "perspective" ? this.perspectiveSeatProjected.get(s.id) ?? s : s;
+      const dx = candidatePoint.x - fromPoint.x;
+      const dy = candidatePoint.y - fromPoint.y;
       const proj = dx * dir.x + dy * dir.y;
       if (proj <= 0.5) continue;
       const perp = Math.abs(dx * dir.y - dy * dir.x);
@@ -2490,7 +3267,9 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     if (!seat) return;
     this.focusedId = id;
     this.focusRing.radius(this.seatR + 3);
-    this.focusRing.position({ x: seat.x, y: seat.y });
+    this.focusRing.position(this.renderedSeatPoint(seat));
+    const projectionScale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(id) ?? 1 : 1;
+    this.focusRing.scale({ x: projectionScale, y: projectionScale });
     this.focusRing.visible(true);
     this.ensureVisible(seat);
     this.overlayLayer.batchDraw();
@@ -2505,7 +3284,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const margin = 70;
     const offscreen = p.x < margin || p.x > w - margin || p.y < margin || p.y > h - margin;
     if (this.stage.scaleX() < target || offscreen) {
-      const ip = this.isoT === 0 ? seat : this.isoForward(seat);
+      const rendered = this.renderedSeatPoint(seat);
+      const ip = this.viewMode === "perspective" && this.perspectiveBaseAffine ? applyAffine(this.perspectiveBaseAffine, rendered) : this.isoT === 0 ? rendered : this.isoForward(rendered);
       this.stage.scale({ x: target, y: target });
       this.stage.position({ x: w / 2 - ip.x * target, y: h / 2 - ip.y * target });
       this.afterViewChange();
@@ -2515,7 +3295,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   zoomToFit() {
     const w = this.stage.width();
     const h = this.stage.height();
-    const b = this.bounds;
+    const b = this.viewMode === "perspective" && this.perspectiveBounds ? this.perspectiveBounds : this.bounds;
     this.fitScale = Math.min(w / b.width, h / b.height) || 1;
     const s = this.fitScale;
     this.stage.scale({ x: s, y: s });
@@ -2544,7 +3324,14 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   }
   worldToScreen(point) {
     const s = this.stage.scaleX();
-    const p = this.isoT === 0 ? point : this.isoForward(point);
+    const candidateId = point.id;
+    const seat = typeof candidateId === "string" ? this.seatById.get(candidateId) : void 0;
+    if (this.viewMode === "perspective" && this.perspectiveBaseAffine) {
+      const projected = seat ? this.perspectiveSeatProjected.get(seat.id) ?? applyAffine(this.perspectiveBaseAffine, point) : applyAffine(this.perspectiveBaseAffine, point);
+      return { x: projected.x * s + this.stage.x(), y: projected.y * s + this.stage.y() };
+    }
+    const localPoint = seat ? this.renderedSeatPoint(seat) : point;
+    const p = this.isoT === 0 ? localPoint : this.isoForward(localPoint);
     return { x: p.x * s + this.stage.x(), y: p.y * s + this.stage.y() };
   }
   setAccessibleFilter(on) {
@@ -2554,6 +3341,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const next = types === null ? null : [...types];
     if (this.sameAccessFilter(next)) return;
     this.accessFilter = next;
+    this.updateAccessGlyphs(this.effScale());
     for (const seat of this.seats) {
       const c = this.circleById.get(seat.id);
       if (c) this.paintSeat(c, seat.id);
@@ -2652,10 +3440,11 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     let minY = Infinity;
     let maxY = -Infinity;
     for (const seat of matching) {
-      minX = Math.min(minX, seat.x);
-      maxX = Math.max(maxX, seat.x);
-      minY = Math.min(minY, seat.y);
-      maxY = Math.max(maxY, seat.y);
+      const point = this.renderedSeatPoint(seat);
+      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 pad = Math.max(24, this.seatR * 3);
     minX -= pad;
@@ -2676,12 +3465,37 @@ var _SeatmapRenderer = class _SeatmapRenderer {
    * inverse) keeps landing on the projected seats/sections.
    */
   setViewMode(mode) {
+    if (mode === "perspective") {
+      if (this.viewMode === mode) {
+        this.afterViewChange();
+        return;
+      }
+      const resetElevatedSeatGroups = this.viewMode === "isometric" && this.isoT > 0;
+      this.viewMode = mode;
+      this.isoTarget = 1;
+      this.isoT = 1;
+      if (this.isoRaf) {
+        cancelAnimationFrame(this.isoRaf);
+        this.isoRaf = 0;
+      }
+      this.applyPerspective(resetElevatedSeatGroups);
+      this.zoomToFit();
+      return;
+    }
     const target = mode === "isometric" ? 1 : 0;
+    const leavingPerspective = this.viewMode === "perspective";
+    this.viewMode = mode;
     this.isoTarget = target;
     if (this.isoRaf) {
       cancelAnimationFrame(this.isoRaf);
       this.isoRaf = 0;
     }
+    if (leavingPerspective) {
+      this.isoT = target;
+      this.applyIso();
+      this.afterViewChange();
+      return;
+    }
     if (this.reducedMotion) {
       this.isoT = target;
       this.applyIso();
@@ -2715,7 +3529,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   }
   /** Current projection — reflects the tween target, not the mid-tween isoT. */
   getViewMode() {
-    return this.isoTarget === 1 ? "isometric" : "flat";
+    return this.viewMode;
   }
   /** Iso angle (rad) + y-squash for the current isoT. */
   isoParams() {
@@ -2723,6 +3537,11 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   }
   /** Effective vertical scale = stage scale × iso squash — legibility math uses this. */
   effScale() {
+    if (this.viewMode === "perspective" && this.perspectiveBaseAffine) {
+      const xScale = Math.hypot(this.perspectiveBaseAffine.a, this.perspectiveBaseAffine.b);
+      const yScale = Math.hypot(this.perspectiveBaseAffine.c, this.perspectiveBaseAffine.d);
+      return this.stage.scaleX() * Math.min(xScale, yScale);
+    }
     return this.stage.scaleX() * (1 - (1 - ISO_SQUASH) * this.isoT);
   }
   /** Project a world point through the iso affine about the chart centre (→ iso-world). */
@@ -2746,19 +3565,113 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const wy = -dx * Math.sin(th) + uy * Math.cos(th);
     return { x: c.x + wx, y: c.y + wy };
   }
+  /** Precompute the Phase-C pinhole camera and every exact seat anchor. */
+  buildPerspectiveProjection(view) {
+    let maxSurfaceHeightWorld = 0;
+    for (const seat of this.seats) {
+      const surfaceM = Math.max(0, (seat.eyeHeightM ?? SEATED_EYE_HEIGHT_M) - SEATED_EYE_HEIGHT_M);
+      maxSurfaceHeightWorld = Math.max(maxSurfaceHeightWorld, surfaceM * CHART_UNITS_PER_METRE);
+    }
+    for (const object of view.objects) {
+      if (object.type !== "section") continue;
+      maxSurfaceHeightWorld = Math.max(
+        maxSurfaceHeightWorld,
+        sectionGeometry(object, { floorBaseHeightM: this.floorBaseHeightMFor(object.id) }).height * CHART_UNITS_PER_METRE
+      );
+    }
+    const camera = createPerspectiveCamera(this.bounds, maxSurfaceHeightWorld);
+    const base = perspectiveTangentAffine(camera, camera.target);
+    const inverse = invertAffine(base);
+    this.perspectiveCamera = camera;
+    this.perspectiveBaseAffine = base;
+    this.perspectiveBaseInverse = inverse;
+    this.perspectiveSeatLocal.clear();
+    this.perspectiveSeatProjected.clear();
+    this.perspectiveSeatDepth.clear();
+    this.perspectiveSeatScale.clear();
+    this.perspectiveBounds = null;
+    let minX = Infinity;
+    let minY = Infinity;
+    let maxX = -Infinity;
+    let maxY = -Infinity;
+    for (const seat of this.seats) {
+      const surfaceM = Math.max(0, (seat.eyeHeightM ?? SEATED_EYE_HEIGHT_M) - SEATED_EYE_HEIGHT_M);
+      const projected = projectPerspectivePoint(camera, seat, surfaceM * CHART_UNITS_PER_METRE);
+      const point = { x: projected.x, y: projected.y };
+      this.perspectiveSeatProjected.set(seat.id, point);
+      this.perspectiveSeatLocal.set(seat.id, applyAffine(inverse, point));
+      this.perspectiveSeatDepth.set(seat.id, projected.depth);
+      this.perspectiveSeatScale.set(seat.id, projected.scale);
+      minX = Math.min(minX, projected.x);
+      minY = Math.min(minY, projected.y);
+      maxX = Math.max(maxX, projected.x);
+      maxY = Math.max(maxY, projected.y);
+    }
+    for (const point of [
+      { x: this.bounds.x, y: this.bounds.y },
+      { x: this.bounds.x + this.bounds.width, y: this.bounds.y },
+      { x: this.bounds.x + this.bounds.width, y: this.bounds.y + this.bounds.height },
+      { x: this.bounds.x, y: this.bounds.y + this.bounds.height }
+    ]) {
+      const projected = projectPerspectivePoint(camera, point, 0);
+      minX = Math.min(minX, projected.x);
+      minY = Math.min(minY, projected.y);
+      maxX = Math.max(maxX, projected.x);
+      maxY = Math.max(maxY, projected.y);
+    }
+    const pad = Math.max(24, this.seatR * 3);
+    this.perspectiveBounds = Number.isFinite(minX) ? { x: minX - pad, y: minY - pad, width: Math.max(1, maxX - minX + pad * 2), height: Math.max(1, maxY - minY + pad * 2) } : null;
+  }
+  /** Apply an affine to a Konva container while keeping `pivot` fixed logically. */
+  setContainerAffine(node, affine, pivot) {
+    const decomposed = decomposeAffineLinear(affine);
+    node.offset(pivot);
+    node.position(applyAffine(affine, pivot));
+    node.rotation(decomposed.rotationDeg);
+    node.scale({ x: decomposed.scaleX, y: decomposed.scaleY });
+    node.skewX(decomposed.skewX);
+    node.skewY(0);
+  }
+  resetContainerTransform(node) {
+    node.position({ x: 0, y: 0 });
+    node.offset({ x: 0, y: 0 });
+    node.scale({ x: 1, y: 1 });
+    node.rotation(0);
+    node.skewX(0);
+    node.skewY(0);
+  }
+  /** Exact raked surface height used for the bounded section tangent plane. */
+  sectionSurfaceHeight(section, point) {
+    const radial = Math.hypot(point.x - section.surfaceFocal.x, point.y - section.surfaceFocal.y);
+    const depth = Math.max(0, radial - section.frontDistanceWorld);
+    return section.liftWorld + depth * Math.tan(section.rakeDeg * Math.PI / 180);
+  }
+  /** Desired perspective-space point for a section surface, before Stage pan/zoom. */
+  projectedSectionPoint(section, point) {
+    return section.perspectiveAffine ? applyAffine(section.perspectiveAffine, point) : applyAffine(this.perspectiveBaseAffine, point);
+  }
+  /** Shared-layer local point which the ground affine paints at `projected`. */
+  perspectiveLocalPoint(projected) {
+    return this.perspectiveBaseInverse ? applyAffine(this.perspectiveBaseInverse, projected) : projected;
+  }
   /**
    * Local-space offset that, once the layer applies the iso affine, lifts an
-   * object straight UP in iso-world by `elevation × LIFT_PER_STEP × isoT`
-   * (= inverse-linear of the pure vertical lift). Zero at isoT=0.
+   * object straight UP in iso-world by `liftWorld × isoT` world units
+   * (= inverse-linear of the pure vertical lift). Zero at isoT=0. `liftWorld` is
+   * the section's resolved real height in world units (Phase B1).
    */
-  isoLiftLocal(elevation) {
+  isoLiftLocal(liftWorld) {
     const { th, sg } = this.isoParams();
-    const delta = elevation * LIFT_PER_STEP * this.isoT;
+    const delta = liftWorld * this.isoT;
     return { x: -(delta / sg) * Math.sin(th), y: -(delta / sg) * Math.cos(th) };
   }
-  /** Restore the three layers to identity (flat) — byte-for-byte the original. */
-  resetLayerTransforms() {
-    for (const layer of [this.bgLayer, this.seatLayer, this.overlayLayer]) {
+  /** Restore projection layers to identity (flat) — byte-for-byte the original.
+   * `seatLayer` can be skipped when entering perspective from flat: assigning a
+   * top-level transform invalidates all 14k descendant absolute transforms even
+   * while the semantic overview keeps that layer fully transparent. */
+  resetLayerTransforms(includeSeatLayer = true) {
+    const layers = includeSeatLayer ? [this.bgLayer, this.seatLayer, this.overlayLayer] : [this.bgLayer, this.overlayLayer];
+    for (const layer of layers) {
       layer.position({ x: 0, y: 0 });
       layer.offset({ x: 0, y: 0 });
       layer.scale({ x: 1, y: 1 });
@@ -2767,6 +3680,117 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       layer.skewY(0);
     }
   }
+  /** Restore section-owned containers before applying another projection. */
+  resetSectionProjection(resetSeatGroups = true) {
+    for (const section of this.sections) {
+      this.resetContainerTransform(section.rootGroupBg);
+      this.resetContainerTransform(section.liftGroupBg);
+      if (resetSeatGroups) this.resetContainerTransform(section.liftGroupSeat);
+      section.rootGroupBg.zIndex(section.bgZIndex);
+      if (resetSeatGroups) section.liftGroupSeat.zIndex(section.seatZIndex);
+      const labelGroup = this.labelLiftGroups.get(section.id);
+      if (labelGroup && resetSeatGroups) this.resetContainerTransform(labelGroup);
+      section.perspectiveAffine = void 0;
+      section.perspectiveCorrection = void 0;
+      section.perspectiveDepth = void 0;
+    }
+  }
+  /** Move native seat/booth hit shapes to or from their exact pinhole anchors. */
+  applyExactSeatAnchors(perspective, seatIds) {
+    const seats = seatIds ? [...seatIds].map((id) => this.seatById.get(id)).filter((seat) => !!seat) : perspective ? this.seats : [...this.perspectiveAppliedSeats].map((id) => this.seatById.get(id)).filter((seat) => !!seat);
+    for (const seat of seats) {
+      if (perspective && this.perspectiveAppliedSeats.has(seat.id)) continue;
+      const point = perspective ? this.perspectiveSeatProjected.get(seat.id) ?? seat : seat;
+      const scale = perspective ? this.perspectiveSeatScale.get(seat.id) ?? 1 : 1;
+      const shape = this.circleById.get(seat.id);
+      shape?.position(point);
+      shape?.scale({ x: scale, y: scale });
+      const ring = this.accessRingById.get(seat.id);
+      ring?.position(point);
+      ring?.scale({ x: scale, y: scale });
+      const glyph = this.accessGlyphById.get(seat.id);
+      if (glyph) {
+        const baseGlyphScale = this.seatR * 1.5 / ACCESS_GLYPH_VIEWBOX;
+        glyph.position(point);
+        glyph.scale({ x: baseGlyphScale * scale, y: baseGlyphScale * scale });
+      }
+      const boothLabel = this.boothLabelById.get(seat.id);
+      boothLabel?.position(point);
+      boothLabel?.scale({ x: scale, y: scale });
+      if (perspective) this.perspectiveAppliedSeats.add(seat.id);
+    }
+    if (!perspective) this.perspectiveAppliedSeats.clear();
+  }
+  /**
+   * Phase C projected 2.5D. Seat/booth anchors are exact pinhole projections;
+   * section top surfaces use one explicitly bounded tangent plane per authored
+   * section. Native Konva shapes move with the anchors, so direct hit testing is
+   * the same graph that paints the buyer-visible unit.
+   */
+  applyPerspective(resetElevatedSeatGroups = true) {
+    const camera = this.perspectiveCamera;
+    const base = this.perspectiveBaseAffine;
+    const inverse = this.perspectiveBaseInverse;
+    if (!camera || !base || !inverse) return;
+    const lazySectionSeats = this.seats.length > 2500 && this.sections.length > 0;
+    if (this.cached && !lazySectionSeats) {
+      this.seatLayer.clearCache();
+      this.seatLayer.listening(true);
+      this.cached = false;
+    }
+    this.resetLayerTransforms(resetElevatedSeatGroups);
+    this.resetSectionProjection(resetElevatedSeatGroups);
+    for (const layer of [this.bgLayer, this.overlayLayer]) {
+      this.setContainerAffine(layer, base, camera.target);
+    }
+    this.perspectiveAppliedSeats.clear();
+    if (!lazySectionSeats) this.applyExactSeatAnchors(true);
+    for (const section of this.sections) {
+      const heightAt = (point) => this.sectionSurfaceHeight(section, point);
+      const desired = perspectiveTangentAffine(camera, section.centroid, heightAt);
+      const correction = composeAffine(inverse, desired);
+      section.perspectiveAffine = desired;
+      section.perspectiveCorrection = correction;
+      section.perspectiveDepth = projectPerspectivePoint(
+        camera,
+        section.centroid,
+        heightAt(section.centroid)
+      ).depth;
+      this.setContainerAffine(section.liftGroupBg, correction, section.centroid);
+      for (let index = 0; index < section.sideFaces.length; index++) {
+        const p0 = section.outline[index];
+        const p1 = section.outline[(index + 1) % section.outline.length];
+        const base0 = this.perspectiveLocalPoint(projectPerspectivePoint(camera, p0, 0));
+        const base1 = this.perspectiveLocalPoint(projectPerspectivePoint(camera, p1, 0));
+        const top1 = this.perspectiveLocalPoint(projectPerspectivePoint(camera, p1, heightAt(p1)));
+        const top0 = this.perspectiveLocalPoint(projectPerspectivePoint(camera, p0, heightAt(p0)));
+        section.sideFaces[index].points([
+          base0.x,
+          base0.y,
+          base1.x,
+          base1.y,
+          top1.x,
+          top1.y,
+          top0.x,
+          top0.y
+        ]);
+        section.sideFaces[index].opacity(0.9);
+      }
+    }
+    const farToNear = [...this.sections].sort(
+      (left, right) => (right.perspectiveDepth ?? 0) - (left.perspectiveDepth ?? 0)
+    );
+    for (const section of farToNear) {
+      section.rootGroupBg.moveToTop();
+      section.liftGroupSeat.moveToTop();
+    }
+    this.unsectionedSeatGroup?.moveToTop();
+    this.syncSeatOverlayPositions();
+    if (!lazySectionSeats) this.updateSeatGroupVisibility();
+    this.bgLayer.batchDraw();
+    this.seatLayer.batchDraw();
+    this.overlayLayer.batchDraw();
+  }
   /**
    * Apply the current isoT to the scene: the base rotate+squash as a decomposed
    * layer transform (so seats/décor/rings project together and Konva's own
@@ -2774,6 +3798,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
    * lift + extruded side faces on elevated sections.
    */
   applyIso() {
+    this.resetSectionProjection();
+    this.applyExactSeatAnchors(false);
     const t2 = this.isoT;
     if (t2 === 0) {
       this.resetLayerTransforms();
@@ -2802,6 +3828,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     }
     this.applyUprightLabels();
     this.applyElevation();
+    this.updateSeatGroupVisibility();
     this.bgLayer.batchDraw();
     this.seatLayer.batchDraw();
     this.overlayLayer.batchDraw();
@@ -2830,10 +3857,11 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   applyElevation() {
     const t2 = this.isoT;
     for (const sec of this.sections) {
-      if (sec.elevation <= 0) continue;
-      const off = this.isoLiftLocal(sec.elevation);
+      if (sec.liftWorld <= 0) continue;
+      const off = this.isoLiftLocal(sec.liftWorld);
       sec.liftGroupBg?.position(off);
-      sec.liftGroupSeat?.position(off);
+      sec.liftGroupSeat.position(off);
+      this.labelLiftGroups.get(sec.id)?.position(off);
       const alpha = 0.9 * t2;
       for (let i = 0; i < sec.sideFaces.length; i++) {
         const face = sec.sideFaces[i];
@@ -2843,6 +3871,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         face.opacity(alpha);
       }
     }
+    this.syncSeatOverlayPositions();
   }
   destroy() {
     this.destroyed = true;
@@ -2869,16 +3898,166 @@ var _SeatmapRenderer = class _SeatmapRenderer {
    * tier shifts with one offset in iso view) or the seat layer directly.
    */
   seatContainer(id) {
-    return this.seatSection.get(id)?.liftGroupSeat ?? this.seatLayer;
+    return this.seatSection.get(id)?.liftGroupSeat ?? this.unsectionedSeatGroup ?? this.seatLayer;
   }
-  renderSeats() {
+  /** True when a section belongs to the active logical section/zone focus. */
+  sectionMatchesFocus(section) {
+    const focus = this.focusedSectionId;
+    return focus == null || section.id === focus || section.logicalId === focus || section.zone === focus;
+  }
+  /** Visual opacity after the section-focus overlay is composed. */
+  focusedSeatOpacity(id, localOpacity) {
+    if (!this.focusedSectionId) return localOpacity;
+    const section = this.seatSection.get(id);
+    return localOpacity * (section && this.sectionMatchesFocus(section) ? 1 : FOCUS_DIM_OPACITY);
+  }
+  /** Project a section outline through elevation + the active affine view and
+   *  then into viewport pixels. The result is conservative (AABB), so a visible
+   *  section is never clipped even for rotated or isometric outlines. */
+  sectionScreenBounds(section) {
+    if (this.viewMode === "perspective" && section.perspectiveAffine) {
+      const scale2 = this.stage.scaleX();
+      const stageX2 = this.stage.x();
+      const stageY2 = this.stage.y();
+      return polyBounds(section.outline.map((point) => {
+        const projected = this.projectedSectionPoint(section, point);
+        return { x: projected.x * scale2 + stageX2, y: projected.y * scale2 + stageY2 };
+      }));
+    }
+    const offset = section.liftWorld > 0 ? this.isoLiftLocal(section.liftWorld) : { x: 0, y: 0 };
+    const scale = this.stage.scaleX();
+    const stageX = this.stage.x();
+    const stageY = this.stage.y();
+    return polyBounds(section.outline.map((point) => {
+      const local = { x: point.x + offset.x, y: point.y + offset.y };
+      const projected = this.isoT === 0 ? local : this.isoForward(local);
+      return { x: projected.x * scale + stageX, y: projected.y * scale + stageY };
+    }));
+  }
+  /** Hide only section groups wholly outside a padded viewport at the live-seat
+   *  rung. Overview caching always restores all groups first, so panning a
+   *  cached whole-venue bitmap can never reveal missing inventory. */
+  updateSeatGroupVisibility() {
+    const liveSeats = this.effScale() >= CACHE_THRESHOLD;
+    const deferPerspectiveSeatReveal = this.viewMode === "perspective" && this.glideInProgress && this.seats.length > 2500;
+    const padding = 96;
+    const width = this.stage.width();
+    const height = this.stage.height();
+    for (const section of this.sections) {
+      let visible = true;
+      if (liveSeats) {
+        const bounds2 = this.sectionScreenBounds(section);
+        visible = bounds2.x + bounds2.width >= -padding && bounds2.y + bounds2.height >= -padding && bounds2.x <= width + padding && bounds2.y <= height + padding;
+        if (visible && this.viewMode === "perspective" && !deferPerspectiveSeatReveal) {
+          this.applyExactSeatAnchors(true, section.memberIds);
+        }
+      }
+      section.liftGroupSeat.setViewportCulled(!visible);
+      const labelGroup = this.labelLiftGroups.get(section.id);
+      labelGroup?.setViewportCulled(!visible);
+    }
+    if (this.unsectionedSeatGroup && !this.unsectionedSeatGroup.visible()) {
+      this.unsectionedSeatGroup.visible(true);
+    }
+    if (liveSeats && this.viewMode === "perspective" && !deferPerspectiveSeatReveal) {
+      this.applyExactSeatAnchors(true, this.seats.filter((seat) => !this.seatSection.has(seat.id)).map((seat) => seat.id));
+    }
+  }
+  /** Seats worth considering for viewport labels. Section culling is a safe
+   *  coarse index; the later screen test remains the exact filter. */
+  visibleSeatCandidates() {
+    if (!this.sections.length) return this.seats;
+    const candidates = [];
+    for (const section of this.sections) {
+      if (section.liftGroupSeat.isViewportCulled()) continue;
+      for (const id of section.memberIds) {
+        const seat = this.seatById.get(id);
+        if (seat) candidates.push(seat);
+      }
+    }
     for (const seat of this.seats) {
+      if (!this.seatSection.has(seat.id)) candidates.push(seat);
+    }
+    return candidates;
+  }
+  seatViewportCulled(id) {
+    return this.seatSection.get(id)?.liftGroupSeat.isViewportCulled() ?? false;
+  }
+  /** Local world coordinate at which an elevated seat is actually painted for
+   *  the current iso tween. Flat seats and the 2D endpoint are unchanged. */
+  renderedSeatPoint(seat) {
+    if (this.viewMode === "perspective") return this.perspectiveSeatLocal.get(seat.id) ?? seat;
+    const section = this.seatSection.get(seat.id);
+    if (!section || section.liftWorld <= 0 || this.isoT === 0) return seat;
+    const offset = this.isoLiftLocal(section.liftWorld);
+    return { x: seat.x + offset.x, y: seat.y + offset.y };
+  }
+  /** Overlay labels mirror the seat-layer lift without an O(seats) per-frame
+   *  rewrite. The groups are rebuilt with the zoom-dependent label set. */
+  seatLabelContainer(id) {
+    const section = this.seatSection.get(id);
+    if (!section) return this.labelGroup;
+    let group = this.labelLiftGroups.get(section.id);
+    if (!group) {
+      group = new ViewportGroup({
+        listening: false
+      });
+      group.setViewportCulled(section.liftGroupSeat.isViewportCulled());
+      group.position(this.viewMode === "perspective" ? { x: 0, y: 0 } : this.isoLiftLocal(section.liftWorld));
+      this.labelGroup.add(group);
+      this.labelLiftGroups.set(section.id, group);
+    }
+    return group;
+  }
+  /** Shared overlay furniture is not parented to section lift groups, so keep
+   *  the small transient set aligned explicitly. Selection is capped in buyer
+   *  mode, making this constant-sized work during the iso tween. */
+  syncSeatOverlayPositions() {
+    if (this.hoveredId) {
+      const seat = this.seatById.get(this.hoveredId);
+      if (seat) {
+        this.hoverRing.position(this.renderedSeatPoint(seat));
+        const scale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(seat.id) ?? 1 : 1;
+        this.hoverRing.scale({ x: scale, y: scale });
+      }
+    }
+    if (this.focusedId) {
+      const seat = this.seatById.get(this.focusedId);
+      if (seat) {
+        this.focusRing.position(this.renderedSeatPoint(seat));
+        const scale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(seat.id) ?? 1 : 1;
+        this.focusRing.scale({ x: scale, y: scale });
+      }
+    }
+    for (const [id, marker] of this.selectionMarkers) {
+      const seat = this.seatById.get(id);
+      if (seat) {
+        marker.position(this.renderedSeatPoint(seat));
+        const scale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(seat.id) ?? 1 : 1;
+        marker.scale({ x: scale, y: scale });
+      }
+    }
+  }
+  renderSeats() {
+    const paintOrder = [...this.seats].sort((left, right) => (this.perspectiveSeatDepth.get(right.id) ?? 0) - (this.perspectiveSeatDepth.get(left.id) ?? 0));
+    for (const seat of paintOrder) {
       if (seat.kind === "booth") {
         this.renderBoothUnit(seat);
         continue;
       }
       const target = this.seatContainer(seat.id);
-      const c = new Circle({
+      const c = seat.wheelchairSpaceType === "no-seat" ? new Rect({
+        x: seat.x,
+        y: seat.y,
+        width: this.seatR * 2,
+        height: this.seatR * 2,
+        offsetX: this.seatR,
+        offsetY: this.seatR,
+        cornerRadius: 2,
+        perfectDrawEnabled: false,
+        shadowForStrokeEnabled: false,
+        hitStrokeWidth: 0
+      }) : new Circle({
         x: seat.x,
         y: seat.y,
         radius: this.seatR,
@@ -2891,21 +4070,25 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       this.paintSeat(c, seat.id);
       target.add(c);
       if (seat.accessible) {
-        const ring = new Circle({
-          x: seat.x,
-          y: seat.y,
-          radius: this.seatR + 1.5,
-          stroke: accessibilityRingColor(seat.accessibility),
-          strokeWidth: 2.5,
-          listening: false,
-          perfectDrawEnabled: false,
-          shadowForStrokeEnabled: false
-        });
-        this.accessRingById.set(seat.id, ring);
-        target.add(ring);
-        const glyph = this.buildAccessGlyph(seat, typeof c.fill() === "string" ? c.fill() : "");
-        this.accessGlyphById.set(seat.id, glyph);
-        target.add(glyph);
+        if (seat.wheelchairSpaceType !== "no-seat") {
+          const ring = new Circle({
+            x: seat.x,
+            y: seat.y,
+            radius: this.seatR + 1.5,
+            stroke: accessibilityRingColor(seat.accessibility),
+            strokeWidth: 2.5,
+            listening: false,
+            perfectDrawEnabled: false,
+            shadowForStrokeEnabled: false
+          });
+          this.accessRingById.set(seat.id, ring);
+          target.add(ring);
+        }
+        if (seat.accessibility?.includes("wheelchair")) {
+          const glyph = this.buildAccessGlyph(seat, typeof c.fill() === "string" ? c.fill() : "");
+          this.accessGlyphById.set(seat.id, glyph);
+          target.add(glyph);
+        }
       }
     }
   }
@@ -2943,7 +4126,6 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     t2.offsetX(t2.width() / 2);
     t2.offsetY(t2.height() / 2);
     t2.visible(false);
-    this.boothLabelById.set(seat.id, t2);
     this.hasBoothText = true;
     this.boothLabelById.set(seat.id, t2);
     target.add(t2);
@@ -2966,24 +4148,40 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       scaleY: k,
       fill: stateAwareBookableLabelInk(seatFill, "#ffffff"),
       listening: false,
-      visible: this.accessGlyphVisible,
+      visible: false,
       perfectDrawEnabled: false,
       shadowForStrokeEnabled: false
     });
   }
   /**
-   * Toggle the accessibility glyphs for the current camera scale: shown once the
-   * effective on-screen seat radius clears {@link SEAT_GLYPH_MIN_PX}, otherwise
-   * hidden so only the ring remains. Iterates the (small) accessible-seat set,
-   * never the full node graph, so it is cheap to call on every view change.
+   * Keep physical wheelchair provision readable in screen space at every map
+   * LOD. The active Wheelchair filter promotes it further. Iterates the small
+   * wheelchair-seat set, never the full node graph.
    */
   updateAccessGlyphs(scale) {
     if (!this.accessGlyphById.size) return;
-    this.accessGlyphVisible = this.seatR * scale >= SEAT_GLYPH_MIN_PX;
     for (const [id, glyph] of this.accessGlyphById) {
-      glyph.visible(this.accessGlyphVisible && this.accessGlyphEligible(id));
+      const perspectiveScale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(id) ?? 1 : 1;
+      const baseScale = this.seatR * 1.5 / ACCESS_GLYPH_VIEWBOX * perspectiveScale;
+      const emphasized = this.accessGlyphFilterEmphasized(id);
+      const minimumScreenPx = emphasized ? FILTERED_WHEELCHAIR_GLYPH_MIN_PX : WHEELCHAIR_GLYPH_MIN_PX;
+      const glyphScale = Math.max(
+        baseScale,
+        minimumScreenPx / (ACCESS_GLYPH_VIEWBOX * Math.max(scale, 1e-3))
+      );
+      glyph.scale({ x: glyphScale, y: glyphScale });
+      glyph.visible(this.accessGlyphShouldShow(id));
     }
   }
+  /** True only for a physical wheelchair provision matching an active buyer filter. */
+  accessGlyphFilterEmphasized(id) {
+    const seat = this.seatById.get(id);
+    const filter = this.accessFilter;
+    return !!seat && filter !== null && !!seat.accessibility?.includes("wheelchair") && (filter.length === 0 || filter.includes("wheelchair")) && seatMatchesAccess(seat, filter);
+  }
+  accessGlyphShouldShow(id) {
+    return this.accessGlyphById.has(id) && this.accessGlyphEligible(id);
+  }
   /**
    * Whether an accessible seat's glyph should show for its current status. It is
    * hidden on seats a buyer cannot take (sold, or another buyer's hold) where the
@@ -3063,6 +4261,11 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         c.dash([2, 2]);
         break;
     }
+    if (seat.wheelchairSpaceType === "no-seat" && status === "free") {
+      c.stroke(accessibilityRingColor(seat.accessibility));
+      c.strokeWidth(selected ? 3 : 2);
+      c.dash([3, 2]);
+    }
     if (boothLabel) {
       boothLabel.text(status === "booked" ? "SOLD" : status === "held" ? "HELD" : seat.label);
       boothLabel.fontSize(status === "free" ? 10 : Math.min(10, Math.max(6, this.boothDims.get(seat.rowId)?.width ?? 40) / 6));
@@ -3096,11 +4299,6 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       c.dash([]);
       c.opacity(CLOSED_SEAT_OPACITY);
     }
-    if (this.focusedSectionId) {
-      const sec = this.seatSection.get(id);
-      const inFocus = !!sec && (sec.id === this.focusedSectionId || sec.logicalId === this.focusedSectionId || sec.zone === this.focusedSectionId);
-      if (!inFocus) c.opacity(FOCUS_DIM_OPACITY);
-    }
     if (this.selectionFocusId && id !== this.selectionFocusId) c.opacity(Math.min(c.opacity(), 0.16));
     const bookableLabel = this.boothLabelById.get(id) ?? this.seatLabelById.get(id);
     if (bookableLabel) {
@@ -3114,7 +4312,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       const fill = c.fill();
       accessGlyph.fill(stateAwareBookableLabelInk(typeof fill === "string" ? fill : "", "#ffffff"));
       accessGlyph.opacity(c.opacity());
-      accessGlyph.visible(this.accessGlyphVisible && this.accessGlyphEligible(id));
+      accessGlyph.visible(this.accessGlyphShouldShow(id));
     }
     this.accessRingById.get(id)?.opacity(c.opacity());
   }
@@ -3183,7 +4381,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     if (!this.sections.some((section) => section.id === id || section.logicalId === id)) return;
     this.focusedSectionId = id;
     this.drawFocusBackdrop(id);
-    this.repaintSectionsAndSeats();
+    this.bgLayer.batchDraw();
+    this.overlayLayer.batchDraw();
     this.updateLOD();
     this.focusRegion(id, { minScale: SEAT_FOCUS_SCALE });
   }
@@ -3195,7 +4394,10 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       this.focusBackdrop.destroy();
       this.focusBackdrop = null;
     }
-    this.repaintSectionsAndSeats();
+    this.focusDimOverlay?.destroy();
+    this.focusDimOverlay = null;
+    this.bgLayer.batchDraw();
+    this.overlayLayer.batchDraw();
     this.updateLOD();
   }
   /** The currently AXS-focused section id, or null. */
@@ -3212,16 +4414,69 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     if (!sections.length) return;
     const backdrop = new Group({ listening: false });
     for (const section of sections) {
-      backdrop.add(polygonWithHolesShape(section.outline, section.holes, {
+      const perspective = this.viewMode === "perspective" && section.perspectiveAffine;
+      const outline = perspective ? section.outline.map((point) => this.perspectiveLocalPoint(this.projectedSectionPoint(section, point))) : section.outline;
+      const holes = perspective ? section.holes.map((hole) => hole.map((point) => this.perspectiveLocalPoint(this.projectedSectionPoint(section, point)))) : section.holes;
+      backdrop.add(polygonWithHolesShape(outline, holes, {
         fill: FOCUS_BACKDROP_FILL,
         stroke: rgba("#ffffff", 0.1),
         strokeWidth: 1,
         listening: false
-      }, section.outlinePath));
+      }, perspective ? void 0 : section.outlinePath));
     }
     this.bgLayer.add(backdrop);
     backdrop.moveToTop();
     this.focusBackdrop = backdrop;
+    this.drawFocusDimOverlay(sections);
+  }
+  /** Dim everything outside the active section with one paint-only shape. Group
+   *  opacity would make Konva recursively invalidate absolute-opacity caches on
+   *  all 14k descendants. The cut-out follows the live elevation offset and is
+   *  non-listening, so direct seat hit-testing is unchanged. */
+  drawFocusDimOverlay(sections) {
+    this.focusDimOverlay?.destroy();
+    const span = Math.max(this.bounds.width, this.bounds.height, 1);
+    const padding = span * 4 + 1e3;
+    const outer = [
+      { x: this.bounds.x - padding, y: this.bounds.y - padding },
+      { x: this.bounds.x + this.bounds.width + padding, y: this.bounds.y - padding },
+      { x: this.bounds.x + this.bounds.width + padding, y: this.bounds.y + this.bounds.height + padding },
+      { x: this.bounds.x - padding, y: this.bounds.y + this.bounds.height + padding }
+    ];
+    const signedArea = (points) => points.reduce((sum, point, index) => {
+      const next = points[(index + 1) % points.length];
+      return sum + point.x * next.y - next.x * point.y;
+    }, 0);
+    const overlay = new Shape({
+      fill: this.canvasBackground,
+      opacity: 1 - FOCUS_DIM_OPACITY,
+      listening: false,
+      perfectDrawEnabled: false,
+      sceneFunc: (context, shape) => {
+        const polygonPath = (points) => {
+          if (!points.length) return;
+          context.moveTo(points[0].x, points[0].y);
+          for (let index = 1; index < points.length; index++) context.lineTo(points[index].x, points[index].y);
+          context.closePath();
+        };
+        context.beginPath();
+        polygonPath(outer);
+        for (const section of sections) {
+          const hole = this.viewMode === "perspective" && section.perspectiveAffine ? section.outline.map((point) => this.perspectiveLocalPoint(this.projectedSectionPoint(section, point))) : section.outline.map((point) => {
+            const offset = section.liftWorld > 0 ? this.isoLiftLocal(section.liftWorld) : { x: 0, y: 0 };
+            return { x: point.x + offset.x, y: point.y + offset.y };
+          });
+          polygonPath(signedArea(hole) > 0 ? [...hole].reverse() : hole);
+        }
+        context.fillStrokeShape(shape);
+      }
+    });
+    this.overlayLayer.add(overlay);
+    overlay.moveToTop();
+    for (const marker of this.selectionMarkers.values()) marker.moveToTop();
+    this.hoverRing.moveToTop();
+    this.focusRing.moveToTop();
+    this.focusDimOverlay = overlay;
   }
   /** Repaint every seat + section block to reflect closed/focus state, then redraw. */
   repaintSectionsAndSeats() {
@@ -3285,7 +4540,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.applyGAFilterState();
   }
   renderBackground(doc) {
-    if (doc.backgroundImage) this.renderBackgroundImage(doc.backgroundImage);
+    const buyerBackground = buyerBackgroundImage(doc);
+    if (buyerBackground) this.renderBackgroundImage(buyerBackground);
     for (const obj of doc.objects) if (obj.type === "decorImage") this.renderDecorImage(obj);
     for (const obj of doc.objects) if (obj.type === "section") this.renderSection(obj);
     this.renderZones(doc);
@@ -3365,10 +4621,12 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       listening: false,
       perfectDrawEnabled: false
     });
-    this.bgLayer.add(node);
+    if (obj.layer === "foreground") this.fgDecorGroup.add(node);
+    else this.bgLayer.add(node);
     img.onload = () => {
-      if (!node.getLayer()) return;
-      this.bgLayer.batchDraw();
+      const layer = node.getLayer();
+      if (!layer) return;
+      layer.batchDraw();
     };
     img.src = obj.href;
   }
@@ -3405,7 +4663,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         })
       );
     }
-    const label = this.addCentredLabel(this.bgLayer, obj.label, obj.center.x, obj.center.y, "#cbd5e1", 12, true);
+    const label = this.addCentredLabel(this.bgLayer, obj.displayLabel ?? obj.label, obj.center.x, obj.center.y, "#cbd5e1", 12, true);
     this.freeTextById.set(obj.id, { node: label, background: "#232c40", kind: "table" });
   }
   renderText(obj) {
@@ -3417,11 +4675,12 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       text: obj.text,
       fontSize: obj.fontSize,
       rotation: obj.rotation,
+      fontStyle: konvaFontStyle(obj.bold, obj.italic, "normal"),
       // Authored ink remains preferred, but an embed/theme surface can change
       // the actual canvas. Fail over to readable black/white instead of
       // painting an otherwise valid caption invisibly on that active surface.
       fill: stateAwareBookableLabelInk(background, preferredInk),
-      fontFamily: this.labelFont(),
+      fontFamily: obj.fontFamily ?? this.labelFont(),
       listening: false,
       perfectDrawEnabled: false
     });
@@ -3439,11 +4698,40 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const isDecor = !!obj.role && !isStage;
     const palette = overviewPalette(this.canvasBackground);
     const fill = referenceFocal ? palette.focalFill : authoredFill;
-    const stroke = isStage ? lighten(fill, 0.28) : referenceFocal ? palette.focalStroke : void 0;
-    const strokeWidth = isStage ? 1 : referenceFocal ? 2 : 0;
+    const isOpenPath = obj.kind === "line" || obj.kind === "polyline";
+    const stroke = obj.stroke?.color ?? (isStage ? lighten(fill, 0.28) : referenceFocal ? palette.focalStroke : isOpenPath ? "#9aa3b5" : void 0);
+    const strokeWidth = obj.stroke?.width ?? (isStage ? 1 : referenceFocal ? 2 : isOpenPath ? 2 : 0);
+    const opacity = obj.opacity != null ? clamp(obj.opacity, 0.1, 1) : 1;
     let cx = 0;
     let cy = 0;
-    if (obj.kind === "rect" && obj.x != null && obj.y != null && obj.width != null && obj.height != null) {
+    if (isOpenPath && obj.points && obj.points.length >= 2) {
+      cx = obj.points.reduce((a, p) => a + p.x, 0) / obj.points.length;
+      cy = obj.points.reduce((a, p) => a + p.y, 0) / obj.points.length;
+      const lineStyle = resolvedShapeLineStyle(obj);
+      const arrow = shapeArrowMetrics(strokeWidth);
+      const path = new Arrow({
+        points: obj.points.flatMap((p) => [p.x, p.y]),
+        closed: false,
+        x: cx,
+        y: cy,
+        offsetX: cx,
+        offsetY: cy,
+        rotation: obj.rotation ?? 0,
+        stroke,
+        fill: stroke,
+        strokeWidth,
+        opacity,
+        lineCap: lineStyle.lineCap,
+        lineJoin: lineStyle.lineJoin,
+        pointerAtBeginning: lineStyle.startEnding === "arrow",
+        pointerAtEnding: lineStyle.endEnding === "arrow",
+        ...arrow,
+        listening: false,
+        name: "buyer-shape-open-path"
+      });
+      path.setAttr("shapeObjectId", obj.id);
+      this.bgLayer.add(path);
+    } else if (obj.kind === "rect" && obj.x != null && obj.y != null && obj.width != null && obj.height != null) {
       const grad = isStage ? {
         fillLinearGradientStartPoint: { x: 0, y: 0 },
         fillLinearGradientEndPoint: { x: 0, y: obj.height },
@@ -3463,7 +4751,8 @@ var _SeatmapRenderer = class _SeatmapRenderer {
           ...grad,
           stroke,
           strokeWidth,
-          cornerRadius: 4,
+          cornerRadius: clamp(obj.cornerRadius ?? 4, 0, Math.min(obj.width, obj.height) / 2),
+          opacity,
           listening: false
         })
       );
@@ -3476,7 +4765,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         fillLinearGradientColorStops: [0, darken(fill, 0.3), 1, lighten(fill, 0.12)]
       } : { fill };
       this.bgLayer.add(
-        new Ellipse({ x: cx, y: cy, rotation: obj.rotation ?? 0, radiusX: obj.width / 2, radiusY: obj.height / 2, ...grad, stroke, strokeWidth, listening: false })
+        new Ellipse({ x: cx, y: cy, rotation: obj.rotation ?? 0, radiusX: obj.width / 2, radiusY: obj.height / 2, ...grad, stroke, strokeWidth, opacity, listening: false })
       );
     } else if (obj.kind === "polygon" && obj.points && obj.points.length) {
       const pts = obj.points.flatMap((p) => [p.x, p.y]);
@@ -3491,7 +4780,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         fillLinearGradientColorStops: [0, darken(fill, 0.3), 1, lighten(fill, 0.12)]
       } : { fill };
       this.bgLayer.add(
-        new Line({ points: pts, closed: true, x: cx, y: cy, offsetX: cx, offsetY: cy, rotation: obj.rotation ?? 0, ...grad, stroke, strokeWidth, listening: false })
+        new Line({ points: pts, closed: true, x: cx, y: cy, offsetX: cx, offsetY: cy, rotation: obj.rotation ?? 0, ...grad, stroke, strokeWidth, opacity, listening: false })
       );
     }
     if (obj.label) {
@@ -3550,7 +4839,10 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       strokeWidth: 1.5
     });
     poly.setAttr("gaId", obj.id);
-    poly.on("click tap", () => this.opts.onGAClick?.(obj.id));
+    poly.on("click tap", (e) => {
+      if (this.isGhostClick(e)) return;
+      this.opts.onGAClick?.(obj.id);
+    });
     poly.on("mouseenter", () => {
       this.container.style.cursor = "pointer";
     });
@@ -3560,7 +4852,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.bgLayer.add(poly);
     const labelPoint = polygonLabelPoint(obj.points, obj.holes);
     const containingSection = this.sections.find((section) => pointInPolygonWithHoles(labelPoint, section.outline, section.holes));
-    const label = this.addCentredLabel(this.bgLayer, obj.label, labelPoint.x, labelPoint.y - 8, ink, GA_LABEL_FONT_SIZE, false);
+    const label = this.addCentredLabel(this.bgLayer, obj.displayLabel ?? obj.label, labelPoint.x, labelPoint.y - 8, ink, GA_LABEL_FONT_SIZE, false);
     const capacity = this.addCentredLabel(this.bgLayer, `cap ${obj.capacity}`, labelPoint.x, labelPoint.y + 10, ink, GA_CAPACITY_LABEL_FONT_SIZE, false);
     this.freeTextById.set(`${obj.id}:label`, {
       objectId: obj.id,
@@ -3577,7 +4869,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       categoryKey: obj.categoryKey
     });
     this.gaById.set(obj.id, {
-      label: obj.label,
+      label: obj.displayLabel ?? obj.label,
       capacity: obj.capacity,
       categoryKey: obj.categoryKey,
       points: obj.points,
@@ -3600,7 +4892,9 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const memberIds = [];
     const catCounts = /* @__PURE__ */ new Map();
     let free = 0;
-    for (const seat of this.seats) {
+    const bounds2 = polyBounds(obj.outline);
+    const candidates = this.seatIndex ? queryRect(this.seatIndex, bounds2).map((id) => this.seatById.get(id)).filter((seat) => !!seat) : this.seats;
+    for (const seat of candidates) {
       if (this.seatSection.has(seat.id)) continue;
       if (!pointInPolygonWithHoles(seat, obj.outline, obj.holes)) continue;
       memberIds.push(seat.id);
@@ -3611,11 +4905,19 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       [...catCounts].map(([key, w]) => ({ hex: this.catColor.get(key) ?? "#6e7bff", w })),
       "#3a4358"
     );
-    const elevation = Math.max(0, Math.round(obj.elevation ?? 0));
-    let liftGroupBg = null;
-    let liftGroupSeat = null;
+    const elevation = sectionElevationTier(obj.elevation);
+    const geometry = sectionGeometry(obj, {
+      floorBaseHeightM: this.floorBaseHeightMFor(obj.id)
+    });
+    const liftWorld = geometry.height * CHART_UNITS_PER_METRE;
+    const rootGroupBg = new Group({ listening: false });
+    this.bgLayer.add(rootGroupBg);
+    const liftGroupBg = new Group({ listening: false });
+    rootGroupBg.add(liftGroupBg);
+    const liftGroupSeat = new ViewportGroup({ listening: true });
+    this.seatLayer.add(liftGroupSeat);
     const sideFaces = [];
-    if (elevation > 0) {
+    if (liftWorld > 0) {
       const faceFill = darken(this.zoneColor.get(obj.zone ?? "") ?? baseFill, 0.42);
       for (let i = 0; i < obj.outline.length; i++) {
         const face = new Line({
@@ -3629,14 +4931,11 @@ var _SeatmapRenderer = class _SeatmapRenderer {
           perfectDrawEnabled: false
         });
         sideFaces.push(face);
-        this.bgLayer.add(face);
+        rootGroupBg.add(face);
       }
-      liftGroupBg = new Group({ listening: false });
-      this.bgLayer.add(liftGroupBg);
-      liftGroupSeat = new Group({ listening: false });
-      this.seatLayer.add(liftGroupSeat);
     }
-    const bgTarget = liftGroupBg ?? this.bgLayer;
+    liftGroupBg.moveToTop();
+    const bgTarget = liftGroupBg;
     const outlineTint = obj.color ?? this.zoneColor.get(obj.zone ?? "") ?? "#3a4358";
     const outlinePoly = polygonWithHolesShape(obj.outline, obj.holes, {
       stroke: rgba(outlineTint, 0.5),
@@ -3710,10 +5009,23 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       nameLabelFits: true,
       subLabelFits: true,
       elevation,
+      liftWorld,
+      rakeDeg: geometry.rake,
+      surfaceFocal: memberIds.length ? { ...this.seatById.get(memberIds[0])?.focalPoint ?? this.isoCentre } : { ...this.chartDoc?.focalPoint ?? this.isoCentre },
+      frontDistanceWorld: 0,
+      rootGroupBg,
+      bgZIndex: rootGroupBg.zIndex(),
+      seatZIndex: liftGroupSeat.zIndex(),
       liftGroupBg,
       liftGroupSeat,
       sideFaces
     };
+    const surfaceCandidates = memberIds.map((id) => this.seatById.get(id)).filter((seat) => !!seat);
+    const distanceCandidates = surfaceCandidates.length ? surfaceCandidates : obj.outline;
+    sec.frontDistanceWorld = Math.min(...distanceCandidates.map((point) => Math.hypot(
+      point.x - sec.surfaceFocal.x,
+      point.y - sec.surfaceFocal.y
+    )));
     for (const id of memberIds) this.seatSection.set(id, sec);
     this.refreshSectionFill(sec);
     this.refreshSectionHeat(sec);
@@ -3859,15 +5171,16 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const sectionOverview = scale < CACHE_THRESHOLD;
     if (sectionOverview) blockT = 1;
     if (!this.zones.length) zoneT = 0;
-    this.seatLayer.opacity(sectionOverview ? 0 : 1 - blockT);
+    const deferPerspectiveSeatReveal = this.viewMode === "perspective" && this.glideInProgress && this.seats.length > 2500;
+    this.seatLayer.opacity(sectionOverview || deferPerspectiveSeatReveal ? 0 : 1 - blockT);
     const sx = this.stage.scaleX();
-    const rescale = this.lodScale === 0 || Math.abs(scale - this.lodScale) / (this.lodScale || 1) > 0.02;
+    const rescale = !this.glideInProgress && (this.lodScale === 0 || Math.abs(scale - this.lodScale) / (this.lodScale || 1) > 0.08);
     if (rescale) this.lodScale = scale;
     const focus = this.focusedSectionId;
     const palette = overviewPalette(this.canvasBackground);
     const sectionLabelT = clamp((blockT - 0.2) / 0.8, 0, 1);
     for (const sec of this.sections) {
-      const dim = focus && sec.id !== focus && sec.logicalId !== focus && sec.zone !== focus ? FOCUS_DIM_OPACITY : 1;
+      const dim = this.focusDimOverlay ? 1 : focus && sec.id !== focus && sec.logicalId !== focus && sec.zone !== focus ? FOCUS_DIM_OPACITY : 1;
       sec.outlinePoly.opacity(sectionOverview ? 0 : (1 - blockT) * dim);
       sec.blockPoly.opacity(BLOCK_FILL_ALPHA * blockT * dim);
       sec.blockPoly.stroke(palette.sectionStroke);
@@ -3879,7 +5192,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       );
       sec.nameLabel.fill(sectionInk);
       sec.subLabel.fill(sectionInk);
-      if (rescale) this.fitSectionRungLabels(sec, sx);
+      if (rescale && sectionLabelT > 0.01) this.fitSectionRungLabels(sec, sx);
       const labelOpacity = sectionLabelT * (1 - zoneT) * dim;
       sec.nameLabel.opacity(sec.nameLabelFits ? labelOpacity : 0);
       sec.subLabel.opacity(0);
@@ -3891,12 +5204,14 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       if (zone.sub) zone.sub.opacity(zoneOpacity);
       if (rescale) this.sizeZonePill(zone, sx);
     }
-    this.decollideRungLabels(sx);
-    this.dedupeLogicalSectionLabels();
-    for (const zone of this.zones) {
-      const opacity = zone.label.opacity();
-      zone.back.opacity(opacity);
-      if (zone.sub) zone.sub.opacity(opacity);
+    if (!this.glideInProgress && (sectionLabelT > 0.01 || zoneOpacity > 0.01)) {
+      this.decollideRungLabels(sx);
+      this.dedupeLogicalSectionLabels();
+      for (const zone of this.zones) {
+        const opacity = zone.label.opacity();
+        zone.back.opacity(opacity);
+        if (zone.sub) zone.sub.opacity(opacity);
+      }
     }
     this.bgLayer.batchDraw();
   }
@@ -4023,13 +5338,30 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   screenToWorld(clientPoint) {
     const s = this.stage.scaleX();
     const iso = { x: (clientPoint.x - this.stage.x()) / s, y: (clientPoint.y - this.stage.y()) / s };
+    if (this.viewMode === "perspective" && this.perspectiveBaseInverse) {
+      return applyAffine(this.perspectiveBaseInverse, iso);
+    }
     return this.isoT === 0 ? iso : this.isoInverse(iso);
   }
   /** Section id under a container-relative screen point, or null (Slice 5 tap-to-zoom). */
   sectionAt(clientPoint) {
     if (!this.sections.length) return null;
     const world = this.screenToWorld(clientPoint);
-    const hit = this.sections.find((sec) => pointInPolygonWithHoles(world, sec.outline, sec.holes));
+    const hit = this.sections.find((sec) => {
+      if (this.viewMode === "perspective" && sec.perspectiveAffine) {
+        return pointInPolygonWithHoles(
+          world,
+          sec.outline.map((point) => this.perspectiveLocalPoint(this.projectedSectionPoint(sec, point))),
+          sec.holes.map((hole) => hole.map((point) => this.perspectiveLocalPoint(this.projectedSectionPoint(sec, point))))
+        );
+      }
+      const offset = sec.liftWorld > 0 ? this.isoLiftLocal(sec.liftWorld) : { x: 0, y: 0 };
+      return pointInPolygonWithHoles(
+        { x: world.x - offset.x, y: world.y - offset.y },
+        sec.outline,
+        sec.holes
+      );
+    });
     return hit ? hit.logicalId : null;
   }
   /** Seat ids belonging to a section (Slice 5 section-summary card). */
@@ -4125,15 +5457,20 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     if (!seat) return;
     const candidate = this.selectionFocusId === id;
     const dims = this.boothDims.get(seat.rowId);
+    const rendered = this.renderedSeatPoint(seat);
     const marker = new Group({
       name: "selection-ring",
-      x: seat.x,
-      y: seat.y,
+      x: rendered.x,
+      y: rendered.y,
       rotation: dims?.rotation ?? 0,
       listening: false,
       perfectDrawEnabled: false,
       opacity: this.selectionFocusId && !candidate ? 0.2 : 1
     });
+    if (this.viewMode === "perspective") {
+      const projectionScale = this.perspectiveSeatScale.get(id) ?? 1;
+      marker.scale({ x: projectionScale, y: projectionScale });
+    }
     marker.setAttr("seatId", id);
     const common = {
       stroke: this.effSelection,
@@ -4212,12 +5549,22 @@ var _SeatmapRenderer = class _SeatmapRenderer {
    * must fall through and pick.
    */
   sectionBounds(id) {
-    const bounds = this.sections.filter((section) => section.id === id || section.logicalId === id).map((section) => polyBounds(section.outline));
-    if (!bounds.length) return null;
-    const left = Math.min(...bounds.map((box) => box.x));
-    const top = Math.min(...bounds.map((box) => box.y));
-    const right = Math.max(...bounds.map((box) => box.x + box.width));
-    const bottom = Math.max(...bounds.map((box) => box.y + box.height));
+    const bounds2 = this.sections.filter((section) => section.id === id || section.logicalId === id).map((section) => {
+      if (this.viewMode === "perspective" && section.perspectiveAffine) {
+        return polyBounds(section.outline.map((point) => this.projectedSectionPoint(section, point)));
+      }
+      const offset = section.liftWorld > 0 ? this.isoLiftLocal(section.liftWorld) : { x: 0, y: 0 };
+      const points = section.outline.map((point) => {
+        const local = { x: point.x + offset.x, y: point.y + offset.y };
+        return this.isoT === 0 ? local : this.isoForward(local);
+      });
+      return polyBounds(points);
+    });
+    if (!bounds2.length) return null;
+    const left = Math.min(...bounds2.map((box) => box.x));
+    const top = Math.min(...bounds2.map((box) => box.y));
+    const right = Math.max(...bounds2.map((box) => box.x + box.width));
+    const bottom = Math.max(...bounds2.map((box) => box.y + box.height));
     return { x: left, y: top, width: right - left, height: bottom - top };
   }
   sectionFrameScale(id) {
@@ -4270,15 +5617,16 @@ var _SeatmapRenderer = class _SeatmapRenderer {
    * hijacking a clean tap on empty space beyond the slop.
    */
   nearestSeatToScreen(screen, slopPx) {
-    const s = this.stage.scaleX() || 1;
-    const reachWorld = this.seatR + slopPx / s;
-    const world = this.screenToWorld(screen);
     let best = null;
-    let bestD = reachWorld;
+    let bestD = Infinity;
+    const stageScale = this.stage.scaleX() || 1;
     for (const seat of this.seats) {
       if (!this.selection.has(seat.id) && !this.isSelectable(seat.id)) continue;
-      const d = Math.hypot(seat.x - world.x, seat.y - world.y);
-      if (d < bestD) {
+      const centre = this.worldToScreen(seat);
+      const perspectiveScale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(seat.id) ?? 1 : 1;
+      const reachPx = this.seatR * stageScale * perspectiveScale + slopPx;
+      const d = Math.hypot(centre.x - screen.x, centre.y - screen.y);
+      if (d <= reachPx && d < bestD) {
         bestD = d;
         best = seat.id;
       }
@@ -4288,6 +5636,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   wireInteraction() {
     this.seatLayer.on("click tap", (e) => {
       if (this.moved > PAN_START_SLOP_PX) return;
+      if (this.isGhostClick(e)) return;
       const id = seatIdOf(e.target);
       if (!id) return;
       this.handleSeatTap(id);
@@ -4297,13 +5646,17 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       if (!id) return;
       const seat = this.seatById.get(id);
       if (!seat) return;
-      this.hoverRing.position({ x: seat.x, y: seat.y });
+      this.hoveredId = id;
+      this.hoverRing.position(this.renderedSeatPoint(seat));
+      const projectionScale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(id) ?? 1 : 1;
+      this.hoverRing.scale({ x: projectionScale, y: projectionScale });
       this.hoverRing.visible(true);
       this.overlayLayer.batchDraw();
       this.container.style.cursor = "pointer";
       this.opts.onHover?.(seat);
     });
     this.seatLayer.on("mouseout", () => {
+      this.hoveredId = null;
       this.hoverRing.visible(false);
       this.overlayLayer.batchDraw();
       this.container.style.cursor = "default";
@@ -4318,6 +5671,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     });
     this.stage.on("click tap", (e) => {
       if (this.moved > PAN_START_SLOP_PX) return;
+      if (this.isGhostClick(e)) return;
       const pointer = this.stage.getPointerPosition();
       if (!pointer) return;
       if (!this.cached) {
@@ -4334,11 +5688,10 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         }
       }
       if (this.sections.length) {
-        const world = this.screenToWorld(pointer);
-        const hit = this.sections.find((sn) => pointInPolygonWithHoles(world, sn.outline, sn.holes));
-        if (hit) {
-          if (this.opts.onSectionTap) this.opts.onSectionTap(hit.logicalId);
-          else this.focusRegion(hit.logicalId);
+        const sectionId = this.sectionAt(pointer);
+        if (sectionId) {
+          if (this.opts.onSectionTap) this.opts.onSectionTap(sectionId);
+          else this.focusRegion(sectionId);
           return;
         }
       }
@@ -4355,13 +5708,15 @@ var _SeatmapRenderer = class _SeatmapRenderer {
    */
   deckFloorAt() {
     if (!this.objectFloor.size) return null;
-    const p = this.seatLayer.getRelativePointerPosition();
-    if (!p) return null;
+    const pointer = this.stage.getPointerPosition();
+    if (!pointer) return null;
+    const p = this.screenToWorld(pointer);
     let best = null;
     let bestD = Infinity;
     for (const s of this.seats) {
-      const dx = s.x - p.x;
-      const dy = s.y - p.y;
+      const rendered = this.renderedSeatPoint(s);
+      const dx = rendered.x - p.x;
+      const dy = rendered.y - p.y;
       const d = dx * dx + dy * dy;
       if (d < bestD) {
         bestD = d;
@@ -4448,9 +5803,11 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     }
     const start = performance.now();
     const duration = Math.max(180, Math.min(1200, opts?.durationMs ?? CAMERA_GLIDE_MS));
+    this.glideInProgress = true;
     const step = (now) => {
       if (this.destroyed) {
         this.glideRaf = 0;
+        this.glideInProgress = false;
         return;
       }
       const raw = Math.min(1, (now - start) / duration);
@@ -4458,6 +5815,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       const sc = fromScale + (toScale - fromScale) * e;
       this.stage.scale({ x: sc, y: sc });
       this.stage.position({ x: fromX + (toX - fromX) * e, y: fromY + (toY - fromY) * e });
+      this.updateSeatGroupVisibility();
       this.updateLOD();
       this.scheduleViewChange();
       this.stage.batchDraw();
@@ -4465,6 +5823,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         this.glideRaf = requestAnimationFrame(step);
       } else {
         this.glideRaf = 0;
+        this.glideInProgress = false;
         this.afterViewChange();
       }
     };
@@ -4476,6 +5835,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       cancelAnimationFrame(this.glideRaf);
       this.glideRaf = 0;
     }
+    this.glideInProgress = false;
   }
   /** Current LOD rung derived from effective zoom — drives the ZONES/SECTIONS/SEATS pill. */
   getRung() {
@@ -4492,11 +5852,14 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const labels = this.seats.map((seat) => {
       const shape = this.circleById.get(seat.id);
       const label = this.boothLabelById.get(seat.id) ?? this.seatLabelById.get(seat.id);
+      const localPerspectiveScale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(seat.id) ?? 1 : 1;
+      const seatEffectiveScale = (this.viewMode === "perspective" ? stageScale : effectiveScale) * localPerspectiveScale;
       const authoredFontSize = seat.kind === "booth" ? BOOTH_LABEL_FONT_SIZE : SEAT_LABEL_FONT_SIZE * this.seatLabelScale(seat);
-      const renderedFontPx = rounded((label?.fontSize() ?? authoredFontSize) * effectiveScale);
+      const labelEffectiveScale = this.viewMode === "perspective" && seat.kind !== "booth" ? effectiveScale * localPerspectiveScale : seatEffectiveScale;
+      const renderedFontPx = rounded((label?.fontSize() ?? authoredFontSize) * labelEffectiveScale);
       const screen = this.worldToScreen(seat);
       const outside = screen.x < 0 || screen.x > viewport.width || screen.y < 0 || screen.y > viewport.height;
-      const opacity = shape?.opacity() ?? 0;
+      const opacity = this.focusedSeatOpacity(seat.id, shape?.getAbsoluteOpacity() ?? 0);
       const section = this.seatSection.get(seat.id);
       const visible = Boolean(label?.isVisible()) && opacity >= 0.5 && !outside;
       let hiddenReason;
@@ -4507,17 +5870,21 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         else if (!label) hiddenReason = "clutter-or-fit";
         else hiddenReason = "renderer-hidden";
       }
-      const labelWidth = label ? label.width() * stageScale : 0;
-      const labelHeight = label ? label.height() * effectiveScale : 0;
-      const directWidthPx = shape instanceof Rect ? shape.width() * stageScale : this.seatR * 2 * effectiveScale;
-      const directHeightPx = shape instanceof Rect ? shape.height() * stageScale : this.seatR * 2 * effectiveScale;
-      const assistedDiameterPx = 2 * (this.seatR * effectiveScale + SEAT_TAP_SLOP_PX);
+      const labelWidth = label ? label.width() * stageScale * localPerspectiveScale : 0;
+      const labelHeight = label ? label.height() * (this.viewMode === "perspective" && seat.kind === "booth" ? stageScale : effectiveScale) * localPerspectiveScale : 0;
+      const directWidthPx = shape instanceof Rect ? shape.width() * stageScale * localPerspectiveScale : this.seatR * 2 * seatEffectiveScale;
+      const directHeightPx = shape instanceof Rect ? shape.height() * (this.viewMode === "perspective" ? stageScale : effectiveScale) * localPerspectiveScale : this.seatR * 2 * seatEffectiveScale;
+      const assistedDiameterPx = 2 * (this.seatR * seatEffectiveScale + SEAT_TAP_SLOP_PX);
       const fill = shape?.fill();
       const ink = label?.fill();
+      const accessGlyph = this.accessGlyphById.get(seat.id);
+      const accessGlyphScale = accessGlyph?.getAbsoluteScale();
       return {
         seatId: seat.id,
         label: seat.label,
         kind: seat.kind === "booth" ? "booth" : "seat",
+        markerShape: seat.kind === "booth" ? "booth" : seat.wheelchairSpaceType === "no-seat" ? "square" : "circle",
+        ...seat.wheelchairSpaceType ? { wheelchairSpaceType: seat.wheelchairSpaceType } : {},
         categoryKey: seat.categoryKey,
         ...section ? { sectionId: section.id } : {},
         ...section?.zone ? { zoneId: section.zone } : {},
@@ -4528,8 +5895,15 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         fill: typeof fill === "string" ? fill : "",
         ink: typeof ink === "string" ? ink : this.theme.seatLabelColor ?? DEF_SEAT_LABEL,
         opacity: rounded(opacity),
+        ...accessGlyph ? {
+          accessibilityMarker: {
+            glyphVisible: accessGlyph.isVisible(),
+            glyphWidthPx: rounded(ACCESS_GLYPH_VIEWBOX * Math.abs(accessGlyphScale?.x ?? 0)),
+            emphasizedByFilter: this.accessGlyphFilterEmphasized(seat.id)
+          }
+        } : {},
         pointerTarget: {
-          active: !this.cached && this.isSelectable(seat.id),
+          active: !this.cached && !this.seatViewportCulled(seat.id) && Boolean(shape?.isVisible()) && Boolean(shape?.isListening()) && this.isSelectable(seat.id),
           directWidthPx: rounded(directWidthPx),
           directHeightPx: rounded(directHeightPx),
           effectiveMinimumPx: rounded(Math.max(
@@ -4557,7 +5931,11 @@ var _SeatmapRenderer = class _SeatmapRenderer {
         node.height(),
         node.rotation()
       );
-      const screenBounds = pointsBounds(worldCorners.map((corner) => this.worldToScreen(corner)));
+      const lift = section && section.liftWorld > 0 ? this.isoLiftLocal(section.liftWorld) : { x: 0, y: 0 };
+      const screenBounds = pointsBounds(worldCorners.map((corner) => this.worldToScreen({
+        x: corner.x + lift.x,
+        y: corner.y + lift.y
+      })));
       const opacity = rounded(node.opacity());
       const ink = node.fill();
       const outside = screenBounds.x + screenBounds.width < 0 || screenBounds.x > viewport.width || screenBounds.y + screenBounds.height < 0 || screenBounds.y > viewport.height;
@@ -4696,6 +6074,15 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     const visibleSectionShells = this.sections.filter((section) => section.blockPoly.opacity() > 0.05);
     return {
       viewport,
+      projection: this.viewMode,
+      ...this.viewMode === "perspective" ? {
+        perspective: {
+          model: "pinhole-exact-seat-anchors",
+          sectionSurfaceModel: "tangent-plane",
+          exactSeatAnchorCount: this.perspectiveSeatProjected.size,
+          depthSorted: true
+        }
+      } : {},
       canvasBackground: this.canvasBackground,
       effectiveScale: rounded(effectiveScale),
       rung: this.getRung(),
@@ -4750,10 +6137,10 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     let cy = viewCentre.y;
     if (rung === "sections" && this.sections.length > 0) {
       const sectionCentres = this.sections.map((section) => {
-        const bounds = polyBounds(section.outline);
+        const bounds2 = polyBounds(section.outline);
         return {
-          x: bounds.x + bounds.width / 2,
-          y: bounds.y + bounds.height / 2
+          x: bounds2.x + bounds2.width / 2,
+          y: bounds2.y + bounds2.height / 2
         };
       });
       const halfWidth = w / (target * 2);
@@ -4820,6 +6207,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   }
   /** Recompute LOD (cache/labels) after any pan/zoom settles. */
   afterViewChange() {
+    this.updateSeatGroupVisibility();
     this.updateLOD();
     this.updateFreeTextVisibility();
     this.updateLabels();
@@ -4844,10 +6232,15 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     this.paintGAStateForView();
     this.updateAccessGlyphs(scale);
     const shouldCache = scale < CACHE_THRESHOLD;
+    const suppressPerspectiveSeatCache = this.viewMode === "perspective" && this.hasSections && this.seats.length > 2500 && shouldCache;
+    if (suppressPerspectiveSeatCache) {
+      this.seatLayer.listening(false);
+      return;
+    }
     if (shouldCache && !this.cached) {
       this.cacheSeatLayer();
-    } else if (!shouldCache && this.cached) {
-      this.seatLayer.clearCache();
+    } else if (!shouldCache && (this.cached || !this.seatLayer.listening())) {
+      if (this.cached) this.seatLayer.clearCache();
       this.seatLayer.listening(true);
       this.cached = false;
       this.seatLayer.batchDraw();
@@ -4856,6 +6249,7 @@ var _SeatmapRenderer = class _SeatmapRenderer {
   /** Rebuild the seat-layer bitmap synchronously (no paint). Shared by the
    *  debounced cacheSeatLayer() and the synchronous forceDraw() catch-up. */
   rebuildSeatCache() {
+    this.updateSeatGroupVisibility();
     const pr = clamp(this.stage.scaleX() * this.dpr, 0.15, 2);
     this.seatLayer.clearCache();
     this.seatLayer.cache({ pixelRatio: pr });
@@ -4907,31 +6301,31 @@ var _SeatmapRenderer = class _SeatmapRenderer {
     for (const [id, label] of this.boothLabelById) {
       const shape = this.circleById.get(id);
       label.visible(
-        isBookableLabelLegibleAtScale(label.fontSize(), effectiveScale) && (shape?.opacity() ?? 1) >= 0.5
+        isBookableLabelLegibleAtScale(label.fontSize(), effectiveScale) && Boolean(shape?.isVisible()) && this.focusedSeatOpacity(id, shape?.getAbsoluteOpacity() ?? 1) >= 0.5
       );
     }
     this.labelGroup.destroyChildren();
+    this.labelLiftGroups.clear();
     this.seatLabelById.clear();
     if (!show) {
       this.overlayLayer.batchDraw();
       return;
     }
-    const s = this.stage.scaleX();
-    const x0 = -this.stage.x() / s;
-    const y0 = -this.stage.y() / s;
-    const x1 = (this.stage.width() - this.stage.x()) / s;
-    const y1 = (this.stage.height() - this.stage.y()) / s;
     let count = 0;
-    for (const seat of this.seats) {
+    for (const seat of this.visibleSeatCandidates()) {
       if (seat.kind === "booth") continue;
-      if (seat.x < x0 || seat.x > x1 || seat.y < y0 || seat.y > y1) continue;
-      if (seat.accessible && this.accessGlyphVisible) continue;
+      const screen = this.worldToScreen(seat);
+      if (screen.x < -20 || screen.x > this.stage.width() + 20 || screen.y < -20 || screen.y > this.stage.height() + 20) continue;
+      if (this.accessGlyphById.has(seat.id) && this.accessGlyphShouldShow(seat.id)) continue;
       const shape = this.circleById.get(seat.id);
-      if ((shape?.opacity() ?? 1) < 0.5) continue;
+      if (!shape?.isVisible() || this.focusedSeatOpacity(seat.id, shape.getAbsoluteOpacity()) < 0.5) continue;
       const status = this.statusById.get(seat.id) ?? "free";
+      const labelPoint = this.renderedSeatPoint(seat);
+      const perspectiveScale = this.viewMode === "perspective" ? this.perspectiveSeatScale.get(seat.id) ?? 1 : 1;
       const unavailable = status === "booked" || status === "held" && !this.ownedHold.has(seat.id) && !this.opts.manageMode;
       if (unavailable) {
-        const cue = new Group({ x: seat.x, y: seat.y, listening: false });
+        const cue = new Group({ x: labelPoint.x, y: labelPoint.y, listening: false });
+        cue.scale({ x: perspectiveScale, y: perspectiveScale });
         if (status === "held") {
           cue.add(new Rect({
             x: -4.2,
@@ -4960,14 +6354,14 @@ var _SeatmapRenderer = class _SeatmapRenderer {
             listening: false
           }));
         }
-        this.labelGroup.add(cue);
+        this.seatLabelContainer(seat.id).add(cue);
         if (++count >= MAX_LABELS) break;
         continue;
       }
       const authoredFontSize = SEAT_LABEL_FONT_SIZE * this.seatLabelScale(seat);
       const t2 = new Text({
-        x: seat.x,
-        y: seat.y,
+        x: labelPoint.x,
+        y: labelPoint.y,
         text: bookableMarkerLabel(seat.displayLabel ?? seat.label),
         fontSize: authoredFontSize,
         fontStyle: "600",
@@ -4988,11 +6382,12 @@ var _SeatmapRenderer = class _SeatmapRenderer {
       }
       t2.offsetX(t2.width() / 2);
       t2.offsetY(t2.height() / 2);
-      this.labelGroup.add(t2);
+      t2.scale({ x: perspectiveScale, y: perspectiveScale });
+      this.seatLabelContainer(seat.id).add(t2);
       this.seatLabelById.set(seat.id, t2);
       if (++count >= MAX_LABELS) break;
     }
-    if (this.isoT > 0) this.applyUprightLabels();
+    if (this.isoT > 0 && this.viewMode !== "perspective") this.applyUprightLabels();
     this.overlayLayer.batchDraw();
   }
   handleResize() {
@@ -5058,6 +6453,7 @@ function strandedSingles(seats, statusOf, selectedIds) {
 
 // src/core/bestAvailable.ts
 function seatIndex2(seat, fallback) {
+  if (Number.isInteger(seat.logicalSeatIndex)) return seat.logicalSeatIndex;
   const i = seat.id.lastIndexOf(":");
   if (i < 0) return fallback;
   const n = Number(seat.id.slice(i + 1));
@@ -5077,21 +6473,25 @@ function centroid(seats) {
   }
   return { x: x / seats.length, y: y / seats.length };
 }
+function candidateFocal(seats, fallback) {
+  return seats.find((seat) => seat.focalPoint)?.focalPoint ?? fallback;
+}
 function isPremium(seat) {
   return seat.commercial?.premium === true;
 }
 function pickBestAvailable(seats, available, opts) {
   const qty = Math.floor(opts.qty);
   if (!Number.isFinite(qty) || qty <= 0) return { labels: [], reason: "sold_out" };
-  const { categoryKey, focal, preferPremium } = opts;
+  const { categoryKey, zoneId, focal, preferPremium } = opts;
   const rows = /* @__PURE__ */ new Map();
   const eligibleAll = [];
   seats.forEach((seat, i) => {
-    const elig = available.has(seat.label) && (!categoryKey || seat.categoryKey === categoryKey);
-    let arr = rows.get(seat.rowId);
+    const elig = available.has(seat.label) && (!categoryKey || seat.categoryKey === categoryKey) && (!zoneId || seat.zoneId === zoneId);
+    const rowId = seat.logicalRowId ?? seat.rowId;
+    let arr = rows.get(rowId);
     if (!arr) {
       arr = [];
-      rows.set(seat.rowId, arr);
+      rows.set(rowId, arr);
     }
     arr.push({ seat, index: seatIndex2(seat, i), elig });
     if (elig) eligibleAll.push(seat);
@@ -5116,7 +6516,7 @@ function pickBestAvailable(seats, available, opts) {
         continue;
       }
       let j = i;
-      while (j < slots.length && slots[j].elig) j++;
+      while (j < slots.length && slots[j].elig && (j === i || slots[j].index === slots[j - 1].index + 1)) j++;
       const segLen = j - i;
       for (let p = 0; p + qty <= segLen; p++) {
         const leftRem = p;
@@ -5130,7 +6530,7 @@ function pickBestAvailable(seats, available, opts) {
           startIndex: slots[i + p].index,
           orphan,
           nonPremium: preferPremium ? runSeats.reduce((n, s) => n + (isPremium(s) ? 0 : 1), 0) : 0,
-          d2: dist2(centroid(runSeats), focal)
+          d2: dist2(centroid(runSeats), candidateFocal(runSeats, focal))
         };
         if (better(c)) best = c;
       }
@@ -5139,20 +6539,71 @@ function pickBestAvailable(seats, available, opts) {
   }
   if (best) return { labels: best.labels };
   if (eligibleAll.length < qty) return { labels: [], reason: "not_enough_together" };
-  const ranked = eligibleAll.map((seat, i) => ({ seat, i, d2: dist2(seat, focal) })).sort((a, b) => {
+  const ranked = eligibleAll.map((seat, i) => ({ seat, i, d2: dist2(seat, seat.focalPoint ?? focal) })).sort((a, b) => {
     if (preferPremium) {
       const pa = isPremium(a.seat) ? 0 : 1;
       const pb = isPremium(b.seat) ? 0 : 1;
       if (pa !== pb) return pa - pb;
     }
     if (a.d2 !== b.d2) return a.d2 - b.d2;
-    const r = a.seat.rowId.localeCompare(b.seat.rowId);
+    const r = (a.seat.logicalRowId ?? a.seat.rowId).localeCompare(b.seat.logicalRowId ?? b.seat.rowId);
     if (r !== 0) return r;
     return seatIndex2(a.seat, a.i) - seatIndex2(b.seat, b.i);
   });
   return { labels: ranked.slice(0, qty).map((r) => r.seat.label) };
 }
 
+// src/core/tableInventory.ts
+var GroupedTableProjectionError = class extends Error {
+  constructor(objectId, message) {
+    super(message);
+    this.objectId = objectId;
+    this.name = "GroupedTableProjectionError";
+  }
+};
+function bounds(table) {
+  const min = table.minOccupancy;
+  const max = table.maxOccupancy;
+  if (!Number.isInteger(min) || !Number.isInteger(max) || min < 1 || max < min || max > table.seatCount) {
+    throw new GroupedTableProjectionError(
+      table.id,
+      `Table "${table.label}" has invalid variable-occupancy bounds`
+    );
+  }
+  return { min, max };
+}
+function groupedTableInventory(doc, modelVersion) {
+  if (modelVersion !== 2) return [];
+  const units = [];
+  for (const object of allObjects(doc)) {
+    if (object.type !== "table" || !object.bookAsWhole && !object.variableOccupancy) continue;
+    if (object.bookAsWhole && object.variableOccupancy) {
+      throw new GroupedTableProjectionError(
+        object.id,
+        `Table "${object.label}" cannot be whole-table and variable-occupancy inventory`
+      );
+    }
+    if (!Number.isInteger(object.seatCount) || object.seatCount < 1 || !object.label.trim()) {
+      throw new GroupedTableProjectionError(object.id, "Grouped tables require a label and at least one chair");
+    }
+    const mode = object.variableOccupancy ? "variable" : "whole";
+    const occupancy = mode === "variable" ? bounds(object) : { min: object.seatCount, max: object.seatCount };
+    units.push({
+      objectId: object.id,
+      label: object.label,
+      ...object.displayLabel ? { displayLabel: object.displayLabel } : {},
+      ...object.displayType ? { displayType: object.displayType } : {},
+      categoryKey: object.categoryKey,
+      mode,
+      capacity: object.seatCount,
+      minOccupancy: occupancy.min,
+      maxOccupancy: occupancy.max,
+      chairs: expandTable(object)
+    });
+  }
+  return units;
+}
+
 // src/picker/PickerController.ts
 var DEFAULT_MAX_SELECTION = 10;
 var MAX_BACKOFF_MS = 15e3;
@@ -5184,6 +6635,14 @@ var PickerController = class {
     /** id → buyer-facing spatial metadata used by every tooltip/confirm surface. */
     this.seatContext = /* @__PURE__ */ new Map();
     this.allIds = [];
+    /** Model-2 tables are one booking unit whose chairs remain renderer geometry. */
+    this.groupedTablesByObject = /* @__PURE__ */ new Map();
+    this.groupedTablesByLabel = /* @__PURE__ */ new Map();
+    this.groupedTableBySeatId = /* @__PURE__ */ new Map();
+    this.tableQuantities = /* @__PURE__ */ new Map();
+    /** Variable quantity is a buyer contract, never an inferred default. */
+    this.confirmedVariableTables = /* @__PURE__ */ new Set();
+    this.groupedSelectionOverhead = 0;
     // realtime socket
     this.ws = null;
     this.reconnectTimer = null;
@@ -5245,6 +6704,20 @@ var PickerController = class {
   idForLabel(label) {
     return this.labelToId.get(label);
   }
+  idsForLabel(label) {
+    const table = this.groupedTablesByLabel.get(label);
+    if (table) return table.chairs.map((chair) => chair.id);
+    const id = this.labelToId.get(label);
+    return id ? [id] : [];
+  }
+  idsForLabels(labels) {
+    return [...new Set([...labels].flatMap((label) => this.idsForLabel(label)))];
+  }
+  /** Resolve a physical chair id (or table inventory label) to its table unit. */
+  tableSelection(seatIdOrLabel) {
+    const group = this.groupedTableBySeatId.get(seatIdOrLabel) ?? this.groupedTablesByLabel.get(seatIdOrLabel);
+    return group ? this.toTableSeat(group) : null;
+  }
   /** Fetch chart, build label maps, mount the renderer, seed statuses, go live. */
   async render(host) {
     if (this.renderer) return null;
@@ -5258,6 +6731,29 @@ var PickerController = class {
     }
     if (this.closed) return null;
     this._doc = res.doc;
+    try {
+      const groups = groupedTableInventory(
+        res.doc,
+        res.event.inventoryModelVersion === 2 ? 2 : 1
+      );
+      this.groupedTablesByObject = new Map(groups.map((group) => [group.objectId, group]));
+      this.groupedTablesByLabel = new Map(groups.map((group) => [group.label, group]));
+      this.groupedTableBySeatId = new Map(
+        groups.flatMap((group) => group.chairs.map((chair) => [chair.id, group]))
+      );
+      this.tableQuantities = new Map(groups.map((group) => [
+        group.label,
+        group.mode === "whole" ? group.capacity : group.minOccupancy
+      ]));
+      this.confirmedVariableTables = /* @__PURE__ */ new Set();
+      this.groupedSelectionOverhead = groups.reduce(
+        (sum, group) => sum + Math.max(0, group.chairs.length - 1),
+        0
+      );
+    } catch (err) {
+      this.emitError(err);
+      return null;
+    }
     this.labelToId = /* @__PURE__ */ new Map();
     this.labelToSeat = /* @__PURE__ */ new Map();
     this.seatById = /* @__PURE__ */ new Map();
@@ -5275,32 +6771,43 @@ var PickerController = class {
       this.allIds.push(s.id);
       const source = chartObjects.get(s.rowId);
       const sourceLabel = source && "label" in source && typeof source.label === "string" ? source.label : void 0;
-      const sourceDisplayLabel = source && "displayLabel" in source && typeof source.displayLabel === "string" && source.displayLabel ? source.displayLabel : sourceLabel;
-      const rowLabel = s.kind === "booth" ? void 0 : sourceDisplayLabel;
-      const rowType = source && "displayType" in source && typeof source.displayType === "string" && source.displayType.trim() ? source.displayType.trim() : void 0;
+      const logicalRow = source?.type === "row" ? source.segmentedRow : void 0;
+      const sourceDisplayLabel = logicalRow?.displayLabel ?? (source && "displayLabel" in source && typeof source.displayLabel === "string" && source.displayLabel ? source.displayLabel : sourceLabel);
+      const groupedTable = this.groupedTablesByObject.get(s.rowId);
+      const objectType = source?.type === "table" ? "table" : source?.type === "booth" ? "booth" : "seat";
+      const rowLabel = sourceDisplayLabel;
+      const rowType = logicalRow?.displayType?.trim() || (source && "displayType" in source && typeof source.displayType === "string" && source.displayType.trim() ? source.displayType.trim() : void 0);
       const visibleSeatLabel = s.displayLabel ?? s.label;
       const labelParts = visibleSeatLabel.split("-");
-      const seatNumber = sourceDisplayLabel && visibleSeatLabel.startsWith(`${sourceDisplayLabel}-`) ? visibleSeatLabel.slice(sourceDisplayLabel.length + 1) : s.kind === "booth" ? visibleSeatLabel : labelParts[labelParts.length - 1] ?? visibleSeatLabel;
+      const seatNumber = groupedTable ? void 0 : s.kind === "booth" ? void 0 : sourceDisplayLabel && visibleSeatLabel.startsWith(`${sourceDisplayLabel}-`) ? visibleSeatLabel.slice(sourceDisplayLabel.length + 1) : labelParts[labelParts.length - 1] ?? visibleSeatLabel;
       this.seatContext.set(s.id, {
+        objectId: s.rowId,
+        objectType,
         sectionLabel: sectionLabels.get(membership.objectToSection.get(s.rowId) ?? ""),
         rowLabel,
         seatNumber,
-        rowType
+        ...rowType ? { displayType: rowType, rowType } : {}
       });
     }
+    for (const group of this.groupedTablesByLabel.values()) {
+      const representative = group.chairs[0];
+      if (!representative) continue;
+      this.labelToId.set(group.label, representative.id);
+      this.labelToSeat.set(group.label, representative);
+    }
     const currency = res.event.currency ?? this.opts.currency;
     this.currency = currency ?? "USD";
     const renderer = createRenderer(host, {
-      maxSelection: this.maxSelection,
+      // Group chairs are selected together for paint, but count as one logical
+      // inventory line. The controller enforces the guest-weighted cap.
+      maxSelection: this.rendererSelectionCap(),
       confirmSelection: this.opts.confirmSelection,
       currency,
       onSelect: (seat) => {
-        this.opts.onSelect?.(seat);
-        this.emitSelectionChange();
+        this.handleRendererSelect(seat);
       },
       onDeselect: (seat) => {
-        this.opts.onDeselect?.(seat);
-        this.emitSelectionChange();
+        this.handleRendererDeselect(seat);
       },
       onSelectionLimit: this.opts.onSelectionLimit,
       onHover: (seat) => {
@@ -5355,7 +6862,20 @@ var PickerController = class {
   // ---- selection ------------------------------------------------------------
   getSelection() {
     if (!this.renderer) return [];
-    return this.renderer.getSelection().map((s) => this.toSeat(s));
+    const out = [];
+    const grouped = /* @__PURE__ */ new Set();
+    for (const seat of this.renderer.getSelection()) {
+      const table = this.groupedTableBySeatId.get(seat.id);
+      if (table) {
+        if (!grouped.has(table.label)) {
+          grouped.add(table.label);
+          out.push(this.toTableSeat(table));
+        }
+      } else {
+        out.push(this.toSeat(seat));
+      }
+    }
+    return out;
   }
   /** Enriched metadata for a seat confirmation card or tooltip. */
   seatDetails(seatId) {
@@ -5364,20 +6884,168 @@ var PickerController = class {
   }
   clearSelection() {
     this.renderer?.clearSelection();
+    this.resetUnheldTableQuantities();
     this.emitSelectionChange();
   }
   deselect(ids) {
-    this.renderer?.deselect(ids);
+    const expanded = /* @__PURE__ */ new Set();
+    for (const id of ids) {
+      const table = this.groupedTableBySeatId.get(id) ?? this.groupedTablesByLabel.get(id);
+      if (table) {
+        table.chairs.forEach((chair) => expanded.add(chair.id));
+        if (!this.hold_?.labels.includes(table.label)) {
+          this.tableQuantities.set(
+            table.label,
+            table.mode === "whole" ? table.capacity : table.minOccupancy
+          );
+          if (table.mode === "variable") this.confirmedVariableTables.delete(table.label);
+        }
+      } else expanded.add(id);
+    }
+    this.renderer?.deselect([...expanded]);
     this.emitSelectionChange();
   }
   setMaxSelection(maxSelection) {
     this.maxSelection = Math.max(0, Math.floor(maxSelection));
-    this.renderer?.setMaxSelection?.(this.maxSelection);
+    this.renderer?.setMaxSelection?.(this.rendererSelectionCap());
   }
   select(ids) {
-    const added = this.renderer?.select?.(ids) ?? [];
+    const before = new Set(this.getSelection().map((seat) => seat.label));
+    const expanded = /* @__PURE__ */ new Set();
+    for (const id of ids) {
+      const table = this.groupedTableBySeatId.get(id) ?? this.groupedTablesByLabel.get(id);
+      if (table) table.chairs.forEach((chair) => expanded.add(chair.id));
+      else expanded.add(id);
+    }
+    this.renderer?.select?.([...expanded]);
+    if (this.selectionGuestCount() > this.maxSelection) {
+      this.renderer?.deselect([...expanded]);
+      this.opts.onSelectionLimit?.(this.maxSelection);
+      return [];
+    }
+    const added = this.getSelection().filter((seat) => !before.has(seat.label));
     if (added.length) this.emitSelectionChange();
-    return added.map((seat) => this.toSeat(seat));
+    return added;
+  }
+  /** Confirm/update the guest quantity for a selected variable table. */
+  setTableQuantity(label, quantity) {
+    const table = this.groupedTablesByLabel.get(label);
+    if (!table) return false;
+    const q = table.mode === "whole" ? table.capacity : Math.floor(quantity);
+    if (!Number.isInteger(q) || q < table.minOccupancy || q > table.maxOccupancy) return false;
+    const previous = this.tableQuantities.get(label) ?? table.minOccupancy;
+    this.tableQuantities.set(label, q);
+    if (this.selectionGuestCount() > this.maxSelection) {
+      this.tableQuantities.set(label, previous);
+      this.opts.onSelectionLimit?.(this.maxSelection);
+      return false;
+    }
+    if (table.mode === "variable") this.confirmedVariableTables.add(label);
+    this.emitSelectionChange();
+    return true;
+  }
+  /** Atomically replace an active variable-table hold with a new guest count. */
+  async replaceTableQuantity(label, quantity) {
+    const table = this.groupedTablesByLabel.get(label);
+    const hold = this.hold_;
+    if (!table || table.mode !== "variable" || !hold?.labels.includes(label)) return null;
+    const q = Math.floor(quantity);
+    if (!Number.isInteger(q) || q < table.minOccupancy || q > table.maxOccupancy) return null;
+    const otherGuests = (hold.items ?? []).filter((item) => item.label !== label).reduce((sum, item) => sum + (item.quantity ?? 1), 0);
+    if (otherGuests + q > this.maxSelection) {
+      this.opts.onSelectionLimit?.(this.maxSelection);
+      return null;
+    }
+    const selections = (hold.items ?? []).map((item) => ({
+      label: item.label,
+      tierId: item.tierId,
+      quantity: item.label === label ? q : item.quantity
+    }));
+    if (!selections.some((item) => item.label === label)) return null;
+    const result = await this.api.hold(this.key, selections, void 0, hold.holdId);
+    this.tableQuantities.set(label, q);
+    this.setHold({
+      holdId: result.holdId,
+      labels: selections.map((item) => item.label),
+      expiresAt: result.expiresAt,
+      items: result.items
+    });
+    return this.hold_;
+  }
+  rendererSelectionCap() {
+    return this.maxSelection + this.groupedSelectionOverhead;
+  }
+  selectionGuestCount() {
+    return this.getSelection().reduce((sum, seat) => sum + (seat.quantity ?? 1), 0);
+  }
+  handleRendererSelect(seat) {
+    const table = this.groupedTableBySeatId.get(seat.id);
+    if (table) {
+      if (this.selectionGuestCount() > this.maxSelection) {
+        this.renderer?.deselect(table.chairs.map((chair) => chair.id));
+        this.opts.onSelectionLimit?.(this.maxSelection);
+        this.emitSelectionChange();
+        return;
+      }
+      this.renderer?.select?.(table.chairs.map((chair) => chair.id));
+      this.opts.onSelect?.(table.chairs[0] ?? seat);
+      this.opts.onTableSelectionRequest?.(this.toTableSeat(table));
+      this.emitSelectionChange();
+      return;
+    }
+    if (this.selectionGuestCount() > this.maxSelection) {
+      this.renderer?.deselect([seat.id]);
+      this.opts.onSelectionLimit?.(this.maxSelection);
+      this.emitSelectionChange();
+      return;
+    }
+    this.opts.onSelect?.(seat);
+    this.emitSelectionChange();
+  }
+  handleRendererDeselect(seat) {
+    const table = this.groupedTableBySeatId.get(seat.id);
+    if (table) {
+      this.renderer?.deselect(table.chairs.map((chair) => chair.id));
+      if (!this.hold_?.labels.includes(table.label)) {
+        this.tableQuantities.set(
+          table.label,
+          table.mode === "whole" ? table.capacity : table.minOccupancy
+        );
+        if (table.mode === "variable") this.confirmedVariableTables.delete(table.label);
+      }
+      this.opts.onDeselect?.(table.chairs[0] ?? seat);
+    } else {
+      this.opts.onDeselect?.(seat);
+    }
+    this.emitSelectionChange();
+  }
+  resetUnheldTableQuantities() {
+    for (const table of this.groupedTablesByLabel.values()) {
+      if (this.hold_?.labels.includes(table.label)) continue;
+      this.tableQuantities.set(
+        table.label,
+        table.mode === "whole" ? table.capacity : table.minOccupancy
+      );
+      if (table.mode === "variable") this.confirmedVariableTables.delete(table.label);
+    }
+  }
+  resetTableQuantitiesForLabels(labels) {
+    for (const label of labels) {
+      const table = this.groupedTablesByLabel.get(label);
+      if (!table) continue;
+      this.tableQuantities.set(
+        label,
+        table.mode === "whole" ? table.capacity : table.minOccupancy
+      );
+      if (table.mode === "variable") this.confirmedVariableTables.delete(label);
+    }
+  }
+  tableQuantityRequest(seat) {
+    if (seat?.objectType !== "table") return {};
+    if (seat.bookingMode === "variable" && !this.confirmedVariableTables.has(seat.label)) {
+      throw new Error("picker: confirm a variable table guest quantity before holding");
+    }
+    return { quantity: seat.quantity };
   }
   // ---- booking machine ------------------------------------------------------
   /**
@@ -5389,7 +7057,7 @@ var PickerController = class {
   async hold(labelsArg, ttlMs) {
     const r = this.renderer;
     if (!r) return null;
-    const labels = labelsArg ?? r.getSelection().map((s) => s.label);
+    const labels = labelsArg ?? this.getSelection().map((seat) => seat.label);
     const existingGA = (this.hold_?.items ?? []).filter((item) => item.objectType === "ga");
     const combinedLabels = [.../* @__PURE__ */ new Set([...existingGA.map((item) => item.label), ...labels])];
     if (!combinedLabels.length) return null;
@@ -5397,10 +7065,14 @@ var PickerController = class {
     try {
       const selections = combinedLabels.map((label) => {
         const ga = existingGA.find((item) => item.label === label);
-        if (ga) return { label, tierId: ga.tierId };
+        if (ga) return { label, tierId: ga.tierId, quantity: ga.quantity };
         const seat = this.labelToSeat.get(label);
         const resolved = seat ? this.toSeat(seat) : null;
-        return { label, ...resolved?.tierId ? { tierId: resolved.tierId } : {} };
+        return {
+          label,
+          ...resolved?.tierId ? { tierId: resolved.tierId } : {},
+          ...this.tableQuantityRequest(resolved)
+        };
       });
       const result = await this.api.hold(this.key, selections, ttlMs, this.hold_?.holdId);
       this.setHold({ holdId: result.holdId, labels: combinedLabels, expiresAt: result.expiresAt, items: result.items });
@@ -5452,11 +7124,19 @@ var PickerController = class {
     const out = {};
     const closedMembers = this.closedMemberIds();
     for (const [id, s] of this.seatById) {
+      if (this.groupedTableBySeatId.has(id)) continue;
       if (closedMembers.has(id)) continue;
       if ((this.getStatus(id) ?? "free") === "free") {
         out[s.categoryKey] = (out[s.categoryKey] ?? 0) + 1;
       }
     }
+    for (const table of this.groupedTablesByLabel.values()) {
+      if (table.chairs.some((chair) => closedMembers.has(chair.id))) continue;
+      const representative = table.chairs[0];
+      if (representative && (this.getStatus(representative.id) ?? "free") === "free") {
+        out[table.categoryKey] = (out[table.categoryKey] ?? 0) + table.maxOccupancy;
+      }
+    }
     return out;
   }
   /** Seat ids belonging to a currently-closed section (excluded from counts). */
@@ -5475,6 +7155,8 @@ var PickerController = class {
       return {
         id: area.id,
         label: area.label,
+        ...area.displayLabel ? { displayLabel: area.displayLabel } : {},
+        ...area.displayType ? { displayType: area.displayType } : {},
         capacity: Math.max(0, Math.floor(area.capacity)),
         available: gaUnitLabels(area).filter((label) => (this.liveStatuses.get(label) ?? "free") === "free").length,
         categoryKey: area.categoryKey,
@@ -5493,14 +7175,20 @@ var PickerController = class {
     const labels = gaUnitLabels(area).filter((label) => !this.hold_?.labels.includes(label) && (this.liveStatuses.get(label) ?? "free") === "free").slice(0, Math.floor(qty));
     if (labels.length !== Math.floor(qty)) return null;
     const selections = /* @__PURE__ */ new Map();
-    for (const item of this.hold_?.items ?? []) selections.set(item.label, { label: item.label, tierId: item.tierId });
+    for (const item of this.hold_?.items ?? []) selections.set(item.label, {
+      label: item.label,
+      tierId: item.tierId,
+      quantity: item.quantity
+    });
     if (this.hold_ && !this.hold_?.items?.length) {
       for (const seat of this.hold_.seats) selections.set(seat.label, { label: seat.label, ...seat.tierId ? { tierId: seat.tierId } : {} });
     }
-    for (const seat of this.renderer?.getSelection() ?? []) {
-      const resolved = this.labelToSeat.get(seat.label);
-      const chosen = resolved ? this.toSeat(resolved) : null;
-      selections.set(seat.label, { label: seat.label, ...chosen?.tierId ? { tierId: chosen.tierId } : {} });
+    for (const seat of this.getSelection()) {
+      selections.set(seat.label, {
+        label: seat.label,
+        ...seat.tierId ? { tierId: seat.tierId } : {},
+        ...this.tableQuantityRequest(seat)
+      });
     }
     for (const label of labels) selections.set(label, { label, ...options.tierId ? { tierId: options.tierId } : {} });
     const combined = [...selections.values()];
@@ -5517,6 +7205,15 @@ var PickerController = class {
     }
     return false;
   }
+  /** Zones which still own visible buyer inventory, in authored order. */
+  getBestAvailableZones() {
+    const doc = this.visibleDoc();
+    if (!doc?.zones?.length) return [];
+    const used = new Set(
+      computeSections(doc).sections.filter((section) => section.seatCount > 0 && !!section.zone).map((section) => section.zone)
+    );
+    return doc.zones.filter((zone) => used.has(zone.id)).map((zone) => ({ id: zone.id, label: zone.label }));
+  }
   /**
    * Client-side premium pre-pass: find the best contiguous block of `qty`
    * PREMIUM-flagged free seats (orphan-avoiding, closest to the focal point)
@@ -5525,11 +7222,12 @@ var PickerController = class {
    * seat status. Returns a FULL premium block of `qty`, or null when none
    * exists (the caller then falls back to the normal server pick).
    */
-  pickPremiumBlock(qty, categoryKey) {
+  pickPremiumBlock(qty, categoryKey, zoneId) {
     const doc = this.visibleDoc();
     if (!doc?.objects?.length) return null;
     const focal = doc.focalPoint ?? { x: 0, y: 0 };
-    const seats = expandChart(doc);
+    const groupedObjectIds = new Set(this.groupedTablesByObject.keys());
+    const seats = expandChart(doc).filter((seat) => !groupedObjectIds.has(seat.rowId));
     const held = new Set(this.hold_?.labels ?? []);
     const available = /* @__PURE__ */ new Set();
     for (const seat of seats) {
@@ -5538,7 +7236,7 @@ var PickerController = class {
       const status = id ? this.getStatus(id) : void 0;
       if ((status ?? "free") === "free") available.add(seat.label);
     }
-    const pick = pickBestAvailable(seats, available, { qty, categoryKey, focal, preferPremium: true });
+    const pick = pickBestAvailable(seats, available, { qty, categoryKey, zoneId, focal, preferPremium: true });
     if (pick.labels.length !== qty) return null;
     const allPremium = pick.labels.every((l) => this.labelToSeat.get(l)?.commercial?.premium);
     return allPremium ? [...pick.labels] : null;
@@ -5553,7 +7251,7 @@ var PickerController = class {
     const r = this.renderer;
     if (!r) return null;
     if (opts.preferPremium) {
-      const block = this.pickPremiumBlock(qty, categoryKey);
+      const block = this.pickPremiumBlock(qty, categoryKey, opts.zoneId);
       if (block) {
         if (this.hold_ && !await this.release()) return null;
         try {
@@ -5564,7 +7262,7 @@ var PickerController = class {
           });
           const result = await this.api.hold(this.key, selection);
           r.clearSelection();
-          const ids = block.map((l) => this.labelToId.get(l)).filter((v) => !!v);
+          const ids = this.idsForLabels(block);
           if (ids.length) r.setStatus(ids, "held");
           this.setHold({ holdId: result.holdId, labels: [...block], expiresAt: result.expiresAt, items: result.items });
           const seats = block.map((l) => this.labelToSeat.get(l)).filter((s) => !!s).map((s) => this.toSeat(s));
@@ -5581,9 +7279,9 @@ var PickerController = class {
     }
     if (this.hold_ && !await this.release()) return null;
     try {
-      const result = await this.api.bestAvailable(this.key, qty, categoryKey);
+      const result = await this.api.bestAvailable(this.key, qty, categoryKey, opts.zoneId);
       r.clearSelection();
-      const ids = result.labels.map((l) => this.labelToId.get(l)).filter((v) => !!v);
+      const ids = this.idsForLabels(result.labels);
       if (ids.length) r.setStatus(ids, "held");
       this.setHold({ holdId: result.holdId, labels: [...result.labels], expiresAt: result.expiresAt, items: result.items });
       const seats = result.labels.map((l) => this.labelToSeat.get(l)).filter((s) => !!s).map((s) => this.toSeat(s));
@@ -5607,7 +7305,7 @@ var PickerController = class {
     const r = this.renderer;
     if (!r) return null;
     if (!this.api.book) throw new Error("picker: transport has no book() \u2014 hold-only mode");
-    const labels = labelsArg ?? r.getSelection().map((s) => s.label);
+    const labels = labelsArg ?? this.getSelection().map((seat) => seat.label);
     if (!labels.length) return null;
     let holdId;
     try {
@@ -5620,7 +7318,11 @@ var PickerController = class {
           labels.map((label) => {
             const seat = this.labelToSeat.get(label);
             const resolved = seat ? this.toSeat(seat) : null;
-            return { label, ...resolved?.tierId ? { tierId: resolved.tierId } : {} };
+            return {
+              label,
+              ...resolved?.tierId ? { tierId: resolved.tierId } : {},
+              ...this.tableQuantityRequest(resolved)
+            };
           }),
           void 0,
           replaceHoldId
@@ -5636,10 +7338,11 @@ var PickerController = class {
         this.opts.onSalesClosed?.();
       } else if (status === 409 && conflicts?.length) {
         const takenLabels = new Set(conflicts.map((c) => c.label));
-        const takenIds = [...takenLabels].map((l) => this.labelToId.get(l)).filter((v) => !!v);
+        const takenIds = this.idsForLabels(takenLabels);
         if (takenIds.length) {
           r.setStatus(takenIds, "booked");
           r.deselect(takenIds);
+          this.resetTableQuantitiesForLabels(takenLabels);
         }
         const stillFree = labels.filter((l) => !takenLabels.has(l));
         if (stillFree.length && holdId) void this.api.release(this.key, stillFree, holdId).catch(() => {
@@ -5651,12 +7354,13 @@ var PickerController = class {
       }
       throw err;
     }
-    const ids = labels.map((l) => this.labelToId.get(l)).filter((v) => !!v);
+    const ids = this.idsForLabels(labels);
     if (ids.length) {
       r.setStatus(ids, "booked");
       r.deselect(ids);
     }
     this.clearHold();
+    this.resetTableQuantitiesForLabels(labels);
     this.emitSelectionChange();
     this.opts.onBook?.(bookingRef);
     return labels;
@@ -5677,7 +7381,8 @@ var PickerController = class {
     }
     if (this.hold_?.holdId !== hold.holdId) return true;
     this.clearHold();
-    const ids = hold.labels.map((l) => this.labelToId.get(l)).filter((v) => !!v);
+    this.resetTableQuantitiesForLabels(hold.labels);
+    const ids = this.idsForLabels(hold.labels);
     if (ids.length) {
       this.renderer?.deselect(ids);
       this.renderer?.setStatus(ids, "free");
@@ -5708,7 +7413,8 @@ var PickerController = class {
     const remainingItems = hold.items?.filter((item) => !drop.includes(item.label));
     if (remaining.length) this.setHold({ ...hold, labels: remaining, items: remainingItems });
     else this.clearHold();
-    const ids = drop.map((l) => this.labelToId.get(l)).filter((v) => !!v);
+    this.resetTableQuantitiesForLabels(drop);
+    const ids = this.idsForLabels(drop);
     if (ids.length) {
       this.renderer?.deselect(ids);
       this.renderer?.setStatus(ids, "free");
@@ -5797,7 +7503,7 @@ var PickerController = class {
     this.opts.onDeckTap?.(floorId);
   }
   // ---- big-venue: sections / rungs / projection (Slice 5) -------------------
-  /** Switch the map projection (2D flat ⇄ 3D isometric). No-op on a flat renderer. */
+  /** Switch the map projection. No-op on a flat-only renderer. */
   setViewMode(mode) {
     this.renderer?.setViewMode?.(mode);
   }
@@ -5896,12 +7602,21 @@ var PickerController = class {
     if (!sec) return null;
     const memberIds = r.sectionMembers?.(id) ?? [];
     const byCat = /* @__PURE__ */ new Map();
+    const seenTables = /* @__PURE__ */ new Set();
     let seatsLeft = 0;
     for (const sid of memberIds) {
       const seat = this.seatById.get(sid);
       if (!seat) continue;
-      byCat.set(seat.categoryKey, (byCat.get(seat.categoryKey) ?? 0) + 1);
-      if (r.getStatus(sid) === "free") seatsLeft++;
+      const table = this.groupedTableBySeatId.get(sid);
+      if (table) {
+        if (seenTables.has(table.label)) continue;
+        seenTables.add(table.label);
+        byCat.set(table.categoryKey, (byCat.get(table.categoryKey) ?? 0) + table.maxOccupancy);
+        if (r.getStatus(table.chairs[0]?.id ?? sid) === "free") seatsLeft += table.maxOccupancy;
+      } else {
+        byCat.set(seat.categoryKey, (byCat.get(seat.categoryKey) ?? 0) + 1);
+        if (r.getStatus(sid) === "free") seatsLeft++;
+      }
     }
     const categories = [...byCat.entries()].map(([key, count]) => {
       const cat = doc.categories.find((c) => c.key === key);
@@ -5951,22 +7666,54 @@ var PickerController = class {
   }
   // ---- internals ------------------------------------------------------------
   toSeat(s) {
+    const table = this.groupedTableBySeatId.get(s.id);
+    if (table) return this.toTableSeat(table);
     const commercial = s.commercial ? { commercial: s.commercial } : void 0;
     const display = s.displayLabel ? { displayLabel: s.displayLabel } : void 0;
+    const accessibility = s.accessibility?.length ? { accessibility: s.accessibility } : void 0;
+    const wheelchair = s.wheelchairSpaceType ? { wheelchairSpaceType: s.wheelchairSpaceType } : void 0;
+    const context = this.seatContext.get(s.id);
     const tiers = this.tiersFor(s.categoryKey);
     if (!tiers) {
-      return { id: s.id, label: s.label, ...display, categoryKey: s.categoryKey, price: this.priceFor(s.categoryKey), ...commercial };
+      return { id: s.id, label: s.label, ...display, ...context, categoryKey: s.categoryKey, price: this.priceFor(s.categoryKey), ...commercial, ...accessibility, ...wheelchair };
     }
     const chosen = tiers.find((t2) => t2.id === this.seatTiers.get(s.id)) ?? tiers[0];
     return {
       id: s.id,
       label: s.label,
       ...display,
+      ...context,
       categoryKey: s.categoryKey,
       price: chosen.price,
       tiers,
       tierId: chosen.id,
-      ...commercial
+      ...commercial,
+      ...accessibility,
+      ...wheelchair
+    };
+  }
+  toTableSeat(table) {
+    const representative = table.chairs[0];
+    const tiers = this.tiersFor(table.categoryKey);
+    const chosen = tiers?.find((tier) => tier.id === this.seatTiers.get(representative?.id ?? "")) ?? tiers?.[0];
+    return {
+      id: representative?.id ?? table.objectId,
+      label: table.label,
+      displayLabel: table.displayLabel ?? table.label,
+      ...table.displayType ? { displayType: table.displayType, rowType: table.displayType } : {},
+      objectId: table.objectId,
+      sectionLabel: representative ? this.seatContext.get(representative.id)?.sectionLabel : void 0,
+      rowLabel: table.displayLabel ?? table.label,
+      categoryKey: table.categoryKey,
+      price: chosen?.price ?? this.priceFor(table.categoryKey),
+      ...tiers ? { tiers, tierId: chosen?.id } : {},
+      objectType: "table",
+      bookingMode: table.mode,
+      quantity: this.tableQuantities.get(table.label) ?? (table.mode === "whole" ? table.capacity : table.minOccupancy),
+      capacity: table.capacity,
+      minOccupancy: table.minOccupancy,
+      maxOccupancy: table.maxOccupancy,
+      physicalSeatIds: table.chairs.map((chair) => chair.id)
     };
   }
   /** Tooltip payload for a hovered seat — see PickerCallbacks.onSeatHover. */
@@ -6050,10 +7797,13 @@ var PickerController = class {
     const h = this.hold_;
     if (!h || h.labels.length !== labels.length || !labels.every((l) => h.labels.includes(l))) return false;
     const tiers = new Map((h.items ?? []).map((item) => [item.label, item.tierId]));
+    const quantities = new Map((h.items ?? []).map((item) => [item.label, item.quantity ?? 1]));
     return labels.every((label) => {
       const seat = this.labelToSeat.get(label);
-      const currentTier = seat ? this.toSeat(seat).tierId ?? null : null;
-      return !tiers.has(label) || tiers.get(label) === currentTier;
+      const resolved = seat ? this.toSeat(seat) : null;
+      const currentTier = resolved?.tierId ?? null;
+      const quantityMatches = resolved?.objectType !== "table" || (resolved.bookingMode !== "variable" || this.confirmedVariableTables.has(label)) && (!quantities.has(label) || quantities.get(label) === resolved.quantity);
+      return quantityMatches && (!tiers.has(label) || tiers.get(label) === currentTier);
     });
   }
   handle409Conflicts(err) {
@@ -6061,19 +7811,28 @@ var PickerController = class {
     if (status !== 409 || !conflicts?.length) return;
     const r = this.renderer;
     if (!r) return;
-    const takenIds = conflicts.map((c) => this.labelToId.get(c.label)).filter((v) => !!v);
+    const takenIds = this.idsForLabels(conflicts.map((conflict) => conflict.label));
     if (takenIds.length) {
       r.deselect(takenIds);
       r.setStatus(takenIds, "held");
+      this.resetTableQuantitiesForLabels(conflicts.map((conflict) => conflict.label));
     }
     this.emitSelectionChange();
   }
   /** Set the open hold + (re)arm the server-authoritative expiry timer. */
   setHold(hold, source = "created") {
+    for (const item of hold.items ?? []) {
+      if (this.groupedTablesByLabel.has(item.label) && item.quantity != null) {
+        this.tableQuantities.set(item.label, item.quantity);
+        if (this.groupedTablesByLabel.get(item.label)?.mode === "variable") {
+          this.confirmedVariableTables.add(item.label);
+        }
+      }
+    }
     const full = { ...hold, seats: this.seatsForLabels(hold.labels) };
     this.hold_ = full;
     this.renderer?.setOwnedHold?.(
-      full.labels.map((label) => this.labelToId.get(label)).filter((id) => !!id)
+      this.idsForLabels(full.labels)
     );
     if (this.expiryTimer) clearTimeout(this.expiryTimer);
     const ms = Math.max(0, full.expiresAt - Date.now());
@@ -6116,12 +7875,11 @@ var PickerController = class {
     this.liveStatuses = new Map(Object.entries(seats));
     if (this.allIds.length) r.setStatus(this.allIds, "free");
     r.setOwnedHold?.(
-      (this.hold_?.labels ?? []).map((label) => this.labelToId.get(label)).filter((id) => !!id)
+      this.idsForLabels(this.hold_?.labels ?? [])
     );
     const byStatus = { free: [], held: [], booked: [], not_for_sale: [] };
     for (const [label, st] of Object.entries(seats)) {
-      const id = this.labelToId.get(label);
-      if (id) byStatus[mapStatus(st)].push(id);
+      byStatus[mapStatus(st)].push(...this.idsForLabel(label));
     }
     ["held", "booked", "not_for_sale"].forEach((st) => {
       if (byStatus[st].length) r.setStatus(byStatus[st], st);
@@ -6130,7 +7888,11 @@ var PickerController = class {
     this.clearBookedHoldIfSettled();
   }
   clearBookedHoldIfSettled() {
-    if (this.hold_?.labels.every((label) => this.liveStatuses.get(label) === "booked")) this.clearHold();
+    const hold = this.hold_;
+    if (hold?.labels.every((label) => this.liveStatuses.get(label) === "booked")) {
+      this.clearHold();
+      this.resetTableQuantitiesForLabels(hold.labels);
+    }
   }
   async resnapshot() {
     try {
@@ -6219,13 +7981,13 @@ var PickerController = class {
       } else if (Array.isArray(m.changes)) {
         for (const ch of m.changes) {
           this.liveStatuses.set(ch.label, ch.status);
-          const id = this.labelToId.get(ch.label);
-          if (!id) continue;
+          const ids = this.idsForLabel(ch.label);
+          if (!ids.length) continue;
           const next = mapStatus(ch.status);
-          if (this.opts.flashOnLiveChange && next !== "free" && r.getStatus(id) === "free" && !this.hold_?.labels.includes(ch.label)) {
-            r.flashSeat(id, next === "held" ? "#f4b740" : "#f43f5e");
+          if (this.opts.flashOnLiveChange && next !== "free" && ids.some((id) => r.getStatus(id) === "free") && !this.hold_?.labels.includes(ch.label)) {
+            ids.forEach((id) => r.flashSeat(id, next === "held" ? "#f4b740" : "#f43f5e"));
           }
-          r.setStatus([id], next);
+          r.setStatus(ids, next);
         }
         if (this.opts.keepLiveWhileHidden && typeof document !== "undefined" && document.visibilityState === "hidden") {
           r.forceDraw();
@@ -6256,10 +8018,25 @@ var PickerController = class {
   }
 };
 
+// src/view/sightline.ts
+var STAGE_TOP_M = 5;
+var STAGE_BASE_M = -1.1;
+var MAX_LOOKDOWN_DEG = 35;
+function stageSightlinePitch(eyeHeightM, distM) {
+  const extraEyeM = eyeHeightM - SEATED_EYE_HEIGHT_M;
+  let topPitch = Math.atan2(STAGE_TOP_M - extraEyeM, distM) * 180 / Math.PI;
+  let basePitch = Math.atan2(STAGE_BASE_M - extraEyeM, distM) * 180 / Math.PI;
+  if (basePitch < -MAX_LOOKDOWN_DEG) {
+    topPitch += -MAX_LOOKDOWN_DEG - basePitch;
+    basePitch = -MAX_LOOKDOWN_DEG;
+  }
+  return { topPitch, basePitch };
+}
+
 // src/view/generatePanorama.ts
 var W = 2048;
 var H = 1024;
-var UNIT = 0.55 / 24;
+var UNIT = METRES_PER_CHART_UNIT;
 var yawToX = (yawDeg) => (yawDeg + 180) / 360 * W;
 var pitchToY = (pitchDeg) => (90 - pitchDeg) / 180 * H;
 function generateSeatPanorama(seat, focalPoint, neighborSeats) {
@@ -6279,9 +8056,11 @@ function generateSeatPanorama(seat, focalPoint, neighborSeats) {
   sky.addColorStop(1, "#07090f");
   ctx.fillStyle = sky;
   ctx.fillRect(0, 0, W, H);
+  const eyeM = seat.eyeHeightM ?? SEATED_EYE_HEIGHT_M;
   const stageHalfYaw = Math.min(80, Math.atan2(4, distM) * 180 / Math.PI);
-  const stageTopPitch = Math.min(45, Math.atan2(5, distM) * 180 / Math.PI);
-  const stageBasePitch = Math.max(-30, -Math.atan2(1.1, distM) * 180 / Math.PI);
+  const sightline = stageSightlinePitch(eyeM, distM);
+  const stageTopPitch = Math.min(45, sightline.topPitch);
+  const stageBasePitch = sightline.basePitch;
   const sx0 = yawToX(-stageHalfYaw);
   const sx1 = yawToX(stageHalfYaw);
   const sy0 = pitchToY(stageTopPitch);
@@ -6388,9 +8167,11 @@ function generateSeatThumb(seat, focalPoint, _neighborSeats) {
   sky.addColorStop(1, "#070910");
   ctx.fillStyle = sky;
   ctx.fillRect(0, 0, TW, TH);
+  const eyeM = seat.eyeHeightM ?? SEATED_EYE_HEIGHT_M;
+  const sightline = stageSightlinePitch(eyeM, distM);
   const stageHalfYaw = Math.min(HALF_HFOV - 2, Math.atan2(4, distM) * 180 / Math.PI);
-  const stageTopPitch = Math.min(HALF_VFOV - 2, Math.atan2(5, distM) * 180 / Math.PI);
-  const stageBasePitch = Math.max(-HALF_VFOV + 2, -Math.atan2(1.1, distM) * 180 / Math.PI);
+  const stageTopPitch = Math.min(HALF_VFOV - 2, sightline.topPitch);
+  const stageBasePitch = Math.max(-HALF_VFOV + 2, sightline.basePitch);
   const sx0 = yawToTX(-stageHalfYaw);
   const sx1 = yawToTX(stageHalfYaw);
   const sy0 = pitchToTY(stageTopPitch);
@@ -6487,7 +8268,9 @@ export {
   PickerController,
   RENDERED_QUALITY_REPORT_VERSION,
   SUPPORTED_LOCALES,
+  SURROUNDINGS_SHAPE_ROLES,
   SeatmapRenderer,
+  TIER_HEIGHT_M,
   UNGROUPED_ID,
   accessibilityMeta,
   accessibilityRingColor,
@@ -6502,16 +8285,19 @@ export {
   expandRow,
   expandRowSlots,
   expandTable,
+  expandTableSlots,
   floorObjects,
   floorsOf,
   formatDate,
   formatMoney,
   gaAreasOf,
+  gaInventorySegments,
   gaUnitLabel,
   gaUnitLabels,
   generateSeatPanorama,
   generateSeatThumb,
   getLocale,
+  growJoinedGAInventory,
   hiddenObjectIds,
   inspectRenderedQualityEvidence,
   isGaUnitLabel,
@@ -6519,17 +8305,23 @@ export {
   layerOf,
   loadLocale,
   objectCenter,
+  owningSectionForObject,
   pointInPolygon,
   pointInPolygonWithHoles,
   polygonLabelPoint,
   resolveLocale,
+  rowInventoryCount,
   rowSeatPositions,
   seatLabelPart,
+  sectionGeometry,
   setLocale,
   setMoneyLocale,
   setStringOverrides,
   stackFloors,
   t,
-  tCount
+  tCount,
+  tableInventoryCount,
+  tableSeatCountsBySide,
+  validGAInventorySegments
 };
 //# sourceMappingURL=index.js.map