@seatlayer/js 0.50.2 → 0.51.0

package/dist/index.js

@@ -2248,6 +2248,10 @@ var DEFAULT_MAX_SELECTION2 = 10;
 var EXTEND_PROMPT_MS = 6e4;
 var MAX_3D_SEATS_DEFAULT = 6e4;
 var MAX_3D_SECTION_PILLS = 12;
+function tfStatic(key, fallback) {
+  const v = t2(key);
+  return v === key ? fallback : v;
+}
 function pointInPolygon(x, y, poly) {
   let inside = false;
   for (let i = 0, j = poly.length - 1; i < poly.length; j = i++) {
@@ -2422,11 +2426,30 @@ var CSS = (
 .sl-picker[data-layout="narrow"] .sl-map{min-height:0;flex:1}
 .sl-picker[data-layout="narrow"] .sl-side{width:100%;border-left:0;border-top:1px solid var(--sl-line);
   flex:none;height:min(72%,480px);overflow:hidden;transition:height .3s cubic-bezier(.2,.8,.2,1);overscroll-behavior:contain}
-.sl-picker[data-layout="narrow"][data-sheet="open"][data-has-selection="false"] .sl-side{height:min(252px,52%)}
+.sl-picker[data-layout="narrow"][data-sheet="open"][data-has-selection="false"] .sl-side{height:min(380px,64%)}
+/* With the price list expanded the sheet takes the with-selection height so
+   the tray (cart + best-seats) is never crushed under the fixed-size list. */
+.sl-picker[data-layout="narrow"][data-sheet="open"][data-prices-open="true"] .sl-side{height:min(480px,74%)}
 .sl-picker[data-layout="narrow"][data-sheet="peek"] .sl-side{height:76px;overflow:hidden}
 .sl-picker[data-layout="narrow"][data-sheet="peek"] .sl-side > :not(.sl-sheet-head){display:none}
-.sl-picker[data-layout="narrow"] .sl-tray{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
+.sl-picker[data-layout="narrow"] .sl-tray{flex:1;min-height:96px;overflow-y:auto;overscroll-behavior:contain}
+.sl-picker[data-layout="narrow"][data-prices-open="true"] .sl-tray{min-height:48px}
+.sl-picker[data-layout="narrow"] .sl-prices{max-height:150px;overflow-y:auto;overscroll-behavior:contain}
 .sl-picker[data-layout="narrow"] .sl-foot{position:static;background:var(--sl-bg)}
+/* NARROW FOOT SAYS EVERYTHING ONCE (owner report: with a hold the footer ate
+   ~190px and the ticket list got a sliver). The sheet head already carries
+   "N tickets \xB7 $total" and the header pill already ticks the clock \u2014 so the
+   total row hides, the secured note collapses to one compact line, and the
+   badge tucks in. The tray gets the pixels; a thin scrollbar shows there is
+   more to scroll. */
+.sl-picker[data-layout="narrow"] .sl-total{display:none}
+.sl-picker[data-layout="narrow"] .sl-foot{padding:8px 12px 8px}
+.sl-picker[data-layout="narrow"] .sl-hold-note{margin-bottom:6px;padding:5px 9px}
+.sl-picker[data-layout="narrow"] .sl-hold-note svg{display:none}
+.sl-picker[data-layout="narrow"] .sl-hold-note b{display:inline;margin-right:6px;font-size:11px}
+.sl-picker[data-layout="narrow"] .sl-hold-copy{display:inline;white-space:normal;font-size:10.5px}
+.sl-picker[data-layout="narrow"] .sl-powered{margin-top:4px;padding:2px 8px;font-size:11px}
+.sl-picker[data-layout="narrow"] .sl-tray{scrollbar-width:thin}
 .sl-picker[data-layout="narrow"] .sl-foot.empty{display:none}
 .sl-picker[data-layout="narrow"] .sl-sheet-head{order:0}
 .sl-picker[data-layout="narrow"] .sl-seats-sec{display:none}
@@ -2434,6 +2457,7 @@ var CSS = (
 .sl-picker[data-layout="narrow"] .sl-filtersec{order:3}
 .sl-picker[data-layout="narrow"] .sl-filters{order:4}
 .sl-picker[data-layout="narrow"] .sl-prices-sec{order:5}
+.sl-picker[data-layout="narrow"] .sl-prices-hint{order:6}
 .sl-picker[data-layout="narrow"] .sl-pricef{order:6}
 .sl-picker[data-layout="narrow"] .sl-prices{order:7}
 .sl-picker[data-layout="narrow"] .sl-foot{order:8}
@@ -2441,6 +2465,7 @@ var CSS = (
 .sl-picker[data-layout="narrow"] .sl-filtersec,
 .sl-picker[data-layout="narrow"] .sl-filters,
 .sl-picker[data-layout="narrow"] .sl-prices-sec,
+.sl-picker[data-layout="narrow"] .sl-prices-hint,
 .sl-picker[data-layout="narrow"] .sl-prices{display:none!important}
 .sl-picker[data-layout="narrow"][data-has-selection="true"] .sl-filtersec,
 .sl-picker[data-layout="narrow"][data-has-selection="true"] .sl-filters,
@@ -2458,7 +2483,13 @@ var CSS = (
    head is the tap/swipe toggle target (min 44px), so it reads as one control. */
 .sl-sheet-head{display:none;flex-direction:column;justify-content:center;padding:6px 12px 8px;min-height:56px;
   cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;flex:none}
-.sl-picker[data-layout="narrow"] .sl-sheet-head{display:flex;min-height:64px;padding:4px 10px 6px}
+.sl-picker[data-layout="narrow"] .sl-sheet-head{display:flex;min-height:52px;padding:3px 10px 5px}
+/* OPEN sheet: the head is context, not controls \u2014 the pill it carries at peek
+   ("Best seats"/"Continue") duplicates the card and CTA right below it, and
+   every saved pixel is tray room (owner call 2026-08-14). */
+.sl-picker[data-layout="narrow"][data-sheet="open"] .sl-sheet-head{min-height:42px}
+.sl-picker[data-layout="narrow"][data-sheet="open"] .sl-sheet-bar{min-height:32px}
+.sl-picker[data-layout="narrow"][data-sheet="open"] .sl-sheet-peek .go{display:none}
 .sl-picker[data-layout="narrow"][data-sheet="peek"] .sl-sheet-head{height:100%}
 .sl-sheet-grab{width:36px;height:4px;border-radius:999px;background:var(--sl-muted);opacity:.55;margin:1px auto 5px}
 .sl-sheet-bar{display:flex;align-items:center;gap:8px;min-height:44px}
@@ -2499,9 +2530,19 @@ var CSS = (
    sheet brings it back, exactly like the filters row above. The tray hint comes
    back with it: the first-time buyer on a phone needs the instruction more than
    the desktop buyer, not less. */
-.sl-picker[data-layout="narrow"][data-sheet="open"] .sl-prices-sec{display:flex!important}
-.sl-picker[data-layout="narrow"][data-sheet="open"] .sl-prices{display:flex!important}
+.sl-picker[data-layout="narrow"][data-sheet="open"][data-prices-open="true"] .sl-prices-sec{display:flex!important}
+/* MOBILE SPACE BELONGS TO THE CART (owner call 2026-08-14): the price list is
+   one tap away behind the "Ticket prices" row, not a permanent tenant. Zone
+   flags and section taps already answer "what does it cost" in context. */
+.sl-picker[data-layout="narrow"][data-sheet="open"][data-prices-open="true"] .sl-prices-hint{display:block!important}
+.sl-picker[data-layout="narrow"][data-sheet="open"][data-prices-open="true"] .sl-prices{display:flex!important}
 .sl-picker[data-layout="narrow"][data-sheet="open"] .sl-tray-hint{display:block!important}
+/* The row reads as the toggle it is on narrow: chevron + pointer. */
+.sl-picker[data-layout="narrow"] .sl-prices-sec{cursor:pointer}
+.sl-picker[data-layout="narrow"] .sl-prices-sec::after{content:'';width:8px;height:8px;flex:none;margin-left:auto;
+  border-right:2px solid var(--sl-muted);border-bottom:2px solid var(--sl-muted);
+  transform:rotate(45deg);transition:transform .2s cubic-bezier(.2,.8,.2,1)}
+.sl-picker[data-layout="narrow"][data-prices-open="true"] .sl-prices-sec::after{transform:rotate(-135deg)}
 .sl-cbbtn{width:32px;height:32px;border-radius:999px;background:var(--sl-surface);border:1px solid var(--sl-line);
   color:var(--sl-text);display:flex;align-items:center;justify-content:center;transition:border-color .15s}
 .sl-cbbtn:hover{border-color:var(--sl-muted)}
@@ -2520,7 +2561,13 @@ var CSS = (
 .sl-sec{padding:14px 14px 4px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--sl-muted);font-weight:700}
 .sl-prices-sec{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:13px}
 .sl-price-select{min-height:32px;max-width:130px;padding:5px 28px 5px 9px;border:1px solid var(--sl-line);border-radius:9px;
-  background:var(--sl-surface);color:var(--sl-text);font:inherit;font-size:11px;font-weight:750;letter-spacing:0;text-transform:none}
+  background-color:var(--sl-surface);color:var(--sl-text);font:inherit;font-size:11px;font-weight:750;letter-spacing:0;text-transform:none}
+/* One sentence that teaches the whole colour code \u2014 a first-time buyer sees
+   "Head Tables \xB7 $165" and coloured dots with nothing connecting them. Gone
+   the moment they have seats (they've learned it) and while sales are closed. */
+.sl-prices-hint{padding:0 14px 7px;font-size:11px;line-height:1.45;color:var(--sl-muted)}
+.sl-picker[data-has-selection="true"] .sl-prices-hint,
+.sl-picker[data-sales-closed="true"] .sl-prices-hint{display:none}
 .sl-prices{display:flex;flex-direction:column;padding:4px 14px 8px;border-bottom:1px solid var(--sl-line)}
 .sl-prices-sec,.sl-prices,.sl-seats-sec{flex:none}
 .sl-price-row{display:flex;align-items:center;gap:7px;min-height:28px;font-size:12px;
@@ -2680,11 +2727,11 @@ var CSS = (
   color:var(--sl-text);font-size:17px;font-weight:700;display:flex;align-items:center;justify-content:center;transition:border-color .15s}
 .sl-zoom button:hover{border-color:var(--sl-muted)}
 .sl-zoom svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
-/* Full-screen promotion on phones: the capability existed (native + iOS overlay
-   + framed-host paths) but hid as the 4th unlabelled glyph in a corner stack.
-   On narrow layouts dockLayoutChrome moves the SAME button into the top-right
-   region beside Map|3D and this class dresses it as a labelled pill \u2014 the one
-   accelerator with the highest payoff on a small screen gets words. */
+/* Full-screen promotion: the capability existed (native + iOS overlay +
+   framed-host paths) but hid as the 4th unlabelled glyph in a corner stack \u2014
+   even the owner could not pick it out. dockLayoutChrome docks the SAME
+   button into the top-right region beside Map|3D on EVERY layout and this
+   class dresses it as a labelled pill. */
 .sl-zfs-lbl{display:none}
 .sl-fs-pill.sl-fs-pill{display:inline-flex;align-items:center;justify-content:center;width:auto;min-height:40px;height:auto;
   padding:0 13px;gap:6px;border-radius:999px;font-size:11px;font-weight:800;
@@ -2692,6 +2739,16 @@ var CSS = (
 .sl-fs-pill.sl-fs-pill:hover{border-color:var(--sl-muted)}
 .sl-fs-pill svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
 .sl-fs-pill .sl-zfs-lbl{display:inline;letter-spacing:.02em;white-space:nowrap}
+/* In the header, icons carry it (owner call): square Full screen glyph, and
+   on narrow a price-tag toggle that opens the sheet with the list expanded. */
+.sl-head .sl-fs-pill{min-height:34px;min-width:34px;width:34px;padding:0;flex:none}
+.sl-head .sl-fs-pill .sl-zfs-lbl{display:none}
+.sl-prices-btn{display:none;align-items:center;justify-content:center;width:34px;min-height:34px;flex:none;
+  border-radius:999px;background:var(--sl-surface);border:1px solid var(--sl-line);color:var(--sl-text);transition:border-color .15s}
+.sl-prices-btn:hover{border-color:var(--sl-muted)}
+.sl-prices-btn svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
+.sl-prices-btn[aria-pressed="true"]{background:var(--sl-accent);color:var(--sl-accent-ink);border-color:transparent}
+.sl-picker[data-layout="narrow"] .sl-prices-btn{display:inline-flex}
 
 /* toast + boot states (toast flows in the bottom-center region) */
 .sl-toast{transform:translateY(6px) scale(.98);max-width:100%;
@@ -2819,8 +2876,21 @@ var CSS = (
 .sl-confirm-add svg{width:16px;height:16px;stroke:currentColor;stroke-width:2.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
 .sl-confirm-cancel{background:color-mix(in srgb,var(--sl-line) 44%,transparent)!important;border:1px solid var(--sl-line)!important;color:var(--sl-muted)!important}
 .sl-confirm-cancel:hover{color:var(--sl-text)}
-.sl-picker[data-layout="narrow"] .sl-confirm{left:50%!important;top:auto!important;bottom:14px;width:min(342px,calc(100% - 24px));
+.sl-picker[data-layout="narrow"] .sl-confirm{left:50%!important;top:auto!important;bottom:14px;width:min(310px,calc(100% - 24px));
   transform:translateX(-50%);animation:slConfirmMobileIn .24s cubic-bezier(.2,.8,.2,1) both}
+/* Phone-size confirm card (owner call 2026-08-14): same content \u2014 identity,
+   price band, view photo, 3D link \u2014 on a tighter grid. The values stay large
+   enough to double-check against the map; buttons keep tap-size. */
+.sl-picker[data-layout="narrow"] .sl-confirm-field{padding:9px 9px 8px}
+.sl-picker[data-layout="narrow"] .sl-confirm-value{font-size:15px}
+.sl-picker[data-layout="narrow"] .sl-confirm-cat{padding:8px 10px}
+.sl-picker[data-layout="narrow"] .sl-confirm-cat-name{font-size:12.5px}
+.sl-picker[data-layout="narrow"] .sl-confirm-price{font-size:15px}
+.sl-picker[data-layout="narrow"] .sl-confirm-body{padding:9px 10px 10px}
+.sl-picker[data-layout="narrow"] .sl-confirm-thumbwrap{height:62px;margin-bottom:6px}
+.sl-picker[data-layout="narrow"] .sl-confirm-3d{margin-top:7px;padding:6px}
+.sl-picker[data-layout="narrow"] .sl-confirm-row{margin-top:8px}
+.sl-picker[data-layout="narrow"] .sl-confirm-row button{min-height:42px}
 
 /* Atomic whole/variable-table chooser. Lives inside the widget so the same
    accessible dialog works in inline, modal, desktop and 390px mobile hosts. */
@@ -2896,8 +2966,11 @@ var CSS = (
 .sl-ba-premium.on{color:var(--sl-premium-ink);background:linear-gradient(135deg,#f0cf6b,#e0b23f);border-color:transparent;
   box-shadow:0 6px 16px color-mix(in srgb,var(--sl-premium) 26%,transparent)}
 .sl-ba-premium.on .star{color:#5a4410}
-.sl-ba select{background:var(--sl-surface);color:var(--sl-text);border:1px solid var(--sl-line);border-radius:8px;
-  font:inherit;font-size:11px;padding:7px 8px;min-width:0;width:100%;max-width:none}
+.sl-ba select,.sl-price-select{appearance:none;-webkit-appearance:none;
+  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23949ca9' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
+  background-repeat:no-repeat;background-position:right 10px center}
+.sl-ba select{background-color:var(--sl-surface);color:var(--sl-text);border:1px solid var(--sl-line);border-radius:8px;
+  font:inherit;font-size:11px;padding:7px 26px 7px 8px;min-width:0;width:100%;max-width:none}
 .sl-ba-qty{display:flex;align-items:center;gap:7px;padding:3px;border:1px solid var(--sl-line);border-radius:9px;background:var(--sl-surface)}
 .sl-ba-qty button{width:25px;height:25px;border-radius:7px;background:color-mix(in srgb,var(--sl-line) 35%,transparent);border:0;
   font-size:14px;font-weight:800;display:flex;align-items:center;justify-content:center}
@@ -2927,9 +3000,23 @@ var CSS = (
 .sl-picker[data-layout="narrow"] .sl-ba-copy{display:none}
 .sl-picker[data-layout="narrow"] .sl-ba-copy .wide{display:none}
 .sl-picker[data-layout="narrow"] .sl-ba-copy .narrow{display:inline}
-.sl-picker[data-layout="narrow"] .sl-ba select{min-height:40px}
+.sl-picker[data-layout="narrow"] .sl-ba{grid-template-columns:auto minmax(0,1fr)}
+.sl-picker[data-layout="narrow"] .sl-ba select{grid-column:1/-1;min-height:38px}
 .sl-picker[data-layout="narrow"] .sl-ba-qty button{width:30px;height:30px}
-.sl-picker[data-layout="narrow"] .sl-ba-go{min-height:40px}
+/* Quantity and Go share ONE row: a full-width row holding only "\u2212 2 +" was
+   dead space, and the Find button still gets the lion's share. */
+.sl-picker[data-layout="narrow"] .sl-ba-qty{grid-column:1}
+.sl-picker[data-layout="narrow"] .sl-ba-go{grid-column:2;min-height:40px}
+/* Re-entry to best-available once the cart has seats (the card yields its
+   space to chips, but the accelerator must stay reachable) + the quiet way
+   back out of a reopened card. */
+.sl-ba-reopen{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:5px 12px;margin-top:2px;
+  border:1px dashed color-mix(in srgb,var(--sl-accent) 40%,var(--sl-line));border-radius:999px;
+  color:var(--sl-accent);font-size:11.5px;font-weight:750;transition:border-color .15s,background .15s}
+.sl-ba-reopen:hover,.sl-ba-reopen:focus-visible{background:color-mix(in srgb,var(--sl-accent) 8%,transparent)}
+.sl-ba-back{grid-column:1/-1;justify-self:start;min-height:30px;padding:3px 0;color:var(--sl-muted);
+  font-size:11px;font-weight:700;text-decoration:underline;text-underline-offset:3px;transition:color .15s}
+.sl-ba-back:hover,.sl-ba-back:focus-visible{color:var(--sl-text)}
 
 /* Sales-closed is a designed state, not a set of disables: one statement in
    the tray where the buying flow was, carrying the event's own date so the
@@ -2948,9 +3035,9 @@ var CSS = (
    (the cart chip's remove/view rail) instead get real height on narrow. */
 @media (pointer:coarse){
   .sl-zoom button,.sl-cbbtn,.sl-close,.sl-ga-qty button,.sl-ba-qty button,.sl-price-more,
-  .sl-hold-change,.sl-seccard-x,.sl-fs-pill,.sl-side-toggle{position:relative}
+  .sl-hold-change,.sl-seccard-x,.sl-fs-pill,.sl-side-toggle,.sl-ba-reopen{position:relative}
   .sl-zoom button::after,.sl-cbbtn::after,.sl-close::after,.sl-ga-qty button::after,.sl-ba-qty button::after,
-  .sl-price-more::after,.sl-hold-change::after,.sl-seccard-x::after,.sl-fs-pill::after,.sl-side-toggle::after{
+  .sl-price-more::after,.sl-hold-change::after,.sl-seccard-x::after,.sl-fs-pill::after,.sl-side-toggle::after,.sl-ba-reopen::after{
     content:'';position:absolute;top:50%;left:50%;width:max(100%,44px);height:max(100%,44px);
     transform:translate(-50%,-50%)}
   /* The chip rail stacks remove over view in ~53px \u2014 pseudo-targets would
@@ -3053,12 +3140,6 @@ var CSS = (
   border-radius:999px;font:700 11.5px/1 inherit;color:#eef1f8;background:rgba(12,18,32,.86);
   border:1px solid rgba(150,165,205,.45);backdrop-filter:blur(6px);cursor:pointer}
 .sl-view3d-nav select:focus-visible{outline:2px solid var(--sl-accent);outline-offset:2px}
-.sl-view3d-nav .sl-view3d-locator{display:grid;grid-template-columns:minmax(150px,1.25fr) minmax(110px,.8fr) minmax(105px,.7fr) auto;
-  width:min(720px,100%);overflow:visible}
-.sl-view3d-nav.is-seat-focused .sl-view3d-locator{display:none}
-.sl-view3d-locator select{width:100%;min-width:0}
-.sl-picker[data-layout="narrow"] .sl-view3d-nav .sl-view3d-locator{display:flex;width:100%;overflow-x:auto}
-.sl-picker[data-layout="narrow"] .sl-view3d-locator select{flex:0 0 155px}
 /* On phones the library owns the bottom edge for seat/panorama/overview actions.
    Keep venue navigation in a separate top rail so those control families never
    stack over one another. */
@@ -3068,9 +3149,6 @@ var CSS = (
 .sl-picker[data-layout="narrow"] .sl-view3d-nav.is-open{left:12px;top:68px;max-width:calc(100% - 24px);padding:8px;
   border:1px solid rgba(150,165,205,.35);border-radius:14px;background:rgba(8,12,22,.9);backdrop-filter:blur(10px)}
 .sl-picker[data-layout="narrow"] .sl-view3d-nav.is-open>div{display:flex}
-.sl-picker[data-layout="narrow"] .sl-view3d-nav.is-open .sl-view3d-locator{display:grid;grid-template-columns:1fr 1fr;width:100%;overflow:visible}
-.sl-picker[data-layout="narrow"] .sl-view3d-nav.is-open .sl-view3d-locator select{width:100%;min-width:0;flex:auto}
-.sl-picker[data-layout="narrow"] .sl-view3d-nav.is-open .sl-view3d-locator button{width:100%}
 /* Seat-eye is a decision state, not another venue-navigation state. Once the
    buyer arrives, clear the floor/area/locator rails and the module's duplicate
    Overview action. The picker-owned Back button becomes the one predictable
@@ -3496,6 +3574,15 @@ var SeatPicker = class _SeatPicker {
     this.baZone = "";
     /** "★ Best seats" premium quick-pick toggle — biases best-available to premium seats. */
     this.baPremium = false;
+    /**
+     * The buyer re-opened the best-seats form with seats already in the cart
+     * ("I picked one, actually find us three together"). The card normally
+     * yields this space to the ticket chips the moment anything is selected —
+     * which removed the accelerator at exactly the moment a one-handed phone
+     * buyer wants it. Cleared when the cart empties, a hold lands, or the
+     * buyer backs out.
+     */
+    this.baReopen = false;
     this.bestAvailableConfirm = false;
     this.releasingHold = false;
     /** Event sales window is closed (read-only load state / live close). */
@@ -3573,6 +3660,7 @@ var SeatPicker = class _SeatPicker {
     /** Wide-layout ticket panel collapsed (map owns the full width). */
     this.sideCollapsed = false;
     this.sideToggleEl = null;
+    this.pricesBtnEl = null;
     /** True once we've asked the host page to pin us fullscreen (framed, no native). */
     this.framedFs = false;
     /** Last height (px) posted to a host frame; dedupes redundant reports. */
@@ -3685,7 +3773,7 @@ var SeatPicker = class _SeatPicker {
         if (this.tableDialog?.physicalSeatIds.includes(seat.id)) this.dismissTableDialog();
       },
       onSelectionLimit: () => {
-        this.toast(`You can select up to ${this.maxTickets} tickets for this order.`, "warning");
+        this.toast(t2("picker.maxTicketsForOrder", { count: this.maxTickets }), "warning");
       },
       onViewChange: () => {
         this.reanchorConfirm();
@@ -3801,8 +3889,8 @@ var SeatPicker = class _SeatPicker {
     return `<span class="sl-cx-mark" role="img" aria-label="${title}" title="${title}">\u25D0</span>`;
   }
   wheelchairProvisionLabel(type) {
-    if (type === "no-seat") return "Empty wheelchair space";
-    if (type === "seat-present") return "Accessible physical seat";
+    if (type === "no-seat") return this.tf("picker.emptyWheelchairSpace", "Empty wheelchair space");
+    if (type === "seat-present") return this.tf("picker.accessiblePhysicalSeat", "Accessible physical seat");
     return "";
   }
   wheelchairConfirmHtml(type) {
@@ -3883,9 +3971,9 @@ var SeatPicker = class _SeatPicker {
     const hideEventDetails = this.eventDetailsHidden && !active;
     this.root?.setAttribute("data-event-details-hidden", String(hideEventDetails));
     this.els.zfs?.setAttribute("aria-pressed", String(active));
-    this.els.zfs?.setAttribute("title", active ? "Exit full screen" : "Full screen");
+    this.els.zfs?.setAttribute("title", active ? this.tf("picker.exitFullScreen", "Exit full screen") : this.tf("picker.fullScreen", "Full screen"));
     const zfsLabel = this.els.zfs?.querySelector(".sl-zfs-lbl");
-    if (zfsLabel) zfsLabel.textContent = active ? "Exit full screen" : "Full screen";
+    if (zfsLabel) zfsLabel.textContent = active ? this.tf("picker.exitFullScreen", "Exit full screen") : this.tf("picker.fullScreen", "Full screen");
     this.view3dEl?.querySelector(".sl-view3d-fs")?.setAttribute("aria-pressed", String(active));
   }
   /**
@@ -3950,7 +4038,7 @@ var SeatPicker = class _SeatPicker {
     frame.className = "sl-modal-frame";
     frame.setAttribute("role", "dialog");
     frame.setAttribute("aria-modal", "true");
-    frame.setAttribute("aria-label", "Seat selection");
+    frame.setAttribute("aria-label", tfStatic("picker.seatSelection", "Seat selection"));
     frame.tabIndex = -1;
     scrim.appendChild(frame);
     document.body.appendChild(scrim);
@@ -4110,7 +4198,7 @@ var SeatPicker = class _SeatPicker {
           <svg viewBox="0 0 24 24" aria-hidden="true"><rect x="5" y="11" width="14" height="9" rx="2"/><path d="M8 11V7a4 4 0 0 1 8 0v4"/></svg>
           <span data-ref="closedPillText"></span>
         </span>
-        <button type="button" class="sl-close" data-ref="close" aria-label="Close">
+        <button type="button" class="sl-close" data-ref="close" aria-label="${this.tf("picker.close", "Close")}">
           <svg viewBox="0 0 24 24"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
         </button>
       </div>
@@ -4118,17 +4206,17 @@ var SeatPicker = class _SeatPicker {
         <div class="sl-map">
           <div class="sl-map-host" data-ref="map"></div>
           <div class="sl-zoom" data-ref="zoom">
-            <button type="button" aria-label="Zoom in" title="Zoom in" data-ref="zin">+</button>
-            <button type="button" aria-label="Zoom out" title="Zoom out" data-ref="zout">\u2212</button>
-            <button type="button" aria-label="Fit to screen" title="Fit to screen" data-ref="zfit">
+            <button type="button" aria-label="${this.tf("picker.zoomIn", "Zoom in")}" title="${this.tf("picker.zoomIn", "Zoom in")}" data-ref="zin">+</button>
+            <button type="button" aria-label="${this.tf("picker.zoomOut", "Zoom out")}" title="${this.tf("picker.zoomOut", "Zoom out")}" data-ref="zout">\u2212</button>
+            <button type="button" aria-label="${this.tf("picker.fitToScreen", "Fit to screen")}" title="${this.tf("picker.fitToScreen", "Fit to screen")}" data-ref="zfit">
               <svg viewBox="0 0 24 24"><path d="M8 3H5a2 2 0 0 0-2 2v3M16 3h3a2 2 0 0 1 2 2v3M8 21H5a2 2 0 0 1-2-2v-3M16 21h3a2 2 0 0 0 2-2v-3"/></svg>
             </button>
-            <button type="button" aria-label="Full screen" title="Full screen" aria-pressed="false" data-ref="zfs">
+            <button type="button" aria-label="${this.tf("picker.fullScreen", "Full screen")}" title="${this.tf("picker.fullScreen", "Full screen")}" aria-pressed="false" data-ref="zfs">
               <svg viewBox="0 0 24 24"><path d="M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7"/></svg>
-              <span class="sl-zfs-lbl" aria-hidden="true">Full screen</span>
+              <span class="sl-zfs-lbl" aria-hidden="true">${this.tf("picker.fullScreen", "Full screen")}</span>
             </button>
           </div>
-          <div class="sl-boot" data-ref="boot"><span class="sl-boot-spin"></span>Loading seat map\u2026</div>
+          <div class="sl-boot" data-ref="boot"><span class="sl-boot-spin"></span>${this.tf("picker.loadingSeatMap", "Loading seat map\u2026")}</div>
           <div class="sl-toast" data-ref="toast" role="status" aria-live="polite"></div>
         </div>
         <div class="sl-side" data-ref="side">
@@ -4136,24 +4224,25 @@ var SeatPicker = class _SeatPicker {
             <div class="sl-sheet-grab"></div>
             <div class="sl-sheet-bar">
               <div class="sl-sheet-peek" data-ref="peek"></div>
-              <button type="button" class="sl-sheet-toggle" data-ref="sheetToggle" aria-label="Open ticket panel" aria-expanded="false">
+              <button type="button" class="sl-sheet-toggle" data-ref="sheetToggle" aria-label="${this.tf("picker.openTicketPanel", "Open ticket panel")}" aria-expanded="false">
                 <svg viewBox="0 0 24 24"><path d="M6 15l6-6 6 6"/></svg>
               </button>
             </div>
           </div>
-          <div class="sl-sec sl-filtersec" data-ref="filtersSec">Filters</div>
+          <div class="sl-sec sl-filtersec" data-ref="filtersSec">${this.tf("picker.filters", "Filters")}</div>
           <div class="sl-filters" data-ref="filters"></div>
           <div class="sl-offer" data-ref="offer" role="status" aria-live="polite"></div>
-          <div class="sl-sec sl-prices-sec" data-ref="pricesSec"><span>Ticket prices</span></div>
+          <div class="sl-sec sl-prices-sec" data-ref="pricesSec"><span>${this.tf("picker.ticketPrices", "Ticket prices")}</span></div>
+          <div class="sl-prices-hint" data-ref="pricesHint"></div>
           <div class="sl-prices" data-ref="prices"></div>
-          <div class="sl-live" data-ref="live" role="status" aria-live="polite"><span class="dot" aria-hidden="true"></span><span data-ref="liveText">Live availability \u2014 seats update in real time</span></div>
-          <div class="sl-sec sl-seats-sec"><span>Your seats</span><span class="sl-seat-summary" data-ref="seatSummary"></span></div>
+          <div class="sl-live" data-ref="live" role="status" aria-live="polite"><span class="dot" aria-hidden="true"></span><span data-ref="liveText">${this.tf("picker.liveAvailability", "Live availability \u2014 seats update in real time")}</span></div>
+          <div class="sl-sec sl-seats-sec"><span>${this.tf("picker.yourSeats", "Your seats")}</span><span class="sl-seat-summary" data-ref="seatSummary"></span></div>
           <div class="sl-tray" data-ref="tray"></div>
           <div class="sl-foot" data-ref="foot">
             <div class="sl-hold-note" data-ref="holdNote" role="status" aria-live="polite">
               <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
-              <span><b data-ref="holdTitle">Seats secured</b><span class="sl-hold-copy" data-ref="holdCopy">You won\u2019t be charged yet.</span></span>
-              <button type="button" class="sl-hold-change" data-ref="holdChange" aria-label="Release held tickets and choose different seats">Change</button>
+              <span><b data-ref="holdTitle">${this.tf("picker.seatsSecured", "Seats secured")}</b><span class="sl-hold-copy" data-ref="holdCopy">${this.tf("picker.notChargedYet", "You won\u2019t be charged yet.")}</span></span>
+              <button type="button" class="sl-hold-change" data-ref="holdChange" aria-label="${this.tf("picker.releaseHeldTickets", "Release held tickets and choose different seats")}">${this.tf("picker.change", "Change")}</button>
             </div>
             <div class="sl-total"><span data-ref="count"></span><b data-ref="total"></b></div>
             <button type="button" class="sl-cta" data-ref="cta" disabled></button>
@@ -4204,7 +4293,7 @@ var SeatPicker = class _SeatPicker {
       const setSheet = (open) => {
         root.dataset.sheet = open ? "open" : "peek";
         toggle?.setAttribute("aria-expanded", String(open));
-        toggle?.setAttribute("aria-label", open ? "Collapse ticket panel" : "Open ticket panel");
+        toggle?.setAttribute("aria-label", open ? this.tf("picker.collapseTicketPanel", "Collapse ticket panel") : this.tf("picker.openTicketPanel", "Open ticket panel"));
       };
       setSheet(root.dataset.sheet === "open");
       toggle?.addEventListener("click", (e) => {
@@ -4250,6 +4339,39 @@ var SeatPicker = class _SeatPicker {
         head.releasePointerCapture?.(e.pointerId);
       });
     }
+    const togglePrices = () => {
+      if (this.root?.dataset.layout !== "narrow") return;
+      const open = this.root.getAttribute("data-prices-open") === "true";
+      this.root.setAttribute("data-prices-open", String(!open));
+      this.els.pricesSec?.setAttribute("aria-expanded", String(!open));
+      this.pricesBtnEl?.setAttribute("aria-pressed", String(!open));
+      if (!open && this.root.dataset.sheet !== "open") {
+        this.root.dataset.sheet = "open";
+        const sheetToggle = this.els.sheetToggle;
+        sheetToggle?.setAttribute("aria-expanded", "true");
+        sheetToggle?.setAttribute("aria-label", "Collapse ticket panel");
+      }
+    };
+    this.els.pricesSec?.addEventListener("click", (e) => {
+      if (e.target.closest("select,button")) return;
+      togglePrices();
+    });
+    this.els.pricesSec?.addEventListener("keydown", (e) => {
+      if (e.key !== "Enter" && e.key !== " ") return;
+      if (e.target.closest("select,button")) return;
+      e.preventDefault();
+      togglePrices();
+    });
+    const pricesBtn = document.createElement("button");
+    pricesBtn.type = "button";
+    pricesBtn.className = "sl-prices-btn";
+    pricesBtn.setAttribute("aria-label", this.tf("picker.ticketPrices", "Ticket prices"));
+    pricesBtn.setAttribute("title", this.tf("picker.ticketPrices", "Ticket prices"));
+    pricesBtn.setAttribute("aria-pressed", "false");
+    pricesBtn.innerHTML = '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M20.6 13.4 13.4 20.6a2 2 0 0 1-2.8 0L3 13V5a2 2 0 0 1 2-2h8l7.6 7.6a2 2 0 0 1 0 2.8z"/><circle cx="7.5" cy="7.5" r="1.3"/></svg>';
+    pricesBtn.addEventListener("click", () => togglePrices());
+    this.els.headInfo?.parentElement?.insertBefore(pricesBtn, this.els.hold ?? null);
+    this.pricesBtnEl = pricesBtn;
     this.tipEl = document.createElement("div");
     this.tipEl.setAttribute("role", "tooltip");
     this.tipEl.className = "sl-tip";
@@ -4267,7 +4389,7 @@ var SeatPicker = class _SeatPicker {
     const info = await this.controller.render(canvasHost);
     if (this.destroyed) return this;
     if (!info) {
-      this.els.boot.innerHTML = '<div class="sl-boot-title">The seat map didn\u2019t load</div><div>Check your connection and try again.</div><button type="button" class="sl-boot-retry">Try again</button>';
+      this.els.boot.innerHTML = `<div class="sl-boot-title">${this.tf("picker.mapDidNotLoad", "The seat map didn\u2019t load")}</div><div>${this.tf("picker.checkConnection", "Check your connection and try again.")}</div><button type="button" class="sl-boot-retry">${this.tf("picker.accessRetry", "Try again")}</button>`;
       this.els.boot.querySelector("button").addEventListener("click", () => {
         const container = this.opts.container;
         const opts = this.opts;
@@ -4302,6 +4424,12 @@ var SeatPicker = class _SeatPicker {
     const when = info.startsAt ? formatWhen(info.startsAt, info.timezone ?? null, this.opts.locale) : "";
     this.eventWhenText = when || null;
     this.els.meta.textContent = [info.venue, when].filter(Boolean).join(" \xB7 ");
+    if (this.els.pricesHint) {
+      this.els.pricesHint.textContent = this.tf(
+        "picker.priceHint",
+        "Colours on the map are ticket types \u2014 tap one below to show just those seats."
+      );
+    }
     this.buildBadge(chartTheme);
     const present = /* @__PURE__ */ new Set();
     let hasLimitedView = false;
@@ -4328,7 +4456,7 @@ var SeatPicker = class _SeatPicker {
         const mk = (key, label) => `<button type="button" class="sl-chip-f${key === "all" ? " on" : ""}" data-a11y="1" data-f="${key}">${label}</button>`;
         chips.insertAdjacentHTML(
           "beforeend",
-          mk("all", "All seats") + ACCESSIBILITY_TYPES.filter(({ key }) => present.has(key)).map(({ key, short, icon }) => mk(key, `${icon} ${short}`)).join("")
+          mk("all", this.tf("picker.allSeats", "All seats")) + ACCESSIBILITY_TYPES.filter(({ key }) => present.has(key)).map(({ key, short, icon }) => mk(key, `${icon} ${short}`)).join("")
         );
         const active = /* @__PURE__ */ new Set();
         const syncChips = () => {
@@ -4374,7 +4502,7 @@ var SeatPicker = class _SeatPicker {
     cb.type = "button";
     cb.className = "sl-cbbtn";
     this.cbEl = cb;
-    cb.setAttribute("aria-label", "Toggle colorblind-friendly colors");
+    cb.setAttribute("aria-label", this.tf("picker.toggleColorblindColors", "Toggle colorblind-friendly colors"));
     cb.setAttribute("aria-pressed", String(this.cbSafe));
     cb.innerHTML = '<svg viewBox="0 0 24 24"><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z"/><circle cx="12" cy="12" r="3"/></svg>';
     this.els.zfit.parentElement.appendChild(cb);
@@ -4460,8 +4588,8 @@ var SeatPicker = class _SeatPicker {
     if (!btn) return;
     const collapsed = this.sideCollapsed;
     btn.setAttribute("aria-expanded", String(!collapsed));
-    btn.setAttribute("aria-label", collapsed ? "Show the ticket panel" : "Hide the ticket panel");
-    btn.innerHTML = collapsed ? '<svg viewBox="0 0 24 24"><path d="M15 6l-6 6 6 6"/></svg><span>Tickets</span>' : '<svg viewBox="0 0 24 24"><path d="M9 6l6 6-6 6"/></svg><span>Hide panel</span>';
+    btn.setAttribute("aria-label", collapsed ? this.tf("picker.showTicketPanel", "Show the ticket panel") : this.tf("picker.hideTicketPanel", "Hide the ticket panel"));
+    btn.innerHTML = collapsed ? `<svg viewBox="0 0 24 24"><path d="M15 6l-6 6 6 6"/></svg><span>${this.tf("picker.tickets", "Tickets")}</span>` : `<svg viewBox="0 0 24 24"><path d="M9 6l6 6-6 6"/></svg><span>${this.tf("picker.hidePanel", "Hide panel")}</span>`;
   }
   /**
    * Collapse or reopen the wide-layout ticket panel in place (host-drivable —
@@ -4487,13 +4615,24 @@ var SeatPicker = class _SeatPicker {
     const narrow = this.root?.dataset.layout === "narrow";
     this.applyPanelCollapsed();
     const zfs = this.els.zfs;
-    if (zfs) {
-      if (narrow && this.regions["top-right"]) {
-        zfs.classList.add("sl-fs-pill");
-        this.regions["top-right"].appendChild(zfs);
-      } else if (!narrow && this.els.zoom && zfs.parentElement !== this.els.zoom) {
-        zfs.classList.remove("sl-fs-pill");
-        this.els.zoom.appendChild(zfs);
+    const head = this.els.headInfo?.parentElement;
+    if (zfs && head && zfs.parentElement !== head) {
+      zfs.classList.add("sl-fs-pill");
+      head.insertBefore(zfs, this.els.hold ?? null);
+    }
+    const pricesSec = this.els.pricesSec;
+    if (pricesSec) {
+      if (narrow) {
+        pricesSec.setAttribute("role", "button");
+        pricesSec.tabIndex = 0;
+        pricesSec.setAttribute(
+          "aria-expanded",
+          String(this.root?.getAttribute("data-prices-open") === "true")
+        );
+      } else {
+        pricesSec.removeAttribute("role");
+        pricesSec.removeAttribute("aria-expanded");
+        pricesSec.tabIndex = -1;
       }
     }
     const filters = this.els.filters;
@@ -4520,7 +4659,7 @@ var SeatPicker = class _SeatPicker {
     this.extendEl = el;
     this.els.extendTxt = el.querySelector('[data-ref="extendTxt"]');
     this.els.extendBtn = el.querySelector('[data-ref="extendBtn"]');
-    this.els.extendBtn.textContent = "Add time";
+    this.els.extendBtn.textContent = this.tf("picker.addTime", "Add time");
     this.els.extendBtn.addEventListener("click", () => void this.handleExtend());
   }
   /** Success overlay + onBooked fire when the held seats settle to booked. */
@@ -4529,7 +4668,7 @@ var SeatPicker = class _SeatPicker {
     el.className = "sl-booked";
     el.setAttribute("role", "status");
     el.setAttribute("aria-live", "polite");
-    el.innerHTML = `<div class="sl-booked-badge"><svg viewBox="0 0 24 24"><path d="M20 6L9 17l-5-5"/></svg></div><div class="sl-booked-title">You're all set</div><div class="sl-booked-sub" data-ref="bookedSub"></div>`;
+    el.innerHTML = `<div class="sl-booked-badge"><svg viewBox="0 0 24 24"><path d="M20 6L9 17l-5-5"/></svg></div><div class="sl-booked-title">${this.tf("picker.allSetTitle", "You're all set")}</div><div class="sl-booked-sub" data-ref="bookedSub"></div>`;
     this.root.appendChild(el);
     this.bookedEl = el;
     this.els.bookedSub = el.querySelector('[data-ref="bookedSub"]');
@@ -4540,8 +4679,7 @@ var SeatPicker = class _SeatPicker {
    * host `messages` override (which makes `t()` return the override, not the key).
    */
   tf(key, fallback) {
-    const v = t2(key);
-    return v === key ? fallback : v;
+    return tfStatic(key, fallback);
   }
   /** Sold-out overlay — an informational state with no unavailable action. */
   buildSoldoutOverlay() {
@@ -4726,7 +4864,7 @@ var SeatPicker = class _SeatPicker {
   }
   canAddTicket() {
     if (this.totalTicketCount() < this.maxTickets) return true;
-    this.toast(`You can select up to ${this.maxTickets} tickets for this order.`, "warning");
+    this.toast(t2("picker.maxTicketsForOrder", { count: this.maxTickets }), "warning");
     return false;
   }
   pendingGATotal(gaAreas) {
@@ -4749,21 +4887,21 @@ var SeatPicker = class _SeatPicker {
     }
     if (this.confirmSeat || this.tableDialog && !this.tableDialogHeld) {
       cta.disabled = true;
-      cta.textContent = this.tableDialog ? "Confirm your table" : "Confirm or cancel this seat";
+      cta.textContent = this.tableDialog ? this.tf("picker.confirmYourTable", "Confirm your table") : this.tf("picker.confirmOrCancelSeat", "Confirm or cancel this seat");
       return;
     }
     if (this.ctaPhase === "holding") {
       cta.disabled = true;
-      cta.innerHTML = '<span class="sl-cta-spin" aria-hidden="true"></span>Securing seats\u2026';
+      cta.innerHTML = `<span class="sl-cta-spin" aria-hidden="true"></span>${this.tf("picker.securingSeats", "Securing your seats\u2026")}`;
       return;
     }
     if (this.ctaPhase === "checkout") {
       cta.disabled = true;
-      cta.innerHTML = '<span class="sl-cta-spin" aria-hidden="true"></span>Opening secure checkout\u2026';
+      cta.innerHTML = `<span class="sl-cta-spin" aria-hidden="true"></span>${this.tf("picker.openingCheckout", "Opening secure checkout\u2026")}`;
       return;
     }
     cta.disabled = count === 0;
-    cta.textContent = this.hold ? pending ? `Secure ${pending} more & checkout` : "Continue to checkout" : count ? "Hold seats & checkout" : "Select seats";
+    cta.textContent = this.hold ? pending ? t2("picker.secureMoreAndCheckout", { count: pending }) : this.tf("picker.continueToCheckout", "Continue to checkout") : count ? this.tf("picker.holdSeatsAndCheckout", "Hold seats & checkout") : this.tf("picker.selectSeats", "Select seats");
   }
   setCtaPhase(phase) {
     this.ctaPhase = phase;
@@ -4824,7 +4962,7 @@ var SeatPicker = class _SeatPicker {
       this.syncTray();
       this.emitHoldChange();
       this.opts.onHoldRestored?.(restored, restored.seats ?? [], this.buildHandoff(restored));
-      if (automatic) this.toast("Your held tickets have been restored.", "success");
+      if (automatic) this.toast(this.tf("picker.heldTicketsRestored", "Your held tickets have been restored."), "success");
       return restored;
     } catch (error) {
       const status = error?.status;
@@ -5042,8 +5180,8 @@ var SeatPicker = class _SeatPicker {
     if (bands.length < 2) return;
     const select = document.createElement("select");
     select.className = "sl-price-select";
-    select.setAttribute("aria-label", "Filter and focus seats by price");
-    select.innerHTML = `<option value="all">All prices</option>` + bands.map((band) => `<option value="${band.id}">${band.label}</option>`).join("");
+    select.setAttribute("aria-label", this.tf("picker.filterAndFocusByPrice", "Filter and focus seats by price"));
+    select.innerHTML = `<option value="all">${this.tf("picker.allPrices", "All prices")}</option>` + bands.map((band) => `<option value="${band.id}">${band.label}</option>`).join("");
     this.els.pricesSec.appendChild(select);
     select.addEventListener("change", () => {
       const band = bands.find((candidate) => candidate.id === select.value);
@@ -5070,8 +5208,8 @@ var SeatPicker = class _SeatPicker {
       const projection = document.createElement("div");
       projection.className = "sl-projection";
       projection.setAttribute("role", "group");
-      projection.setAttribute("aria-label", "Venue view");
-      projection.innerHTML = '<button type="button" data-view="map" aria-pressed="true" title="Flat 2D map">Map</button><button type="button" data-view="venue3d" aria-pressed="false" title="Interactive 3D venue view">3D</button>';
+      projection.setAttribute("aria-label", this.tf("picker.venueView", "Venue view"));
+      projection.innerHTML = `<button type="button" data-view="map" aria-pressed="true" title="${this.tf("picker.flat2dMap", "Flat 2D map")}">${this.tf("picker.map", "Map")}</button><button type="button" data-view="venue3d" aria-pressed="false" title="${this.tf("picker.interactive3dVenueView", "Interactive 3D venue view")}">3D</button>`;
       projection.querySelectorAll("button").forEach((button) => {
         button.addEventListener("click", () => {
           this.setBuyerView(button.dataset.view);
@@ -5194,6 +5332,10 @@ var SeatPicker = class _SeatPicker {
   renderSectionCard(summary) {
     if (!this.els.map) return;
     this.secCardEl?.remove();
+    if (this.root?.dataset.layout === "narrow" && (this.hold || this.committedSelection().length || this.pendingGACount())) {
+      this.lastSection = null;
+      return;
+    }
     const paid = summary.categories.length ? summary.categories.map((c) => this.paidPrice(c.key, null, c.price)) : [summary.priceMin, summary.priceMax];
     const paidMin = Math.min(...paid);
     const paidMax = Math.max(...paid);
@@ -5294,13 +5436,13 @@ var SeatPicker = class _SeatPicker {
     }
     const cat = this.controller.doc?.categories.find((c) => c.key === seat.categoryKey);
     const status = this.controller.getStatus(seat.id) ?? "free";
-    const statusText = status === "free" ? "available" : status === "held" ? "on hold" : "taken";
+    const statusText = status === "free" ? this.tf("picker.statusAvailable", "available") : status === "held" ? this.tf("picker.statusOnHold", "on hold") : this.tf("picker.statusTaken2", "taken");
     const price = cat ? this.catPrice(cat) : void 0;
     const table = this.controller.tableSelection(seat.id);
     const details = table ?? this.controller.seatDetails(seat.id);
     const typeWord = this.rowTypeWord(details);
     const buyerName = details?.rowLabel ?? details?.displayLabel ?? seat.displayLabel ?? seat.label;
-    const identity = table ? `${typeWord} ${buyerName}, ${table.bookingMode === "variable" ? `${table.minOccupancy} to ${table.maxOccupancy} guests` : `${table.capacity} guests`}` : details?.objectType === "booth" ? `${typeWord} ${buyerName}` : details?.objectType === "table" ? `${typeWord} ${buyerName}, seat ${details.seatNumber ?? seat.label}` : `Seat ${details?.displayLabel ?? seat.displayLabel ?? seat.label}`;
+    const identity = table ? `${typeWord} ${buyerName}, ${table.bookingMode === "variable" ? t2("picker.minToMaxGuests", { min: table.minOccupancy, max: table.maxOccupancy }) : t2("picker.capacityGuests", { count: table.capacity })}` : details?.objectType === "booth" ? `${typeWord} ${buyerName}` : details?.objectType === "table" ? `${typeWord} ${buyerName}, ${t2("picker.seatNumberLower", { label: details.seatNumber ?? seat.label })}` : t2("picker.seatLabel", { label: details?.displayLabel ?? seat.displayLabel ?? seat.label });
     this.srEl.textContent = `${identity}, ${cat?.label ?? seat.categoryKey}${price != null ? `, ${this.money(price)}` : ""}, ${statusText}`;
   }
   // ---- atomic table confirmation / guest quantity ---------------------------
@@ -5321,7 +5463,7 @@ var SeatPicker = class _SeatPicker {
     const typeWord = this.rowTypeWord(table);
     const el = document.createElement("div");
     el.className = "sl-table-scrim";
-    el.innerHTML = `<section class="sl-table-dialog" role="dialog" aria-modal="true" aria-labelledby="sl-table-title" aria-describedby="sl-table-copy"><div class="sl-table-head"><div class="sl-table-eyebrow">${esc(variable ? `Flexible party \xB7 ${typeWord}` : `Whole ${typeWord}`)}</div><h2 class="sl-table-title" id="sl-table-title">${esc(table.displayLabel ?? table.label)}</h2><p class="sl-table-copy" id="sl-table-copy">${variable ? `Choose how many guests will sit together. This table is held exclusively for your party.` : `All ${table.capacity} places are booked together as one exclusive table.`}</p></div><div class="sl-table-body"><div class="sl-table-summary"><span>${esc(cat?.label ?? table.categoryKey)}</span><b data-table-unit>${this.money(this.paidPrice(table.categoryKey, table.tierId ?? null, table.price))} per guest</b><span class="muted">Table capacity</span><span>${table.capacity} guests</span><span class="muted">Total</span><b data-table-total></b></div>` + (variable ? `<label class="sl-table-qtylabel" id="sl-table-qty-label">Number of guests</label><div class="sl-table-stepper" role="group" aria-labelledby="sl-table-qty-label"><button type="button" data-table-step="-1" aria-label="Fewer guests">\u2212</button><output aria-live="polite" data-table-qty>${table.quantity}</output><button type="button" data-table-step="1" aria-label="More guests">+</button></div><div class="sl-table-range">Choose ${table.minOccupancy}\u2013${table.maxOccupancy} guests</div>` : `<input type="hidden" data-table-qty value="${table.capacity}">`) + `<div class="sl-table-actions"><button type="button" class="sl-table-cancel">Cancel</button><button type="button" class="sl-table-confirm">${held ? "Update table" : variable ? "Select table" : "Select whole table"}</button></div></div></section>`;
+    el.innerHTML = `<section class="sl-table-dialog" role="dialog" aria-modal="true" aria-labelledby="sl-table-title" aria-describedby="sl-table-copy"><div class="sl-table-head"><div class="sl-table-eyebrow">${esc(variable ? t2("picker.flexiblePartyTypeWord", { typeWord }) : t2("picker.wholeTypeWord", { typeWord }))}</div><h2 class="sl-table-title" id="sl-table-title">${esc(table.displayLabel ?? table.label)}</h2><p class="sl-table-copy" id="sl-table-copy">${variable ? this.tf("picker.chooseGuestsCopy", "Choose how many guests will sit together. This table is held exclusively for your party.") : t2("picker.allPlacesBookedTogether", { count: table.capacity })}</p></div><div class="sl-table-body"><div class="sl-table-summary"><span>${esc(cat?.label ?? table.categoryKey)}</span><b data-table-unit>${t2("picker.perGuestPrice", { price: this.money(this.paidPrice(table.categoryKey, table.tierId ?? null, table.price)) })}</b><span class="muted">${this.tf("picker.tableCapacity", "Table capacity")}</span><span>${t2("picker.guestsCount", { count: table.capacity })}</span><span class="muted">${this.tf("picker.total", "Total")}</span><b data-table-total></b></div>` + (variable ? `<label class="sl-table-qtylabel" id="sl-table-qty-label">${this.tf("picker.numberOfGuests", "Number of guests")}</label><div class="sl-table-stepper" role="group" aria-labelledby="sl-table-qty-label"><button type="button" data-table-step="-1" aria-label="${this.tf("picker.fewerGuests", "Fewer guests")}">\u2212</button><output aria-live="polite" data-table-qty>${table.quantity}</output><button type="button" data-table-step="1" aria-label="${this.tf("picker.moreGuests", "More guests")}">+</button></div><div class="sl-table-range">${t2("picker.chooseMinMaxGuests", { min: table.minOccupancy, max: table.maxOccupancy })}</div>` : `<input type="hidden" data-table-qty value="${table.capacity}">`) + `<div class="sl-table-actions"><button type="button" class="sl-table-cancel">${t2("common.cancel")}</button><button type="button" class="sl-table-confirm">${held ? this.tf("picker.updateTable", "Update table") : variable ? this.tf("picker.selectTable", "Select table") : this.tf("picker.selectWholeTable", "Select whole table")}</button></div></div></section>`;
     this.root.appendChild(el);
     this.tableDialogEl = el;
     this.renderTableDialogState();
@@ -5380,17 +5522,17 @@ var SeatPicker = class _SeatPicker {
     const button = this.tableDialogEl?.querySelector(".sl-table-confirm");
     if (button) {
       button.disabled = true;
-      button.textContent = held ? "Updating\u2026" : "Selecting\u2026";
+      button.textContent = held ? this.tf("picker.updatingEllipsis", "Updating\u2026") : this.tf("picker.selectingEllipsis", "Selecting\u2026");
     }
     if (held) {
       try {
         const updated = await this.controller.replaceTableQuantity(table.label, table.quantity, this.opts.holdTtlMs);
         if (!updated) {
-          this.toast("That guest count could not be secured. Your current table hold is unchanged.", "warning");
+          this.toast(this.tf("picker.guestCountCouldNotBeSecured", "That guest count could not be secured. Your current table hold is unchanged."), "warning");
           this.renderTableDialogState();
           if (button) {
             button.disabled = false;
-            button.textContent = "Update table";
+            button.textContent = this.tf("picker.updateTable", "Update table");
           }
           return;
         }
@@ -5404,13 +5546,13 @@ var SeatPicker = class _SeatPicker {
         this.dismissTableDialog();
         this.syncTray();
         this.emitHoldChange();
-        this.toast(`${table.label} updated for ${table.quantity} guests.`, "success");
+        this.toast(t2("picker.tableUpdatedForGuests", { label: table.label, count: table.quantity }), "success");
       } catch (error) {
         this.opts.onError?.(error);
-        this.toast("That guest count is no longer available. Your current hold is unchanged.", "error");
+        this.toast(this.tf("picker.guestCountNoLongerAvailable", "That guest count is no longer available. Your current hold is unchanged."), "error");
         if (button) {
           button.disabled = false;
-          button.textContent = "Update table";
+          button.textContent = this.tf("picker.updateTable", "Update table");
         }
       }
       return;
@@ -5418,7 +5560,7 @@ var SeatPicker = class _SeatPicker {
     if (!this.controller.setTableQuantity(table.label, table.quantity)) {
       if (button) {
         button.disabled = false;
-        button.textContent = table.bookingMode === "variable" ? "Select table" : "Select whole table";
+        button.textContent = table.bookingMode === "variable" ? this.tf("picker.selectTable", "Select table") : this.tf("picker.selectWholeTable", "Select whole table");
       }
       return;
     }
@@ -5464,16 +5606,16 @@ var SeatPicker = class _SeatPicker {
       '"': "&quot;"
     })[char]);
     const identityFields = [
-      details?.sectionLabel ? `<div class="sl-confirm-field"><span class="sl-confirm-key">Section</span><span class="sl-confirm-value">${safe(details.sectionLabel)}</span></div>` : "",
+      details?.sectionLabel ? `<div class="sl-confirm-field"><span class="sl-confirm-key">${this.tf("picker.section", "Section")}</span><span class="sl-confirm-value">${safe(details.sectionLabel)}</span></div>` : "",
       details?.rowLabel || details?.objectType === "booth" ? `<div class="sl-confirm-field"><span class="sl-confirm-key">${safe(this.rowTypeWord(details))}</span><span class="sl-confirm-value">${safe(this.rowShort(details) ?? details?.displayLabel ?? seat.displayLabel ?? seat.label)}</span></div>` : "",
-      details?.objectType !== "booth" ? `<div class="sl-confirm-field"><span class="sl-confirm-key">Seat</span><span class="sl-confirm-value">${safe(details?.seatNumber ?? details?.displayLabel ?? seat.displayLabel ?? seat.label)}</span></div>` : ""
+      details?.objectType !== "booth" ? `<div class="sl-confirm-field"><span class="sl-confirm-key">${this.tf("picker.seat", "Seat")}</span><span class="sl-confirm-value">${safe(details?.seatNumber ?? details?.displayLabel ?? seat.displayLabel ?? seat.label)}</span></div>` : ""
     ].filter(Boolean).join("");
     const el = document.createElement("div");
     el.className = "sl-confirm";
     el.setAttribute("role", "dialog");
-    el.setAttribute("aria-label", `Confirm seat ${seat.label}`);
+    el.setAttribute("aria-label", t2("picker.confirmSeatLabel", { label: seat.label }));
     el.style.setProperty("--sl-cat", cat?.color ?? "#6e7bff");
-    el.innerHTML = `<div class="sl-confirm-grid">` + identityFields + `</div><div class="sl-confirm-cat"><span class="sl-dot" style="background:${cat?.color ?? "#6e7bff"}"></span><span class="sl-confirm-cat-name">${safe(details?.categoryLabel ?? cat?.label ?? seat.categoryKey)}</span>` + (price != null ? `<span class="sl-confirm-price">${this.money(price)}</span>` : "") + `</div><div class="sl-confirm-body">` + this.wheelchairConfirmHtml(details?.wheelchairSpaceType) + this.commercialConfirmHtml(seat.commercial) + (this.seatViewEnabled() && this.buyerView !== "venue3d" ? this.confirmThumbHtml(seat) : "") + (this.buyerView === "venue3d" ? `${this.seatConfidenceConfirmHtml(seat, `${details?.displayLabel ?? seat.displayLabel ?? seat.label} \xB7 ${price == null ? this.tf("picker.priceNotSupplied", "Price not supplied") : this.money(price)}`)}<div class="sl-confirm-inspect-row">${this.view3dCompareConfirmHtml(seat)}${this.see3dConfirmHtml()}</div>` : this.see3dConfirmHtml()) + `<div class="sl-confirm-row"><button type="button" class="sl-confirm-cancel">Cancel</button><button type="button" class="sl-confirm-add"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12.5l4 4L19 7"/></svg>Select</button></div></div>`;
+    el.innerHTML = `<div class="sl-confirm-grid">` + identityFields + `</div><div class="sl-confirm-cat"><span class="sl-dot" style="background:${cat?.color ?? "#6e7bff"}"></span><span class="sl-confirm-cat-name">${safe(details?.categoryLabel ?? cat?.label ?? seat.categoryKey)}</span>` + (price != null ? `<span class="sl-confirm-price">${this.money(price)}</span>` : "") + `</div><div class="sl-confirm-body">` + this.wheelchairConfirmHtml(details?.wheelchairSpaceType) + this.commercialConfirmHtml(seat.commercial) + (this.seatViewEnabled() && this.buyerView !== "venue3d" ? this.confirmThumbHtml(seat) : "") + (this.buyerView === "venue3d" ? `${this.seatConfidenceConfirmHtml(seat, `${details?.displayLabel ?? seat.displayLabel ?? seat.label} \xB7 ${price == null ? this.tf("picker.priceNotSupplied", "Price not supplied") : this.money(price)}`)}<div class="sl-confirm-inspect-row">${this.view3dCompareConfirmHtml(seat)}${this.see3dConfirmHtml()}</div>` : this.see3dConfirmHtml()) + `<div class="sl-confirm-row"><button type="button" class="sl-confirm-cancel">${t2("common.cancel")}</button><button type="button" class="sl-confirm-add"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12.5l4 4L19 7"/></svg>${this.tf("picker.select", "Select")}</button></div></div>`;
     this.els.map.appendChild(el);
     this.confirmEl = el;
     const thumb = el.querySelector(".sl-confirm-thumb");
@@ -5626,7 +5768,7 @@ var SeatPicker = class _SeatPicker {
     el.className = "sl-view";
     el.setAttribute("role", "dialog");
     el.setAttribute("aria-label", t2("picker.viewFromSeat", { label: seat.label }));
-    el.innerHTML = `<div class="sl-view-head"><span class="sl-view-title">${t2("picker.viewFromSeat", { label: seat.label })}</span><span class="sl-view-cap">${caption}</span><button type="button" class="sl-view-x" aria-label="Close"><svg viewBox="0 0 24 24"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div><div class="sl-view-pano"><span class="sl-view-badge">${real ? t2("picker.real360") : t2("picker.preview")}</span><span class="sl-view-hint">Drag to look around \xB7 scroll to zoom</span></div>`;
+    el.innerHTML = `<div class="sl-view-head"><span class="sl-view-title">${t2("picker.viewFromSeat", { label: seat.label })}</span><span class="sl-view-cap">${caption}</span><button type="button" class="sl-view-x" aria-label="${this.tf("picker.close", "Close")}"><svg viewBox="0 0 24 24"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button></div><div class="sl-view-pano"><span class="sl-view-badge">${real ? t2("picker.real360") : t2("picker.preview")}</span><span class="sl-view-hint">${this.tf("picker.dragToLookAround", "Drag to look around \xB7 scroll to zoom")}</span></div>`;
     this.root.appendChild(el);
     this.viewEl = el;
     const pano = el.querySelector(".sl-view-pano");
@@ -5822,27 +5964,27 @@ var SeatPicker = class _SeatPicker {
     copy.className = "sl-offer-copy";
     const kicker = document.createElement("span");
     kicker.className = "sl-offer-kicker";
-    kicker.textContent = active ? "Current ticket offer" : "Upcoming ticket offer";
+    kicker.textContent = active ? this.tf("picker.currentTicketOffer", "Current ticket offer") : this.tf("picker.upcomingTicketOffer", "Upcoming ticket offer");
     const name = document.createElement("strong");
     name.className = "sl-offer-name";
-    name.textContent = offer.name || (active ? "Current offer" : "Scheduled offer");
+    name.textContent = offer.name || (active ? this.tf("picker.currentOffer", "Current offer") : this.tf("picker.scheduledOffer", "Scheduled offer"));
     const line = document.createElement("span");
     line.className = "sl-offer-line";
     const facts = [];
     if (active && availability.fromPrice != null) facts.push(this.money(availability.fromPrice / 100));
-    if (active && offer.remaining != null) facts.push(`${offer.remaining} available`);
-    if (active && offer.endsAt != null) facts.push(`until ${formatWhen(offer.endsAt, this.eventTimezone, this.opts.locale)}`);
-    if (upcoming?.startsAt != null) facts.push(`starts ${formatWhen(upcoming.startsAt, this.eventTimezone, this.opts.locale)}`);
+    if (active && offer.remaining != null) facts.push(t2("picker.offerRemainingAvailable", { count: offer.remaining }));
+    if (active && offer.endsAt != null) facts.push(t2("picker.offerUntil", { time: formatWhen(offer.endsAt, this.eventTimezone, this.opts.locale) }));
+    if (upcoming?.startsAt != null) facts.push(t2("picker.offerStarts", { time: formatWhen(upcoming.startsAt, this.eventTimezone, this.opts.locale) }));
     line.textContent = facts.join(" \xB7 ");
     copy.append(kicker, name, line);
     const info = document.createElement("details");
     info.className = "sl-offer-info";
     const summary = document.createElement("summary");
-    summary.setAttribute("aria-label", `How the ${name.textContent} offer works`);
+    summary.setAttribute("aria-label", t2("picker.howOfferWorks", { name: name.textContent ?? "" }));
     summary.textContent = "i";
     const detail = document.createElement("div");
     detail.className = "sl-offer-detail";
-    detail.textContent = active ? `This price applies automatically to eligible seats. Tickets in active carts temporarily reduce the available quantity; released or expired holds return it. When the offer ends, the next matching offer or normal ticket price takes over.` : `Tickets are available at their normal price now. This scheduled offer will apply automatically to eligible seats when it starts.`;
+    detail.textContent = active ? this.tf("picker.offerDetailActive", "This price applies automatically to eligible seats. Tickets in active carts temporarily reduce the available quantity; released or expired holds return it. When the offer ends, the next matching offer or normal ticket price takes over.") : this.tf("picker.offerDetailUpcoming", "Tickets are available at their normal price now. This scheduled offer will apply automatically to eligible seats when it starts.");
     info.append(summary, detail);
     main.append(copy, info);
     host.replaceChildren(main);
@@ -5878,8 +6020,8 @@ var SeatPicker = class _SeatPicker {
       const previous = offer?.previousPrice != null && offer.previousPrice > offer.price ? offer.previousPrice : null;
       const active = this.focusedCatKey === c.key;
       const dim = this.priceBandKeys != null && !this.priceBandKeys.has(c.key);
-      return `<div class="sl-price-row${dim ? " sl-dim" : ""}${active ? " sl-active" : ""}" data-cat="${escapeOption(c.key)}" role="button" tabindex="0" aria-pressed="${active}" title="${escapeOption(active ? "Show all seats" : `Show ${c.label} seats on the map`)}"><span class="sl-dot" style="background:${escapeOption(c.color)}"></span><span class="sl-price-label">${escapeOption(c.label)}` + (offer?.offerName ? `<small class="sl-price-offer">${escapeOption(offer.offerName)}</small>` : "") + `</span><span class="sl-price-left">${left[c.key] ?? 0} left</span>` + (previous != null ? `<span class="sl-price-was">${escapeOption(this.money(previous))}</span>` : "") + (price != null ? `<span class="sl-price-amt">${this.money(price)}</span>` : "") + `</div>`;
-    }).join("") + (overflow > 1 ? `<button type="button" class="sl-price-more" aria-expanded="${!collapsed}">` + (collapsed ? `Show all ${doc.categories.length} ticket types` : "Show fewer") + `</button>` : "") + `<div class="sl-status-key" aria-label="Seat status legend"><span class="sl-status-item"><i class="sl-status-icon" aria-hidden="true"><svg viewBox="0 0 24 24"><rect x="5" y="10" width="14" height="10" rx="2"/><path d="M8 10V7a4 4 0 0 1 8 0v3"/></svg></i>Temporarily held</span><span class="sl-status-item"><i class="sl-status-icon sold" aria-hidden="true"><svg viewBox="0 0 24 24"><path d="M7 17L17 7"/></svg></i>Sold</span></div>`;
+      return `<div class="sl-price-row${dim ? " sl-dim" : ""}${active ? " sl-active" : ""}" data-cat="${escapeOption(c.key)}" role="button" tabindex="0" aria-pressed="${active}" title="${escapeOption(active ? this.tf("picker.showAllSeats", "Show all seats") : t2("picker.showLabelSeatsOnMap", { label: c.label }))}"><span class="sl-dot" style="background:${escapeOption(c.color)}"></span><span class="sl-price-label">${escapeOption(c.label)}` + (offer?.offerName ? `<small class="sl-price-offer">${escapeOption(offer.offerName)}</small>` : "") + `</span><span class="sl-price-left">${tCount("picker.leftCount", left[c.key] ?? 0)}</span>` + (previous != null ? `<span class="sl-price-was">${escapeOption(this.money(previous))}</span>` : "") + (price != null ? `<span class="sl-price-amt">${this.money(price)}</span>` : "") + `</div>`;
+    }).join("") + (overflow > 1 ? `<button type="button" class="sl-price-more" aria-expanded="${!collapsed}">` + (collapsed ? t2("picker.showAllTicketTypes", { count: doc.categories.length }) : this.tf("picker.showFewer", "Show fewer")) + `</button>` : "") + `<div class="sl-status-key" aria-label="${this.tf("picker.seatStatusLegend", "Seat status legend")}"><span class="sl-status-item"><i class="sl-status-icon" aria-hidden="true"><svg viewBox="0 0 24 24"><rect x="5" y="10" width="14" height="10" rx="2"/><path d="M8 10V7a4 4 0 0 1 8 0v3"/></svg></i>${this.tf("picker.temporarilyHeld", "Temporarily held")}</span><span class="sl-status-item"><i class="sl-status-icon sold" aria-hidden="true"><svg viewBox="0 0 24 24"><path d="M7 17L17 7"/></svg></i>${this.tf("picker.sold", "Sold")}</span></div>`;
     this.els.prices.querySelectorAll(".sl-price-row").forEach((row) => {
       row.addEventListener("mouseenter", () => this.controller.getRenderer()?.setCategoryHighlight?.(row.dataset.cat ?? null));
       row.addEventListener("mouseleave", () => this.controller.getRenderer()?.setCategoryHighlight?.(null));
@@ -5937,7 +6079,7 @@ var SeatPicker = class _SeatPicker {
       const now = left[cat.key] ?? 0;
       if (before === void 0 || now >= before) continue;
       const taken = before - now;
-      textEl.textContent = `${taken} seat${taken === 1 ? "" : "s"} just taken in ${cat.label} \xB7 ${now} left`;
+      textEl.textContent = tCount("picker.seatsJustTakenInCategory", taken, { label: cat.label, left: now });
       this.els.live?.classList.remove("on");
       void this.els.live?.offsetWidth;
       this.els.live?.classList.add("on");
@@ -5955,12 +6097,17 @@ var SeatPicker = class _SeatPicker {
     const gone = this.controller.getSelection().filter((s) => !ownLabels.has(s.label) && (this.controller.getStatus(s.id) ?? "free") !== "free");
     if (!gone.length) return;
     this.controller.deselect(gone.map((s) => s.id));
-    this.toast(`Seat ${gone[0].label} was just taken by another buyer.`, "error");
+    this.toast(t2("picker.seatJustTakenByAnother", { label: gone[0].label }), "error");
   }
   syncTray() {
     if (!this.els.tray) return;
     this.updateSelectionCapacity();
     const seats = this.committedSelection();
+    if (this.root?.dataset.layout === "narrow" && this.secCardEl && (this.hold || seats.length || this.pendingGACount())) {
+      this.secCardEl.remove();
+      this.secCardEl = null;
+      this.lastSection = null;
+    }
     const gaAreas = this.controller.getGAAreas();
     const heldItems = this.hold?.items ?? [];
     const parts = [];
@@ -5971,18 +6118,22 @@ var SeatPicker = class _SeatPicker {
         `<div class="sl-closed-note" role="status"><b>${this.tf("picker.salesClosedPill", "Sales are closed")}</b><span>${this.tf("picker.salesClosedCopy", "Ticket sales for this event have ended.")}${closedWhen}</span></div>`
       );
     } else if (!seats.length && !heldItems.length && !gaAreas.length) {
-      parts.push(`<div class="sl-tray-hint">Tap a seat on the map, or let us pick the best available for you.</div>`);
+      parts.push(`<div class="sl-tray-hint">${this.tf("picker.trayHintTapOrBest", "Tap a seat on the map, or let us pick the best available for you.")}</div>`);
     } else if (!seats.length && !heldItems.length) {
-      parts.push(`<div class="sl-tray-hint">Tap a seat on the map \u2014 or grab standing tickets below.</div>`);
+      parts.push(`<div class="sl-tray-hint">${this.tf("picker.trayHintTapOrStanding", "Tap a seat on the map \u2014 or grab standing tickets below.")}</div>`);
     }
     const noPicks = !seats.length && !heldItems.length && !this.pendingGACount();
-    if (!this.salesClosed && !this.hold && (noPicks || this.bestAvailableBusy || this.bestAvailableConfirm)) {
+    if (noPicks) this.baReopen = false;
+    if (!this.salesClosed && !this.hold && (noPicks || this.baReopen || this.bestAvailableBusy || this.bestAvailableConfirm)) {
       const cats = this.controller.doc?.categories ?? [];
       const zones = this.controller.getBestAvailableZones();
       if (this.baZone && !zones.some((zone) => zone.id === this.baZone)) this.baZone = "";
-      parts.push(this.bestAvailableConfirm ? `<div class="sl-ba" role="alert"><div class="sl-ba-title"><span class="spark" aria-hidden="true">\u2726</span>Replace your current choices?</div><div class="sl-ba-replace"><b>We\u2019ll find ${this.baQty} seats together.</b><span>Your manually selected tickets will be removed only after a new group is secured.</span></div><div class="sl-ba-actions"><button type="button" data-ba-cancel>Keep mine</button><button type="button" class="replace" data-ba-replace>Find new seats</button></div></div>` : `<div class="sl-ba"><div class="sl-ba-title"><span class="spark" aria-hidden="true">\u2726</span>Find the best seats together</div><div class="sl-ba-copy"><span class="wide">We\u2019ll choose the closest available group for you.</span><span class="narrow">Closest available group, chosen instantly.</span></div>` + // Premium quick-pick — present only when the chart actually has premium
+      parts.push(this.bestAvailableConfirm ? `<div class="sl-ba" role="alert"><div class="sl-ba-title"><span class="spark" aria-hidden="true">\u2726</span>${this.tf("picker.replaceCurrentChoices", "Replace your current choices?")}</div><div class="sl-ba-replace"><b>${t2("picker.willFindSeatsTogether", { count: this.baQty })}</b><span>${this.tf("picker.manualTicketsRemovedNote", "Your manually selected tickets will be removed only after a new group is secured.")}</span></div><div class="sl-ba-actions"><button type="button" data-ba-cancel>${this.tf("picker.keepMine", "Keep mine")}</button><button type="button" class="replace" data-ba-replace>${this.tf("picker.findNewSeats", "Find new seats")}</button></div></div>` : `<div class="sl-ba"><div class="sl-ba-title"><span class="spark" aria-hidden="true">\u2726</span>${this.tf("picker.findBestSeatsTogether", "Find the best seats together")}</div><div class="sl-ba-copy"><span class="wide">${this.tf("picker.willChooseClosestGroup", "We\u2019ll choose the closest available group for you.")}</span><span class="narrow">${this.tf("picker.closestGroupChosenInstantly", "Closest available group, chosen instantly.")}</span></div>` + // Premium quick-pick — present only when the chart actually has premium
       // seats (same present-only philosophy as the a11y filter chips).
-      (this.controller.hasPremiumSeats() ? `<button type="button" class="sl-ba-premium${this.baPremium ? " on" : ""}" data-ba-premium aria-pressed="${this.baPremium ? "true" : "false"}"><span class="star" aria-hidden="true">\u2605</span>${this.tf("picker.bestSeatsPremium", "Best seats")}</button>` : "") + (cats.length > 1 ? `<select aria-label="Preferred ticket type" data-ba-cat><option value="">Any ticket type</option>` + cats.map((c) => `<option value="${c.key}"${this.baCat === c.key ? " selected" : ""}>${c.label}</option>`).join("") + `</select>` : `<span aria-hidden="true"></span>`) + (zones.length ? `<select aria-label="Preferred venue zone" data-ba-zone><option value="">Any venue zone</option>` + zones.map((zone) => `<option value="${escapeOption(zone.id)}"${this.baZone === zone.id ? " selected" : ""}>${escapeOption(zone.label)}</option>`).join("") + `</select>` : "") + `<div class="sl-ba-qty"><button type="button" data-ba="-1" aria-label="Fewer seats">\u2212</button><span>${this.baQty}</span><button type="button" data-ba="1" aria-label="More seats">+</button></div><button type="button" class="sl-ba-go${this.bestAvailableBusy ? " sl-busy" : ""}"${this.bestAvailableBusy ? " disabled" : ""}>` + (this.bestAvailableBusy ? `<span class="sl-ba-spin" aria-hidden="true"></span>Finding the best seats\u2026` : `Find ${this.baQty} best ${this.baQty === 1 ? "seat" : "seats"}`) + `</button></div>`);
+      (this.controller.hasPremiumSeats() ? `<button type="button" class="sl-ba-premium${this.baPremium ? " on" : ""}" data-ba-premium aria-pressed="${this.baPremium ? "true" : "false"}"><span class="star" aria-hidden="true">\u2605</span>${this.tf("picker.bestSeatsPremium", "Best seats")}</button>` : "") + (cats.length > 1 ? `<select aria-label="${this.tf("picker.preferredTicketType", "Preferred ticket type")}" data-ba-cat><option value="">${this.tf("picker.anyTicketType", "Any ticket type")}</option>` + cats.map((c) => `<option value="${c.key}"${this.baCat === c.key ? " selected" : ""}>${c.label}</option>`).join("") + `</select>` : `<span aria-hidden="true"></span>`) + (zones.length ? `<select aria-label="${this.tf("picker.preferredVenueZone", "Preferred venue zone")}" data-ba-zone><option value="">${this.tf("picker.anyVenueZone", "Any venue zone")}</option>` + zones.map((zone) => `<option value="${escapeOption(zone.id)}"${this.baZone === zone.id ? " selected" : ""}>${escapeOption(zone.label)}</option>`).join("") + `</select>` : "") + `<div class="sl-ba-qty"><button type="button" data-ba="-1" aria-label="${this.tf("picker.fewerSeats", "Fewer seats")}">\u2212</button><span>${this.baQty}</span><button type="button" data-ba="1" aria-label="${this.tf("picker.moreSeats", "More seats")}">+</button></div><button type="button" class="sl-ba-go${this.bestAvailableBusy ? " sl-busy" : ""}"${this.bestAvailableBusy ? " disabled" : ""}>` + (this.bestAvailableBusy ? `<span class="sl-ba-spin" aria-hidden="true"></span>${this.tf("picker.findingBestSeats", "Finding the best seats\u2026")}` : tCount("picker.findBestSeatsCount", this.baQty)) + `</button>` + // Reopened over an existing selection: the buyer needs the way back
+      // stated as plainly as the way forward (Go routes through the
+      // "Replace your current choices?" confirm, so nothing is lost yet).
+      (this.baReopen ? `<button type="button" class="sl-ba-back" data-ba-close>${this.tf("picker.keepMyPicks", "Keep my picks")}</button>` : "") + `</div>`);
     }
     const idGrid = (seatId, label, objectType, quantity = 1, objectId, identity) => {
       const esc = (value) => String(value ?? "\u2014").replace(/[&<>"]/g, (char) => ({
@@ -5994,21 +6145,21 @@ var SeatPicker = class _SeatPicker {
       const d = seatId ? this.controller.seatDetails(seatId) : null;
       const area = objectType === "ga" ? gaAreas.find((candidate) => candidate.id === objectId) : void 0;
       const effectiveType = objectType === "ga" ? "ga" : d?.objectType ?? objectType;
-      const typeWord = identity?.displayType?.trim() || d?.displayType?.trim() || area?.displayType?.trim() || (effectiveType === "table" ? "Table" : effectiveType === "booth" ? "Booth" : effectiveType === "ga" ? "General admission" : "Row");
+      const typeWord = identity?.displayType?.trim() || d?.displayType?.trim() || area?.displayType?.trim() || (effectiveType === "table" ? this.tf("picker.table", "Table") : effectiveType === "booth" ? this.tf("picker.booth", "Booth") : effectiveType === "ga" ? this.tf("picker.generalAdmission", "General admission") : this.tf("picker.row", "Row"));
       const buyerName = identity?.rowLabel ?? identity?.displayLabel ?? d?.rowLabel ?? d?.displayLabel ?? area?.displayLabel ?? area?.label ?? label;
       if (effectiveType === "table" && identity?.bookingMode) {
-        return `<div class="sl-chip-id"><span class="fld sec"><span class="sl-chip-eb">${esc(typeWord)}</span><span class="val">${esc(buyerName)}</span></span><span class="fld mid"><span class="sl-chip-eb">Guests</span><span class="val">${quantity}</span></span></div>`;
+        return `<div class="sl-chip-id"><span class="fld sec"><span class="sl-chip-eb">${esc(typeWord)}</span><span class="val">${esc(buyerName)}</span></span><span class="fld mid"><span class="sl-chip-eb">${this.tf("picker.guests", "Guests")}</span><span class="val">${quantity}</span></span></div>`;
       }
       if (effectiveType === "ga") {
-        return `<div class="sl-chip-id"><span class="fld sec"><span class="sl-chip-eb">${esc(typeWord)}</span><span class="val">${esc(buyerName)}</span></span>` + (quantity > 1 ? `<span class="fld mid"><span class="sl-chip-eb">Tickets</span><span class="val">${quantity}</span></span>` : "") + `</div>`;
+        return `<div class="sl-chip-id"><span class="fld sec"><span class="sl-chip-eb">${esc(typeWord)}</span><span class="val">${esc(buyerName)}</span></span>` + (quantity > 1 ? `<span class="fld mid"><span class="sl-chip-eb">${this.tf("picker.tickets", "Tickets")}</span><span class="val">${quantity}</span></span>` : "") + `</div>`;
       }
       if (effectiveType === "booth") {
-        return `<div class="sl-chip-id">` + (d?.sectionLabel ? `<span class="fld sec"><span class="sl-chip-eb">Section</span><span class="val">${esc(d.sectionLabel)}</span></span>` : "") + `<span class="fld mid"><span class="sl-chip-eb">${esc(typeWord)}</span><span class="val">${esc(buyerName)}</span></span></div>`;
+        return `<div class="sl-chip-id">` + (d?.sectionLabel ? `<span class="fld sec"><span class="sl-chip-eb">${this.tf("picker.section", "Section")}</span><span class="val">${esc(d.sectionLabel)}</span></span>` : "") + `<span class="fld mid"><span class="sl-chip-eb">${esc(typeWord)}</span><span class="val">${esc(buyerName)}</span></span></div>`;
       }
       if (!d?.sectionLabel && !d?.rowLabel && !d?.seatNumber) {
-        return `<div class="sl-chip-id"><span class="fld sec"><span class="sl-chip-eb">Seat</span><span class="val">${esc(buyerName)}</span></span></div>`;
+        return `<div class="sl-chip-id"><span class="fld sec"><span class="sl-chip-eb">${this.tf("picker.seat", "Seat")}</span><span class="val">${esc(buyerName)}</span></span></div>`;
       }
-      return `<div class="sl-chip-id">` + (d.sectionLabel ? `<span class="fld sec"><span class="sl-chip-eb">Section</span><span class="val">${esc(d.sectionLabel)}</span></span>` : "") + (d.rowLabel ? `<span class="fld mid"><span class="sl-chip-eb">${esc(typeWord)}</span><span class="val">${esc(this.rowShort(d))}</span></span>` : "") + (d.seatNumber ? `<span class="fld mid"><span class="sl-chip-eb">Seat</span><span class="val">${esc(d.seatNumber)}</span></span>` : "") + `</div>`;
+      return `<div class="sl-chip-id">` + (d.sectionLabel ? `<span class="fld sec"><span class="sl-chip-eb">${this.tf("picker.section", "Section")}</span><span class="val">${esc(d.sectionLabel)}</span></span>` : "") + (d.rowLabel ? `<span class="fld mid"><span class="sl-chip-eb">${esc(typeWord)}</span><span class="val">${esc(this.rowShort(d))}</span></span>` : "") + (d.seatNumber ? `<span class="fld mid"><span class="sl-chip-eb">${this.tf("picker.seat", "Seat")}</span><span class="val">${esc(d.seatNumber)}</span></span>` : "") + `</div>`;
     };
     const iconRail = (rmAria, viewLabel) => `<div class="sl-chip-rail"><button type="button" class="rm" aria-label="${rmAria}"><svg viewBox="0 0 24 24"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg></button>` + (viewLabel ? `<button type="button" class="view" data-view-label="${viewLabel}" aria-label="${t2("picker.viewFromSeat", { label: viewLabel })}"><svg viewBox="0 0 24 24"><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z"/><circle cx="12" cy="12" r="3"/></svg></button>` : "") + `</div>`;
     for (const item of heldItems) {
@@ -6020,7 +6171,7 @@ var SeatPicker = class _SeatPicker {
       const table = item.objectType === "table" ? this.controller.tableSelection(item.label) : null;
       const canView2 = this.seatViewEnabled() && !!heldSeat && item.objectType !== "table";
       parts.push(
-        `<div class="sl-chip sl-held${this.lastTrayKeys.has(itemKey) ? "" : " sl-enter"}" data-key="${itemKey}" data-held="${encodeURIComponent(item.label)}"${heldSeat ? ` data-locate="${heldSeat.id}"` : ""}><div class="sl-chip-main">` + idGrid(heldSeat?.id ?? null, item.label, item.objectType, item.quantity ?? 1, item.objectId, table ?? void 0) + `<div class="sl-chip-sub"><span class="sl-ticket-state held" aria-label="Held for you" title="Held for you"><svg viewBox="0 0 24 24"><rect x="5" y="10" width="14" height="10" rx="2"/><path d="M8 10V7a4 4 0 0 1 8 0v3"/></svg></span><span class="cat">${cat?.label ?? item.categoryKey}${tierName ? ` \xB7 ${tierName}` : ""}</span>` + (table?.bookingMode === "variable" ? `<button type="button" class="sl-table-edit" data-table-edit="${encodeURIComponent(item.label)}">${item.quantity ?? 1} guests \xB7 Edit</button>` : "") + this.wheelchairChipMarker(heldSeat?.wheelchairSpaceType) + this.commercialChipMarker(heldSeat?.commercial) + `<span class="amt">${this.money(this.paidPrice(item.categoryKey, item.tierId, item.unitPrice) * (item.quantity ?? 1))}</span></div></div>` + iconRail(`Remove held ticket ${item.label}`, canView2 ? item.label : null) + `</div>`
+        `<div class="sl-chip sl-held${this.lastTrayKeys.has(itemKey) ? "" : " sl-enter"}" data-key="${itemKey}" data-held="${encodeURIComponent(item.label)}"${heldSeat ? ` data-locate="${heldSeat.id}"` : ""}><div class="sl-chip-main">` + idGrid(heldSeat?.id ?? null, item.label, item.objectType, item.quantity ?? 1, item.objectId, table ?? void 0) + `<div class="sl-chip-sub"><span class="sl-ticket-state held" aria-label="${this.tf("picker.heldForYou", "Held for you")}" title="${this.tf("picker.heldForYou", "Held for you")}"><svg viewBox="0 0 24 24"><rect x="5" y="10" width="14" height="10" rx="2"/><path d="M8 10V7a4 4 0 0 1 8 0v3"/></svg></span><span class="cat">${cat?.label ?? item.categoryKey}${tierName ? ` \xB7 ${tierName}` : ""}</span>` + (table?.bookingMode === "variable" ? `<button type="button" class="sl-table-edit" data-table-edit="${encodeURIComponent(item.label)}">${t2("picker.guestsCountEdit", { count: item.quantity ?? 1 })}</button>` : "") + this.wheelchairChipMarker(heldSeat?.wheelchairSpaceType) + this.commercialChipMarker(heldSeat?.commercial) + `<span class="amt">${this.money(this.paidPrice(item.categoryKey, item.tierId, item.unitPrice) * (item.quantity ?? 1))}</span></div></div>` + iconRail(t2("picker.removeHeldTicketLabel", { label: item.label }), canView2 ? item.label : null) + `</div>`
       );
     }
     const heldLabels = new Set(heldItems.map((item) => item.label));
@@ -6031,13 +6182,18 @@ var SeatPicker = class _SeatPicker {
       const cat = this.controller.doc?.categories.find((c) => c.key === s.categoryKey);
       const tierSelect = s.tiers && s.tiers.length ? `<select class="tier" data-tier="${s.id}" aria-label="${t2("picker.ticketTierFor", { label: s.label })}">` + s.tiers.map((ti) => `<option value="${ti.id}"${ti.id === s.tierId ? " selected" : ""}>${ti.name} \xB7 ${this.money(this.paidPrice(s.categoryKey, ti.id, ti.price))}</option>`).join("") + `</select>` : "";
       parts.push(
-        `<div class="sl-chip${this.lastTrayKeys.has(itemKey) ? "" : " sl-enter"}" data-key="${itemKey}" data-seat="${s.id}" data-locate="${s.id}"><div class="sl-chip-main">` + idGrid(s.id, s.label, s.objectType, s.quantity ?? 1, s.objectId, s) + `<div class="sl-chip-sub"><span class="sl-ticket-state" aria-label="Selected" title="Selected"><svg viewBox="0 0 24 24"><path d="M5 12l4 4L19 6"/></svg></span><span class="cat">${cat?.label ?? s.categoryKey}</span>` + (s.objectType === "table" && s.bookingMode === "variable" ? `<button type="button" class="sl-table-edit" data-table-edit="${encodeURIComponent(s.label)}">${s.quantity ?? 1} guests \xB7 Edit</button>` : "") + `${this.wheelchairChipMarker(s.wheelchairSpaceType)}${this.commercialChipMarker(s.commercial)}${tierSelect}<span class="amt">${this.money(this.paidPrice(s.categoryKey, s.tierId ?? null, s.price) * (s.quantity ?? 1))}</span></div></div>` + iconRail(`Remove ${s.label}`, canView && s.objectType !== "table" ? s.label : null) + `</div>`
+        `<div class="sl-chip${this.lastTrayKeys.has(itemKey) ? "" : " sl-enter"}" data-key="${itemKey}" data-seat="${s.id}" data-locate="${s.id}"><div class="sl-chip-main">` + idGrid(s.id, s.label, s.objectType, s.quantity ?? 1, s.objectId, s) + `<div class="sl-chip-sub"><span class="sl-ticket-state" aria-label="${this.tf("picker.selected", "Selected")}" title="${this.tf("picker.selected", "Selected")}"><svg viewBox="0 0 24 24"><path d="M5 12l4 4L19 6"/></svg></span><span class="cat">${cat?.label ?? s.categoryKey}</span>` + (s.objectType === "table" && s.bookingMode === "variable" ? `<button type="button" class="sl-table-edit" data-table-edit="${encodeURIComponent(s.label)}">${t2("picker.guestsCountEdit", { count: s.quantity ?? 1 })}</button>` : "") + `${this.wheelchairChipMarker(s.wheelchairSpaceType)}${this.commercialChipMarker(s.commercial)}${tierSelect}<span class="amt">${this.money(this.paidPrice(s.categoryKey, s.tierId ?? null, s.price) * (s.quantity ?? 1))}</span></div></div>` + iconRail(t2("picker.removeSeatLabel", { label: s.label }), canView && s.objectType !== "table" ? s.label : null) + `</div>`
       );
     }
     for (const area of gaAreas) {
       const qty = this.gaQty.get(area.id) ?? 0;
       parts.push(
-        `<div class="sl-ga" data-ga="${area.id}"><div class="sl-ga-info"><div class="sl-ga-name">${area.displayLabel ?? area.label}</div><div class="sl-ga-sub">${area.displayType ?? "General admission"} \xB7 ${this.money(this.paidPrice(area.categoryKey, null, area.price))} \xB7 ${area.available} left</div></div><div class="sl-ga-qty"><button type="button" data-d="-1" aria-label="Fewer">\u2212</button><span>${qty}</span><button type="button" data-d="1" aria-label="More">+</button></div></div>`
+        `<div class="sl-ga" data-ga="${area.id}"><div class="sl-ga-info"><div class="sl-ga-name">${area.displayLabel ?? area.label}</div><div class="sl-ga-sub">${area.displayType ?? this.tf("picker.generalAdmission", "General admission")} \xB7 ${this.money(this.paidPrice(area.categoryKey, null, area.price))} \xB7 ${tCount("picker.leftCount", area.available)}</div></div><div class="sl-ga-qty"><button type="button" data-d="-1" aria-label="${this.tf("picker.fewer", "Fewer")}">\u2212</button><span>${qty}</span><button type="button" data-d="1" aria-label="${this.tf("picker.more", "More")}">+</button></div></div>`
+      );
+    }
+    if (!this.salesClosed && !this.hold && !noPicks && !this.baReopen && !this.bestAvailableBusy && !this.bestAvailableConfirm) {
+      parts.push(
+        `<button type="button" class="sl-ba-reopen" data-ba-reopen><span aria-hidden="true">\u2726</span>${this.tf("picker.findTogetherInstead", "Find seats together instead")}</button>`
       );
     }
     this.els.tray.innerHTML = parts.join("");
@@ -6072,6 +6228,16 @@ var SeatPicker = class _SeatPicker {
       this.syncTray();
       this.els.tray.querySelector(".sl-ba-go")?.focus();
     });
+    this.els.tray.querySelector("[data-ba-reopen]")?.addEventListener("click", () => {
+      this.baReopen = true;
+      this.syncTray();
+      this.els.tray.querySelector(".sl-ba-go")?.focus();
+    });
+    this.els.tray.querySelector("[data-ba-close]")?.addEventListener("click", () => {
+      this.baReopen = false;
+      this.syncTray();
+      this.els.tray.querySelector("[data-ba-reopen]")?.focus();
+    });
     this.els.tray.querySelector("[data-ba-replace]")?.addEventListener("click", () => {
       this.bestAvailableConfirm = false;
       void this.bestAvailable(this.baQty, this.baCat || void 0, { preferPremium: this.baPremium, zoneId: this.baZone || void 0 });
@@ -6084,15 +6250,15 @@ var SeatPicker = class _SeatPicker {
           return;
         }
         const id = chip.dataset.seat;
-        const label = this.controller.getSelection().find((sel) => sel.id === id)?.label ?? "Seat";
+        const label = this.controller.getSelection().find((sel) => sel.id === id)?.label ?? this.tf("picker.seat", "Seat");
         const remove = () => {
           this.controller.deselect([id]);
-          this.toast(`${label} removed.`, "neutral", {
-            label: "Undo",
+          this.toast(t2("picker.labelRemoved", { label }), "neutral", {
+            label: this.tf("picker.undo", "Undo"),
             onClick: () => {
               const restored = this.controller.select([id]);
               this.toast(
-                restored.length ? `${label} restored.` : `${label} is no longer available.`,
+                restored.length ? t2("picker.labelRestored", { label }) : t2("picker.labelNoLongerAvailable", { label }),
                 restored.length ? "success" : "warning"
               );
             }
@@ -6164,31 +6330,31 @@ var SeatPicker = class _SeatPicker {
     const pendingCount = this.pendingSelectionCount();
     const previousCount = this.lastTrayCount;
     const previousTotal = this.lastTrayTotal;
-    this.els.count.textContent = count ? `${count} ${count === 1 ? "ticket" : "tickets"}` : "No seats selected";
+    this.els.count.textContent = count ? tCount("picker.ticketsCount", count) : this.tf("picker.noSeatsSelected", "No seats selected");
     this.els.total.textContent = count ? this.money(total) : "";
     this.root?.setAttribute("data-has-selection", String(count > 0));
     this.root?.setAttribute(
       "data-ba-active",
-      String(this.bestAvailableConfirm || this.bestAvailableBusy)
+      String(this.bestAvailableConfirm || this.bestAvailableBusy || this.baReopen)
     );
     this.els.foot?.classList.toggle("empty", count === 0);
     if (this.els.seatSummary) {
-      this.els.seatSummary.textContent = count ? `${count} selected` : "";
+      this.els.seatSummary.textContent = count ? tCount("picker.seatsSelectedCount", count) : "";
     }
     this.syncCta(count, pendingCount);
     if (this.hold) {
       const securedCount = heldCount || this.hold.seats?.length || 0;
       if (this.els.holdTitle) {
-        this.els.holdTitle.textContent = `${securedCount} secured`;
+        this.els.holdTitle.textContent = t2("picker.securedCount", { count: securedCount });
       }
       if (this.els.holdCopy) {
         this.holdCopyPending = pendingCount > 0;
-        this.els.holdCopy.textContent = pendingCount ? `${pendingCount} more selected` : this.holdReassuranceText();
+        this.els.holdCopy.textContent = pendingCount ? t2("picker.moreSelectedCount", { count: pendingCount }) : this.holdReassuranceText();
       }
       const change = this.els.holdChange;
       if (change) {
         change.disabled = this.releasingHold;
-        change.textContent = this.releasingHold ? "Releasing\u2026" : "Change";
+        change.textContent = this.releasingHold ? this.tf("picker.releasingEllipsis", "Releasing\u2026") : this.tf("picker.change", "Change");
       }
     }
     if (count !== previousCount) this.animateOnce(this.els.count, "sl-value-pop", 380);
@@ -6213,21 +6379,21 @@ var SeatPicker = class _SeatPicker {
   renderPeek(count, total, pendingCount) {
     if (!this.els.peek) return;
     if (count && this.ctaPhase === "holding") {
-      this.els.peek.innerHTML = `<span>Securing your seats\u2026</span>`;
+      this.els.peek.innerHTML = `<span>${this.tf("picker.securingSeats", "Securing your seats\u2026")}</span>`;
       return;
     }
     if (count && this.ctaPhase === "checkout") {
-      this.els.peek.innerHTML = `<span>\u2713 ${count} ${count === 1 ? "ticket" : "tickets"} secured \xB7 ${this.money(total)} \u2014 you won\u2019t be charged yet</span>`;
+      this.els.peek.innerHTML = `<span>${t2("picker.peekSecured", { count, total: this.money(total) })}</span>`;
       return;
     }
     if (count) {
-      const holding = !!this.hold && !pendingCount;
-      this.els.peek.innerHTML = `<span>${count} ${count === 1 ? "ticket" : "tickets"} \xB7 ${this.money(total)}</span><button type="button" class="go sl-sheet-go" data-act="${holding ? "checkout" : "open"}">${this.hold ? pendingCount ? "Secure more" : "Continue" : "Review"}</button>`;
+      const toCheckout = !!this.hold;
+      this.els.peek.innerHTML = `<span>${tCount("picker.peekTicketsTotal", count, { total: this.money(total) })}</span><button type="button" class="go sl-sheet-go" data-act="${toCheckout ? "checkout" : "open"}">${this.hold ? pendingCount ? this.tf("picker.secureMore", "Secure more") : this.tf("picker.continue", "Continue") : this.tf("picker.review", "Review")}</button>`;
     } else if (this.salesClosed) {
       this.els.peek.innerHTML = `<span>${this.tf("picker.salesClosedPill", "Sales are closed")}</span>`;
     } else {
       const prices = (this.controller.doc?.categories ?? []).map((c) => this.catPrice(c)).filter((p) => p != null);
-      this.els.peek.innerHTML = (prices.length ? `<span>From ${this.money(Math.min(...prices))}</span>` : "<span>Pick your seats</span>") + `<button type="button" class="go sl-sheet-go" data-act="open">\u2726 Best seats</button>`;
+      this.els.peek.innerHTML = (prices.length ? `<span>${t2("picker.peekFromPrice", { price: this.money(Math.min(...prices)) })}</span>` : `<span>${this.tf("picker.pickYourSeats", "Pick your seats")}</span>`) + `<button type="button" class="go sl-sheet-go" data-act="open">${this.tf("picker.bestSeatsStar", "\u2726 Best seats")}</button>`;
     }
   }
   async removeHeldLabel(label, chip) {
@@ -6240,7 +6406,7 @@ var SeatPicker = class _SeatPicker {
       const preserveAcrossNavigation = this.handedOff;
       const released = await this.controller.releaseLabels([label]);
       if (!released) {
-        this.toast(`Couldn't remove ${label}. Your hold is unchanged.`, "error");
+        this.toast(t2("picker.couldNotRemoveLabel", { label }), "error");
         return false;
       }
       const remaining = this.controller.currentHold();
@@ -6256,7 +6422,7 @@ var SeatPicker = class _SeatPicker {
       }
       this.syncTray();
       this.emitHoldChange();
-      this.toast(`${label} removed from your hold.`, "success");
+      this.toast(t2("picker.labelRemovedFromHold", { label }), "success");
       return true;
     } finally {
       this.releasingLabels.delete(label);
@@ -6270,23 +6436,23 @@ var SeatPicker = class _SeatPicker {
     const button = this.els.holdChange;
     if (button) {
       button.disabled = true;
-      button.textContent = "Releasing\u2026";
+      button.textContent = this.tf("picker.releasingEllipsis", "Releasing\u2026");
     }
     try {
       await this.release();
-      if (!this.hold) this.toast("Held tickets released. Choose your new seats.", "success");
+      if (!this.hold) this.toast(this.tf("picker.heldTicketsReleased", "Held tickets released. Choose your new seats."), "success");
     } finally {
       this.releasingHold = false;
       if (button?.isConnected) {
         button.disabled = false;
-        button.textContent = "Change";
+        button.textContent = this.tf("picker.change", "Change");
       }
     }
   }
   async handleCta() {
     if (this.salesClosed) return;
     if (this.totalTicketCount() > this.maxTickets) {
-      this.toast(`Remove tickets until your order has ${this.maxTickets} or fewer.`, "warning");
+      this.toast(t2("picker.removeTicketsUntilOrFewer", { count: this.maxTickets }), "warning");
       return;
     }
     const committed = this.committedSelection();
@@ -6312,7 +6478,7 @@ var SeatPicker = class _SeatPicker {
         hold = h ? { holdId: h.holdId, expiresAt: h.expiresAt, seats: h.seats, items: h.items } : hold;
       }
       if (!hold) {
-        this.toast("One or more seats were just taken. Please pick again.", "error");
+        this.toast(this.tf("picker.seatsJustTaken", "One or more seats were just taken. Please pick again."), "error");
         this.setCtaPhase("idle");
         this.syncTray();
         return;
@@ -6329,7 +6495,7 @@ var SeatPicker = class _SeatPicker {
       const problem = err;
       const labels = (problem.conflicts ?? []).map((conflict) => conflict.label).filter(Boolean).slice(0, 3);
       if (problem.reason === "event_closed") this.setSalesClosed(true);
-      const message = problem.reason === "event_closed" ? "Seat sales have closed for this event." : labels.length ? `${labels.join(", ")} ${labels.length === 1 ? "is" : "are"} no longer available. Choose another ${labels.length === 1 ? "seat" : "group"}.` : "One or more seats were just taken. Please pick again.";
+      const message = problem.reason === "event_closed" ? this.tf("picker.seatSalesClosedForEvent", "Seat sales have closed for this event.") : labels.length ? labels.length === 1 ? t2("picker.labelsNoLongerAvailable.one", { labels: labels.join(", ") }) : t2("picker.labelsNoLongerAvailable.other", { labels: labels.join(", ") }) : this.tf("picker.seatsJustTaken", "One or more seats were just taken. Please pick again.");
       this.toast(message, "error");
       this.setCtaPhase("idle");
     } finally {
@@ -6343,14 +6509,14 @@ var SeatPicker = class _SeatPicker {
     const ms = Math.max(0, this.holdExpiresAt - Date.now());
     const m = Math.floor(ms / 6e4);
     const s = String(Math.floor(ms % 6e4 / 1e3)).padStart(2, "0");
-    return `Yours for ${m}:${s} \u2014 you won\u2019t be charged yet.`;
+    return t2("picker.holdReassurance", { time: `${m}:${s}` });
   }
   startHoldTimer(expiresAt) {
     this.stopHoldTimer();
     this.holdExpiresAt = expiresAt;
     if (this.hold) this.rememberHold(this.hold);
     const pill = this.els.hold;
-    pill.innerHTML = '<span class="sl-hold-dot" aria-hidden="true"></span><span>Held</span><span class="sl-hold-time" data-ref="holdTime"></span>';
+    pill.innerHTML = `<span class="sl-hold-dot" aria-hidden="true"></span><span>${this.tf("picker.held", "Held")}</span><span class="sl-hold-time" data-ref="holdTime"></span>`;
     const time = pill.querySelector('[data-ref="holdTime"]');
     this.els.holdNote?.classList.add("on");
     const tick = () => {
@@ -6383,7 +6549,7 @@ var SeatPicker = class _SeatPicker {
       const totalSecs = Math.ceil(ms / 1e3);
       const m = Math.floor(totalSecs / 60);
       const s = String(totalSecs % 60).padStart(2, "0");
-      this.els.extendTxt.innerHTML = `Your seats are held for <b>${m}:${s}</b>. Need more time?`;
+      this.els.extendTxt.innerHTML = t2("picker.seatsHeldForNeedMoreTime", { time: `${m}:${s}` });
       this.extendEl.classList.add("on");
     } else {
       this.extendEl.classList.remove("on");
@@ -6393,7 +6559,7 @@ var SeatPicker = class _SeatPicker {
     const btn = this.els.extendBtn;
     btn.disabled = true;
     const prev = btn.textContent;
-    btn.textContent = "Adding\u2026";
+    btn.textContent = this.tf("picker.addingEllipsis", "Adding\u2026");
     try {
       const h = await this.controller.extendHold(this.opts.holdTtlMs);
       if (h) {
@@ -6402,13 +6568,13 @@ var SeatPicker = class _SeatPicker {
         this.extendEl?.classList.remove("on");
         this.rememberHold(this.hold);
         this.emitHoldChange();
-        this.toast("More time added \u2014 your seats are still held.", "success");
+        this.toast(this.tf("picker.moreTimeAdded", "More time added \u2014 your seats are still held."), "success");
       } else {
-        this.toast("Couldn't add more time \u2014 please head to checkout now.", "warning");
+        this.toast(this.tf("picker.couldNotAddMoreTime", "Couldn't add more time \u2014 please head to checkout now."), "warning");
       }
     } catch (err) {
       this.opts.onError?.(err);
-      this.toast("Couldn't add more time \u2014 please head to checkout now.", "warning");
+      this.toast(this.tf("picker.couldNotAddMoreTime", "Couldn't add more time \u2014 please head to checkout now."), "warning");
     } finally {
       btn.disabled = false;
       btn.textContent = prev;
@@ -6435,7 +6601,7 @@ var SeatPicker = class _SeatPicker {
     this.forgetHold();
     const n = handoff.lineItems.reduce((sum, i) => sum + i.quantity, 0);
     if (this.els.bookedSub) {
-      this.els.bookedSub.innerHTML = `<span class="sl-booked-seats">${n} ${n === 1 ? "ticket" : "tickets"}</span> confirmed. A confirmation is on its way.`;
+      this.els.bookedSub.innerHTML = `<span class="sl-booked-seats">${tCount("picker.ticketsCount", n)}</span> ${this.tf("picker.confirmedAndOnWay", "confirmed. A confirmation is on its way.")}`;
     }
     this.bookedEl?.classList.add("on");
     this.opts.onBooked?.(handoff);
@@ -6517,7 +6683,7 @@ var SeatPicker = class _SeatPicker {
       ({ mountCheckout } = await loadHostedCheckout());
     } catch (err) {
       this.opts.onError?.(err);
-      this.toast("Checkout could not be opened. Your seats are still held \u2014 please try again.", "error");
+      this.toast(this.tf("picker.checkoutCouldNotBeOpened", "Checkout could not be opened. Your seats are still held \u2014 please try again."), "error");
       this.setCtaPhase("idle");
       return;
     }
@@ -6632,9 +6798,9 @@ var SeatPicker = class _SeatPicker {
   rowTypeWord(details) {
     const authored = details?.displayType?.trim() || details?.rowType?.trim();
     if (authored) return authored;
-    if (details?.objectType === "table") return "Table";
-    if (details?.objectType === "booth") return "Booth";
-    return "Row";
+    if (details?.objectType === "table") return this.tf("picker.table", "Table");
+    if (details?.objectType === "booth") return this.tf("picker.booth", "Booth");
+    return this.tf("picker.row", "Row");
   }
   rowShort(details) {
     const row = details?.rowLabel;
@@ -6657,7 +6823,7 @@ var SeatPicker = class _SeatPicker {
     const isGroupedTable = details.objectType === "table" && !!details.bookingMode;
     const isBooth = details.objectType === "booth";
     const hasLoc = details.sectionLabel || details.rowLabel || details.seatNumber;
-    const grid = isGroupedTable ? `<div class="sl-tip-grid"><div class="sl-tip-field"><span class="sl-tip-key">${esc(this.rowTypeWord(details))}</span><span class="sl-tip-val">${esc(details.rowLabel ?? details.displayLabel ?? details.label)}</span></div><div class="sl-tip-field"><span class="sl-tip-key">Guests</span><span class="sl-tip-val">${details.bookingMode === "variable" ? `${details.minOccupancy}\u2013${details.maxOccupancy}` : details.capacity}</span></div></div>` : isBooth ? `<div class="sl-tip-grid">` + (details.sectionLabel ? `<div class="sl-tip-field"><span class="sl-tip-key">Section</span><span class="sl-tip-val">${esc(details.sectionLabel)}</span></div>` : "") + `<div class="sl-tip-field"><span class="sl-tip-key">${esc(this.rowTypeWord(details))}</span><span class="sl-tip-val">${esc(details.rowLabel ?? details.displayLabel ?? details.label)}</span></div></div>` : hasLoc ? `<div class="sl-tip-grid">` + (details.sectionLabel ? `<div class="sl-tip-field"><span class="sl-tip-key">Section</span><span class="sl-tip-val">${esc(details.sectionLabel)}</span></div>` : "") + (details.rowLabel ? `<div class="sl-tip-field"><span class="sl-tip-key">${esc(this.rowTypeWord(details))}</span><span class="sl-tip-val">${esc(this.rowShort(details))}</span></div>` : "") + (details.seatNumber ? `<div class="sl-tip-field"><span class="sl-tip-key">Seat</span><span class="sl-tip-val">${esc(details.seatNumber)}</span></div>` : "") + `</div>` : `<div class="sl-tip-grid one"><div class="sl-tip-field"><span class="sl-tip-key">Seat</span><span class="sl-tip-val">${esc(details.displayLabel ?? details.label)}</span></div></div>`;
+    const grid = isGroupedTable ? `<div class="sl-tip-grid"><div class="sl-tip-field"><span class="sl-tip-key">${esc(this.rowTypeWord(details))}</span><span class="sl-tip-val">${esc(details.rowLabel ?? details.displayLabel ?? details.label)}</span></div><div class="sl-tip-field"><span class="sl-tip-key">${this.tf("picker.guests", "Guests")}</span><span class="sl-tip-val">${details.bookingMode === "variable" ? `${details.minOccupancy}\u2013${details.maxOccupancy}` : details.capacity}</span></div></div>` : isBooth ? `<div class="sl-tip-grid">` + (details.sectionLabel ? `<div class="sl-tip-field"><span class="sl-tip-key">${this.tf("picker.section", "Section")}</span><span class="sl-tip-val">${esc(details.sectionLabel)}</span></div>` : "") + `<div class="sl-tip-field"><span class="sl-tip-key">${esc(this.rowTypeWord(details))}</span><span class="sl-tip-val">${esc(details.rowLabel ?? details.displayLabel ?? details.label)}</span></div></div>` : hasLoc ? `<div class="sl-tip-grid">` + (details.sectionLabel ? `<div class="sl-tip-field"><span class="sl-tip-key">${this.tf("picker.section", "Section")}</span><span class="sl-tip-val">${esc(details.sectionLabel)}</span></div>` : "") + (details.rowLabel ? `<div class="sl-tip-field"><span class="sl-tip-key">${esc(this.rowTypeWord(details))}</span><span class="sl-tip-val">${esc(this.rowShort(details))}</span></div>` : "") + (details.seatNumber ? `<div class="sl-tip-field"><span class="sl-tip-key">${this.tf("picker.seat", "Seat")}</span><span class="sl-tip-val">${esc(details.seatNumber)}</span></div>` : "") + `</div>` : `<div class="sl-tip-grid one"><div class="sl-tip-field"><span class="sl-tip-key">${this.tf("picker.seat", "Seat")}</span><span class="sl-tip-val">${esc(details.displayLabel ?? details.label)}</span></div></div>`;
     const statusLine = details.status === "free" ? "" : `<div class="sl-tip-status">${details.status === "held" ? t2("map.statusHeld") : t2("map.statusTaken")}</div>`;
     const limited = this.limitedViewLabel(details.commercial);
     const cxLine = limited ? `<div class="sl-tip-cx"><span class="g" aria-hidden="true">\u25D0</span>${esc(limited)}</div>` : "";
@@ -6948,7 +7114,7 @@ var SeatPicker = class _SeatPicker {
     const identity = details?.displayLabel ?? seat.displayLabel ?? seat.label;
     const section = details?.sectionLabel;
     const row = this.rowShort(details);
-    const location2 = [section, row ? `Row ${row}` : null, identity].filter(Boolean).join(" \xB7 ");
+    const location2 = [section, row ? t2("picker.rowLabel", { label: row }) : null, identity].filter(Boolean).join(" \xB7 ");
     const copy = status === "held" ? {
       title: this.tf("picker.temporarilyHeld", "Temporarily held"),
       message: this.tf("picker.heldSeatExplanation", "Another buyer is holding this seat. It may become available again.")
@@ -7044,7 +7210,7 @@ var SeatPicker = class _SeatPicker {
       chip = document.createElement("div");
       chip.className = "sl-view3d-compare-saved";
       chip.setAttribute("role", "group");
-      chip.setAttribute("aria-label", "Saved seat comparison");
+      chip.setAttribute("aria-label", this.tf("picker.savedSeatComparison", "Saved seat comparison"));
       const main2 = document.createElement("button");
       main2.type = "button";
       main2.className = "main";
@@ -7056,7 +7222,7 @@ var SeatPicker = class _SeatPicker {
       clear.type = "button";
       clear.className = "clear";
       clear.textContent = "\xD7";
-      clear.setAttribute("aria-label", "Clear saved seat comparison");
+      clear.setAttribute("aria-label", this.tf("picker.clearSavedSeatComparison", "Clear saved seat comparison"));
       clear.addEventListener("click", () => this.clearView3dComparison());
       chip.append(main2, clear);
       overlay.appendChild(chip);
@@ -7065,8 +7231,8 @@ var SeatPicker = class _SeatPicker {
     const count = this.view3dCompareSeatIds.length;
     const main = chip.querySelector(".main");
     if (main) {
-      main.textContent = count > 1 ? `Compare ${count}` : "1 seat saved";
-      main.setAttribute("aria-label", count > 1 ? `Open comparison of ${count} seats` : "One seat saved; choose another to compare");
+      main.textContent = count > 1 ? t2("picker.compareCount", { count }) : this.tf("picker.oneSeatSaved", "1 seat saved");
+      main.setAttribute("aria-label", count > 1 ? t2("picker.openComparisonOfSeats", { count }) : this.tf("picker.oneSeatSavedChooseAnother", "One seat saved; choose another to compare"));
     }
   }
   view3dComparisonSnapshot(seatId) {
@@ -7343,8 +7509,7 @@ var SeatPicker = class _SeatPicker {
     const wantFloors = floors.length > 1;
     const wantZones = zones.length > 1;
     const wantSections = sections.length > 1;
-    const wantLocator = allSections.length > 0 && handle.rows().length > 0;
-    if (!wantFloors && !wantZones && !wantSections && !wantLocator) return;
+    if (!wantFloors && !wantZones && !wantSections) return;
     const nav = document.createElement("div");
     nav.className = "sl-view3d-nav";
     const finderToggle = document.createElement("button");
@@ -7354,7 +7519,7 @@ var SeatPicker = class _SeatPicker {
     const setFinderOpen = (open) => {
       nav.classList.toggle("is-open", open);
       finderToggle.setAttribute("aria-expanded", String(open));
-      finderToggle.textContent = open ? "Close seat finder" : "Find a seat";
+      finderToggle.textContent = open ? this.tf("picker.closeVenueNav", "Close") : wantFloors && (wantZones || wantSections) ? this.tf("picker.levelsAndAreas", "Levels & areas") : wantFloors ? this.tf("picker.levels", "Levels") : this.tf("picker.areas", "Areas");
     };
     finderToggle.addEventListener("click", () => setFinderOpen(!nav.classList.contains("is-open")));
     nav.addEventListener("keydown", (event) => {
@@ -7391,7 +7556,7 @@ var SeatPicker = class _SeatPicker {
         row.appendChild(b);
       };
       add(this.tf("picker.allLevels", "All levels"), null);
-      for (const f of floors) add(f.label || `Level ${f.index + 1}`, f.index);
+      for (const f of floors) add(f.label || t2("picker.levelNumber", { number: f.index + 1 }), f.index);
       nav.appendChild(row);
     }
     if (wantZones || wantSections) {
@@ -7434,86 +7599,6 @@ var SeatPicker = class _SeatPicker {
       }
       nav.appendChild(row);
     }
-    if (wantLocator) {
-      const locator = document.createElement("div");
-      locator.className = "sl-view3d-locator";
-      locator.setAttribute("role", "group");
-      locator.setAttribute("aria-label", "Find an exact seat in 3D");
-      const sectionSelect = document.createElement("select");
-      sectionSelect.setAttribute("aria-label", "Choose section in 3D");
-      const rowSelect = document.createElement("select");
-      rowSelect.setAttribute("aria-label", "Choose row in 3D");
-      const seatSelect = document.createElement("select");
-      seatSelect.setAttribute("aria-label", "Choose seat in 3D");
-      const view = document.createElement("button");
-      view.type = "button";
-      view.textContent = "Inspect seat";
-      view.disabled = true;
-      const fill = (select, placeholder, entries) => {
-        select.replaceChildren();
-        const first = document.createElement("option");
-        first.value = "";
-        first.textContent = placeholder;
-        select.appendChild(first);
-        for (const entry of entries) {
-          const option = document.createElement("option");
-          option.value = entry.id;
-          option.textContent = entry.label;
-          select.appendChild(option);
-        }
-        select.value = "";
-      };
-      fill(sectionSelect, "1. Section", allSections.map((section) => ({
-        id: section.id,
-        label: `${section.label} \xB7 ${section.seatCount.toLocaleString()} seats`
-      })));
-      fill(rowSelect, "2. Row", []);
-      fill(seatSelect, "3. Seat", []);
-      rowSelect.disabled = true;
-      seatSelect.disabled = true;
-      sectionSelect.addEventListener("change", () => {
-        const sectionId = sectionSelect.value;
-        view.disabled = true;
-        fill(seatSelect, "3. Seat", []);
-        seatSelect.disabled = true;
-        if (!sectionId || !handle.focusSection(sectionId)) {
-          fill(rowSelect, "2. Row", []);
-          rowSelect.disabled = true;
-          return;
-        }
-        const rows = handle.rows(sectionId);
-        fill(rowSelect, "2. Row", rows.map((row) => ({
-          id: row.id,
-          label: `${row.label} \xB7 ${row.seatCount} seats`
-        })));
-        rowSelect.disabled = rows.length === 0;
-      });
-      rowSelect.addEventListener("change", () => {
-        const rowId = rowSelect.value;
-        view.disabled = true;
-        if (!rowId || !handle.focusRow(rowId)) {
-          fill(seatSelect, "3. Seat", []);
-          seatSelect.disabled = true;
-          return;
-        }
-        const seats = handle.seatsInRow(rowId);
-        fill(seatSelect, "3. Seat", seats);
-        seatSelect.disabled = seats.length === 0;
-      });
-      seatSelect.addEventListener("change", () => {
-        const seatId = seatSelect.value;
-        view.disabled = !seatId;
-      });
-      view.addEventListener("click", () => {
-        const seatId = seatSelect.value;
-        if (seatId) {
-          setFinderOpen(false);
-          this.onView3dSeatPick(seatId);
-        }
-      });
-      locator.append(sectionSelect, rowSelect, seatSelect, view);
-      nav.appendChild(locator);
-    }
     overlay.appendChild(nav);
   }
   async enter3d(flySeatId) {
@@ -7529,7 +7614,7 @@ var SeatPicker = class _SeatPicker {
     const overlay = document.createElement("div");
     overlay.className = "sl-view3d";
     overlay.setAttribute("role", "group");
-    overlay.setAttribute("aria-label", "Interactive 3D venue view");
+    overlay.setAttribute("aria-label", this.tf("picker.interactive3dVenueView", "Interactive 3D venue view"));
     const back = document.createElement("button");
     back.type = "button";
     back.className = "sl-view3d-back";
@@ -7555,7 +7640,7 @@ var SeatPicker = class _SeatPicker {
     fullscreen.type = "button";
     fullscreen.className = "sl-view3d-fs";
     fullscreen.textContent = "\u26F6";
-    fullscreen.setAttribute("aria-label", "Full screen");
+    fullscreen.setAttribute("aria-label", this.tf("picker.fullScreen", "Full screen"));
     fullscreen.setAttribute("aria-pressed", String(!!document.fullscreenElement || this.fsFallback || this.framedFs));
     fullscreen.addEventListener("click", () => this.toggleFullscreen());
     overlay.appendChild(fullscreen);
@@ -7592,7 +7677,7 @@ var SeatPicker = class _SeatPicker {
         onSeatInspect: (id) => this.onView3dSeatPick(id),
         onSectionFocusChange: (sectionId) => {
           const select = overlay.querySelector(
-            'select[aria-label="Choose section in 3D"]'
+            'select[data-locator="section"]'
           );
           const next = sectionId ?? "";
           if (!select || select.value === next) return;
@@ -7689,7 +7774,7 @@ var SeatPicker = class _SeatPicker {
     if (button) {
       button.disabled = true;
       button.classList.add("sl-busy");
-      button.innerHTML = '<span class="sl-ba-spin" aria-hidden="true"></span>Finding\u2026';
+      button.innerHTML = `<span class="sl-ba-spin" aria-hidden="true"></span>${this.tf("picker.findingEllipsis", "Finding\u2026")}`;
     }
     try {
       const h = await this.controller.bestAvailable(qty, categoryKey, { ...opts, ttlMs: this.opts.holdTtlMs });
@@ -7711,7 +7796,7 @@ var SeatPicker = class _SeatPicker {
     } catch (err) {
       this.opts.onError?.(err);
       const reason = err?.reason;
-      const message = reason === "not_enough_together" ? `We couldn't find ${qty} seats together. Try fewer seats or another ticket type.` : reason === "sold_out" ? "That ticket type is sold out. Try another ticket type." : reason === "event_closed" ? "Seat sales have closed for this event." : "Those seats are no longer available. Try another quantity or ticket type.";
+      const message = reason === "not_enough_together" ? t2("picker.couldNotFindSeatsTogether", { count: qty }) : reason === "sold_out" ? this.tf("picker.ticketTypeSoldOut", "That ticket type is sold out. Try another ticket type.") : reason === "event_closed" ? this.tf("picker.seatSalesClosedForEvent", "Seat sales have closed for this event.") : this.tf("picker.seatsNoLongerAvailableTryAnother", "Those seats are no longer available. Try another quantity or ticket type.");
       this.toast(message, "error");
       return null;
     } finally {
@@ -7740,7 +7825,7 @@ var SeatPicker = class _SeatPicker {
       }
     }
     if (!released) {
-      this.toast("Couldn't release your tickets. Your hold is unchanged.", "error");
+      this.toast(this.tf("picker.couldNotReleaseTickets", "Couldn't release your tickets. Your hold is unchanged."), "error");
       return;
     }
     this.hold = null;