@primestyleai/tryon 5.10.102 → 5.10.103

package/dist/storefront/primestyle-tryon.js

@@ -10078,12 +10078,13 @@ function parseNum(s) {
   const n2 = parseFloat(s.replace(/[^\d.]/g, ""));
   return isNaN(n2) ? 0 : n2;
 }
-function computeFit(userValue, chartRange) {
+function computeFit(userValue, chartRange, unit) {
   const { min: rMin, max: rMax } = parseRange(chartRange);
   if (rMin === 0 && rMax === 0) return "good";
   const range = rMax - rMin;
   const threshold = range > 0 ? range * 0.5 : rMin * 0.05 || 3;
-  if (userValue >= rMin && userValue <= rMax) return "good";
+  const perfectTol = unit === "cm" ? 2.54 : unit === "mm" ? 25.4 : 1;
+  if (userValue > rMin - perfectTol && userValue < rMax + perfectTol) return "good";
   if (userValue < rMin) {
     const diff2 = rMin - userValue;
     if (diff2 > threshold * 2) return "too-loose";
@@ -10107,12 +10108,13 @@ const SKIP_AREAS_FOR_FIT = /* @__PURE__ */ new Set([
   "altezza",
   "estatura"
 ]);
-function buildFitInfo(matchDetails, poseLines) {
+function buildFitInfo(matchDetails, poseLines, unit) {
   return matchDetails.filter((m2) => !SKIP_AREAS_FOR_FIT.has(m2.measurement.toLowerCase().replace(/\s*\(.*?\)\s*/g, "").trim())).map((m2) => {
     const userNum = parseNum(m2.userValue);
-    const fit = computeFit(userNum, m2.chartRange);
+    const fit = computeFit(userNum, m2.chartRange, unit);
     const info = {
       area: m2.measurement,
+      section: m2.section || void 0,
       fit,
       userValue: userNum || void 0,
       garmentRange: m2.chartRange || void 0
@@ -11328,6 +11330,37 @@ const STYLES$1 = `
     border: 1px solid rgba(33,84,239,0.25); border-radius: 2vw;
     padding: 0.1vw 0.5vw;
   }
+  .ps-tryon-sr-card-v2-rec-pill {
+    align-self: flex-start;
+    font-size: 0.55vw; font-weight: 700; color: var(--ps-accent);
+    text-transform: uppercase; letter-spacing: 0.08em;
+    background: rgba(33, 84, 239, 0.10);
+    border: 1px solid rgba(33, 84, 239, 0.18);
+    border-radius: 2vw;
+    padding: 0.18vw 0.6vw;
+    margin-top: 0.3vw;
+  }
+  .ps-tryon-sr-card-v2-rec-pill.is-overridden {
+    color: #b45309;
+    background: rgba(180, 83, 9, 0.10);
+    border-color: rgba(180, 83, 9, 0.25);
+  }
+  .ps-tryon-sr-card-v2-view {
+    align-self: center;
+    margin-top: 0.4vw;
+    font-size: 0.62vw; font-weight: 600;
+    color: var(--ps-accent);
+    text-transform: uppercase; letter-spacing: 0.06em;
+    display: inline-flex; align-items: center; justify-content: center; gap: 0.2vw;
+    transition: gap 0.2s ease;
+  }
+  .ps-tryon-sr-card-v2:hover .ps-tryon-sr-card-v2-view {
+    gap: 0.4vw;
+  }
+  .ps-tryon-sr-card-v2-view > span {
+    font-size: 0.85vw; line-height: 1; color: var(--ps-accent);
+    transform: translateY(-0.05vw);
+  }
   .ps-tryon-sr-card-v2-img { display: none; }
   .ps-tryon-sr-card-v2-icon {
     position: absolute; bottom: 0.35vw; right: 0.45vw;
@@ -11391,24 +11424,165 @@ const STYLES$1 = `
     filter: blur(8px) brightness(0.5); transform: scale(1.05);
     transition: filter 0.5s ease, transform 0.5s ease;
   }
-  .ps-tryon-v2-processing-label {
-    position: absolute; bottom: 1vw; left: 50%; transform: translateX(-50%);
-    z-index: 5; font-size: 0.7vw; font-weight: 600;
-    color: #fff; letter-spacing: 0.05em;
-    background: rgba(0,0,0,0.72); backdrop-filter: blur(10px);
-    padding: 0.6vw 0.9vw; border-radius: 0.6vw;
-    display: flex; flex-direction: column; align-items: center; gap: 0.5vw;
-    min-width: 14vw;
-    box-shadow: 0 0.4vw 1.5vw rgba(0,0,0,0.35);
+  /* ── Try-on generation badge (left-side overlay during VTO) ── */
+  .ps-tryon-badge {
+    position: absolute; bottom: 16px; left: 16px; right: 16px;
+    z-index: 5;
+    background: #ffffff;
+    border-radius: 14px;
+    padding: 14px 18px;
+    max-width: 420px;
+    box-shadow: 0 8px 28px rgba(20, 30, 60, 0.14), 0 2px 6px rgba(20, 30, 60, 0.08);
+    display: flex; flex-direction: column; gap: 10px;
+    font-family: inherit;
+    pointer-events: none;
+  }
+  .ps-tryon-badge-row {
+    display: flex; align-items: center; gap: 12px;
   }
-  .ps-tryon-v2-processing-label > span:first-child {
-    animation: ps-loading-pulse 2s ease-in-out infinite;
+  .ps-tryon-badge-spinner {
+    display: inline-flex; flex-shrink: 0;
+    animation: ps-tryon-badge-spin 1s linear infinite;
+  }
+  .ps-tryon-badge-title {
+    flex: 1; min-width: 0;
+    font-size: 15px; font-weight: 600; color: #0f172a;
+    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  }
+  .ps-tryon-badge-pct {
+    flex-shrink: 0;
+    background: linear-gradient(135deg, var(--ps-accent) 0%, var(--ps-accent-hover) 100%);
+    color: #fff; font-size: 12px; font-weight: 700;
+    padding: 4px 11px; border-radius: 999px;
+    letter-spacing: 0.02em;
+  }
+  .ps-tryon-badge-bar {
+    height: 5px;
+    background: #eef2f8;
+    border-radius: 999px; overflow: hidden;
+  }
+  .ps-tryon-badge-bar-fill {
+    height: 100%;
+    background: linear-gradient(90deg, var(--ps-accent) 0%, var(--ps-accent-hover) 100%);
+    border-radius: 999px;
+    transition: width 0.3s ease;
+  }
+  .ps-tryon-badge-foot {
+    display: flex; align-items: center; justify-content: space-between; gap: 10px;
+    font-size: 12px; color: #6b7280;
+  }
+  .ps-tryon-badge-status {
+    display: inline-flex; align-items: center; gap: 6px;
+    font-weight: 500;
+    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  }
+  .ps-tryon-badge-status-icon {
+    display: inline-flex; flex-shrink: 0; color: var(--ps-accent);
+  }
+  .ps-tryon-badge-eta {
+    display: inline-flex; align-items: center; gap: 5px;
+    font-weight: 500; flex-shrink: 0;
+  }
+  @keyframes ps-tryon-badge-spin {
+    to { transform: rotate(360deg); }
+  }
+
+  /* ── Product photo strip (single-garment, below the size card) ──
+     Three thumbnails per slide, evenly spaced, auto-advances. Lives at
+     the bottom of the right panel as decoration / entertainment. */
+  .ps-tryon-photo-strip {
+    margin-top: 1vw;
+    display: flex; flex-direction: column; gap: 0.6vw;
+  }
+  .ps-tryon-photo-strip-head {
+    display: flex; align-items: center; justify-content: space-between;
+  }
+  .ps-tryon-photo-strip-badge {
+    color: var(--ps-accent);
+    font-size: 0.7vw; font-weight: 600;
+    display: inline-flex; align-items: center; gap: 0.3vw;
+    letter-spacing: 0.04em; text-transform: uppercase;
+  }
+  .ps-tryon-photo-strip-row {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: 0.6vw;
+    animation: ps-tryon-photo-strip-fade 0.5s ease;
+  }
+  .ps-tryon-photo-strip-cell {
+    position: relative;
+    aspect-ratio: 3 / 4;
+    overflow: hidden;
+    border-radius: 0.5vw;
+    background: #f3f5f9;
+    box-shadow: 0 0.15vw 0.5vw rgba(20, 30, 60, 0.08);
+    transition: transform 0.25s ease;
+  }
+  .ps-tryon-photo-strip-cell:hover {
+    transform: translateY(-0.15vw);
+  }
+  .ps-tryon-photo-strip-cell > img {
+    width: 100%; height: 100%;
+    object-fit: cover;
+    user-select: none;
+    pointer-events: none;
+  }
+  .ps-tryon-photo-strip-dots {
+    display: flex; justify-content: center; align-items: center; gap: 0.3vw;
+    padding-top: 0.2vw;
+  }
+  .ps-tryon-photo-strip-dot {
+    width: 0.3vw; height: 0.3vw; min-width: 4px; min-height: 4px;
+    border-radius: 999px;
+    background: #d6dbe4;
+    transition: background-color 0.3s ease, width 0.3s ease;
+  }
+  .ps-tryon-photo-strip-dot.is-active {
+    background: var(--ps-accent);
+    width: 0.9vw; min-width: 14px;
+  }
+  @keyframes ps-tryon-photo-strip-fade {
+    from { opacity: 0; transform: translateY(0.3vw); }
+    to { opacity: 1; transform: translateY(0); }
+  }
+
+  /* ── No-fit empty state (single-garment, sizing match% < 50%) ── */
+  .ps-tryon-nofit {
+    background: #ffffff;
+    border: 1px solid #eef2f8;
+    border-radius: 1vw;
+    padding: 3vw 2.4vw 2.6vw;
+    text-align: center;
+    display: flex; flex-direction: column; align-items: center;
+    box-shadow: 0 0.4vw 1.2vw rgba(20, 30, 60, 0.05);
+  }
+  .ps-tryon-nofit-icon {
+    width: 4.4vw; height: 4.4vw; min-width: 56px; min-height: 56px;
+    border-radius: 50%;
+    background: #fef2f2;
+    color: #dc2626;
+    display: flex; align-items: center; justify-content: center;
+    margin-bottom: 1.2vw;
+  }
+  .ps-tryon-nofit-icon svg { width: 50%; height: 50%; }
+  .ps-tryon-nofit-title {
+    font-size: 1.15vw; font-weight: 700; color: #0f172a;
+    margin: 0 0 0.7vw;
+    line-height: 1.3;
+    letter-spacing: -0.01em;
+  }
+  .ps-tryon-nofit-sub {
+    font-size: 0.78vw; color: #6b7280;
+    margin: 0 0 2vw;
+    max-width: 22vw;
+    line-height: 1.6;
+  }
+  .ps-tryon-nofit-actions {
+    display: flex; align-items: center; justify-content: space-between;
+    width: 100%; gap: 1vw;
+    padding-top: 1.2vw;
+    border-top: 1px solid #f1f4fa;
   }
-  .ps-tryon-v2-processing-label .ps-tryon-progress-ring-track { stroke: rgba(255,255,255,0.18); }
-  .ps-tryon-v2-processing-label .ps-tryon-progress-ring-fill  { stroke: var(--ps-accent-light); }
-  .ps-tryon-v2-processing-label .ps-tryon-progress-eta        { color: #fff; }
-  .ps-tryon-v2-processing-label .ps-tryon-progress-bar-wrap   { background: rgba(255,255,255,0.18); }
-  .ps-tryon-v2-processing-label .ps-tryon-progress-pct        { color: var(--ps-accent-light); }
 
   /* "I don't know" link */
   .ps-tryon-v2-dontknow {
@@ -18741,133 +18915,6 @@ function MobileBottomTabs({ mode, onSwitchToManual, onSwitchToScan, t: t2 }) {
     )
   ] });
 }
-const TARGET_SECONDS = 22;
-const RING_RADIUS$1 = 38;
-const RING_CIRC = 2 * Math.PI * RING_RADIUS$1;
-function EngagingTryOnView({
-  previewUrl,
-  productMaterial,
-  productDescription,
-  onCancel,
-  variant = "split",
-  t: t2
-}) {
-  const startRef = reactExports.useRef(Date.now());
-  const ringRef = reactExports.useRef(null);
-  const pctRef = reactExports.useRef(null);
-  const statusRef = reactExports.useRef(null);
-  const statuses = [
-    t2("Preparing your image…"),
-    t2("Mapping body landmarks…"),
-    t2("Rendering the garment…"),
-    t2("Refining drape and shadows…"),
-    t2("Almost done — finalizing…")
-  ];
-  reactExports.useEffect(() => {
-    startRef.current = Date.now();
-    const id2 = setInterval(() => {
-      const elapsed = (Date.now() - startRef.current) / 1e3;
-      const pct = Math.min(95, elapsed / TARGET_SECONDS * 100);
-      const val = Math.round(pct);
-      if (pctRef.current) pctRef.current.textContent = `${val}%`;
-      if (ringRef.current) ringRef.current.style.strokeDashoffset = String(RING_CIRC * (1 - pct / 100));
-      if (statusRef.current) {
-        const stepIdx = Math.min(statuses.length - 1, Math.floor(elapsed / TARGET_SECONDS * statuses.length));
-        const desired = statuses[stepIdx];
-        if (statusRef.current.textContent !== desired) statusRef.current.textContent = desired;
-      }
-    }, 200);
-    return () => clearInterval(id2);
-  }, []);
-  const aiFact = t2("Our model is analyzing 150+ body landmarks for the perfect fit");
-  const styleTips = [
-    t2("Match your belt to your shoes — never your pants"),
-    t2("Leave the bottom button of a suit jacket undone"),
-    t2("Cuff a pocket square so it peeks 1–2 cm above the pocket"),
-    t2("Roll sleeves twice for a relaxed, intentional finish"),
-    t2("A tie tip should land at the middle of your belt buckle"),
-    t2("Cufflinks should sit half an inch past the jacket sleeve")
-  ];
-  const [tipIdx, setTipIdx] = reactExports.useState(0);
-  reactExports.useEffect(() => {
-    const s = setInterval(() => setTipIdx((i) => (i + 1) % styleTips.length), 5e3);
-    return () => clearInterval(s);
-  }, []);
-  const garmentLine = productMaterial?.trim() || (productDescription?.trim() ? productDescription.trim().slice(0, 90) + (productDescription.trim().length > 90 ? "…" : "") : null) || t2("Crafted with quality materials for everyday comfort");
-  const Panel = /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-panel", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-head", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "ps-tryon-processing-v2-title", children: t2("Generating Your Look") }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "ps-tryon-processing-v2-sub", children: t2("Our AI is precisely mapping the garment to your unique proportions.") })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-ring-wrap", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 96 96", width: "120", height: "120", "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "48", cy: "48", r: RING_RADIUS$1, className: "ps-tryon-progress-ring-track" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "circle",
-          {
-            ref: ringRef,
-            cx: "48",
-            cy: "48",
-            r: RING_RADIUS$1,
-            className: "ps-tryon-progress-ring-fill",
-            strokeDasharray: RING_CIRC,
-            strokeDashoffset: RING_CIRC
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-ring-text", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { ref: pctRef, className: "ps-tryon-processing-v2-pct", children: "0%" }) })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { ref: statusRef, className: "ps-tryon-processing-v2-status", children: statuses[0] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-sep" }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-section-label", children: t2("WHILE YOU WAIT") }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-cards", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-card", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-icon ps-style", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M9 18h6M10 22h4M12 2a7 7 0 0 0-4 12.7c1 .9 1 1.8 1 2.3v1h6v-1c0-.5 0-1.4 1-2.3A7 7 0 0 0 12 2z" }) }) }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-card-text", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-head", children: t2("Style Tip") }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-body", children: styleTips[tipIdx] }, tipIdx)
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-card", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-icon ps-spotlight", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "12", cy: "12", r: "10" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
-          ] }) }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-card-text", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-head", children: t2("Garment Spotlight") }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-body", children: garmentLine })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-card", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-icon ps-fact", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 2v6M12 16v6M4.93 4.93l4.24 4.24M14.83 14.83l4.24 4.24M2 12h6M16 12h6M4.93 19.07l4.24-4.24M14.83 9.17l4.24-4.24" }) }) }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-card-text", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-head", children: t2("AI Fact") }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-v2-card-body", children: aiFact })
-          ] })
-        ] })
-      ] })
-    ] }),
-    onCancel && /* @__PURE__ */ jsxRuntimeExports.jsx("button", { type: "button", className: "ps-tryon-processing-v2-cancel", onClick: onCancel, children: t2("Cancel Generation") })
-  ] });
-  if (variant === "panel-only") return Panel;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-image", children: [
-      previewUrl && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-processing-blur", style: { backgroundImage: `url(${previewUrl})` } }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: previewUrl, alt: t2("Your photo"), className: "ps-tryon-processing-model" })
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-scan-line" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-scan-overlay" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-processing-v2-badge", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-processing-v2-badge-dot", "aria-hidden": "true" }),
-        t2("ANALYZING BODY MAP")
-      ] })
-    ] }),
-    Panel
-  ] });
-}
 const SKELETON_CONNECTIONS$1 = [
   ["leftShoulder", "rightShoulder"],
   ["leftShoulder", "leftElbow"],
@@ -18953,30 +19000,6 @@ function MobileScanningView({
   onSwitchToManual,
   t: t2
 }) {
-  if (tryOnProcessing) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-msc-root", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        EngagingTryOnView,
-        {
-          previewUrl,
-          productMaterial,
-          productDescription,
-          onCancel: onCancelTryOn,
-          t: t2
-        }
-      ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-bpm-bottom", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        MobileBottomTabs,
-        {
-          mode: "scan",
-          onSwitchToManual,
-          onSwitchToScan: () => {
-          },
-          t: t2
-        }
-      ) })
-    ] });
-  }
   const displayImage = previewUrl || productImage || "";
   const isPhotoMode = !!previewUrl;
   const stages = isPhotoMode ? [
@@ -18996,11 +19019,18 @@ function MobileScanningView({
     const img = e.currentTarget;
     setDims({ w: img.naturalWidth || img.offsetWidth, h: img.naturalHeight || img.offsetHeight });
   };
+  const TOTAL_MS = 6e3;
+  const LAST_HOLD_MS = 1e3;
+  const startRef = reactExports.useRef(Date.now());
   const [stageIdx, setStageIdx] = reactExports.useState(0);
   reactExports.useEffect(() => {
+    const stepMs = (TOTAL_MS - LAST_HOLD_MS) / Math.max(1, stages.length - 1);
     const id2 = setInterval(() => {
-      setStageIdx((i) => (i + 1) % stages.length);
-    }, 1500);
+      const elapsed = Date.now() - startRef.current;
+      const idx = Math.min(stages.length - 1, Math.floor(elapsed / stepMs));
+      setStageIdx((prev) => prev === idx ? prev : idx);
+      if (idx >= stages.length - 1) clearInterval(id2);
+    }, 100);
     return () => clearInterval(id2);
   }, [stages.length]);
   reactExports.useEffect(() => {
@@ -19235,6 +19265,132 @@ function MultiSectionMobile({
     sizeGuide ? null : null
   ] });
 }
+const TARGET_SECONDS = 22;
+function TryOnGenerationBadge({
+  tryOnStartedAt,
+  t: t2
+}) {
+  const [, force] = reactExports.useState(0);
+  reactExports.useEffect(() => {
+    if (tryOnStartedAt == null) return;
+    const id2 = setInterval(() => force((v2) => v2 + 1), 200);
+    return () => clearInterval(id2);
+  }, [tryOnStartedAt]);
+  if (tryOnStartedAt == null) return null;
+  const elapsed = (Date.now() - tryOnStartedAt) / 1e3;
+  const pct = Math.min(95, elapsed / TARGET_SECONDS * 100);
+  const pctRounded = Math.round(pct);
+  const remaining = Math.max(0, TARGET_SECONDS - Math.floor(elapsed));
+  const etaText = elapsed >= TARGET_SECONDS ? t2("almost done") : `~${remaining}s ${t2("left")}`;
+  const statuses = [
+    t2("Preparing your image"),
+    t2("Analyzing body proportions"),
+    t2("Mapping garment to body"),
+    t2("Refining drape and shadows"),
+    t2("Almost done")
+  ];
+  const stepIdx = Math.min(
+    statuses.length - 1,
+    Math.floor(elapsed / TARGET_SECONDS * statuses.length)
+  );
+  const status = statuses[stepIdx];
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-badge", role: "status", "aria-live": "polite", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-badge-row", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-badge-spinner", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { viewBox: "0 0 24 24", width: "22", height: "22", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("defs", { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("linearGradient", { id: "ps-tryon-badge-grad", x1: "0", y1: "0", x2: "1", y2: "1", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("stop", { offset: "0%", stopColor: "#3B82F6" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("stop", { offset: "100%", stopColor: "#2563EB" })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "12", cy: "12", r: "9", fill: "none", stroke: "rgba(59,130,246,0.18)", strokeWidth: "2.4" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "circle",
+          {
+            cx: "12",
+            cy: "12",
+            r: "9",
+            fill: "none",
+            stroke: "url(#ps-tryon-badge-grad)",
+            strokeWidth: "2.4",
+            strokeLinecap: "round",
+            strokeDasharray: "56.5",
+            strokeDashoffset: "38"
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-badge-title", children: t2("Generating your look...") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ps-tryon-badge-pct", children: [
+        pctRounded,
+        "%"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-badge-bar", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-badge-bar-fill", style: { width: `${pctRounded}%` } }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-badge-foot", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ps-tryon-badge-status", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-badge-status-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "6", y1: "10", x2: "6", y2: "14" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "10", y1: "6", x2: "10", y2: "18" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "14", y1: "9", x2: "14", y2: "15" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "18", y1: "11", x2: "18", y2: "13" })
+        ] }) }),
+        status
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ps-tryon-badge-eta", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "svg",
+          {
+            width: "11",
+            height: "11",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "12", cy: "12", r: "10" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("polyline", { points: "12 6 12 12 16 14" })
+            ]
+          }
+        ),
+        etaText
+      ] })
+    ] })
+  ] });
+}
+const PER_SLIDE = 3;
+const CYCLE_MS = 4e3;
+function ProductPhotoCarouselCard({
+  photos,
+  productTitle,
+  t: t2
+}) {
+  const [groupIdx, setGroupIdx] = reactExports.useState(0);
+  const totalGroups = Math.max(1, Math.ceil(photos.length / PER_SLIDE));
+  reactExports.useEffect(() => {
+    if (totalGroups < 2) return;
+    const id2 = setInterval(() => setGroupIdx((v2) => (v2 + 1) % totalGroups), CYCLE_MS);
+    return () => clearInterval(id2);
+  }, [totalGroups]);
+  if (!photos || photos.length === 0) return null;
+  const start = groupIdx * PER_SLIDE;
+  const slide = photos.slice(start, start + PER_SLIDE);
+  while (slide.length < PER_SLIDE && photos.length >= PER_SLIDE) {
+    slide.push(photos[(start + slide.length) % photos.length]);
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-photo-strip", role: "group", "aria-label": t2("Product photos"), children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-photo-strip-head", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ps-tryon-photo-strip-badge", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "11", height: "11", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.4", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "9", cy: "9", r: "2" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" })
+      ] }),
+      t2("Gallery")
+    ] }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-photo-strip-row", children: slide.map((src, i) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-photo-strip-cell", children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src, alt: productTitle || "", draggable: false }) }, `${groupIdx}-${i}`)) }, groupIdx),
+    totalGroups > 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-photo-strip-dots", "aria-hidden": "true", children: Array.from({ length: totalGroups }).map((_, i) => /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `ps-tryon-photo-strip-dot${i === groupIdx ? " is-active" : ""}` }, i)) })
+  ] });
+}
 function garmentIconForSection(name) {
   const n2 = name.toLowerCase();
   if (n2.includes("jacket") || n2.includes("blazer") || n2.includes("coat")) return garmentJacketImg;
@@ -19258,62 +19414,6 @@ const SKELETON_CONNECTIONS = [
   ["rightHip", "rightKnee"],
   ["rightKnee", "rightAnkle"]
 ];
-const TRYON_TARGET_SECONDS = 22;
-const TRYON_RING_RADIUS = 27;
-const TRYON_RING_CIRC = 2 * Math.PI * TRYON_RING_RADIUS;
-function TryOnProgress({ t: t2, isActive }) {
-  const startRef = reactExports.useRef(null);
-  const ringRef = reactExports.useRef(null);
-  const barRef = reactExports.useRef(null);
-  const etaRef = reactExports.useRef(null);
-  const pctRef = reactExports.useRef(null);
-  reactExports.useEffect(() => {
-    if (!isActive) {
-      startRef.current = null;
-      return;
-    }
-    startRef.current = Date.now();
-    const id2 = setInterval(() => {
-      const start = startRef.current || Date.now();
-      const elapsed = (Date.now() - start) / 1e3;
-      const pct = Math.min(95, elapsed / TRYON_TARGET_SECONDS * 100);
-      const val = Math.round(pct);
-      if (barRef.current) barRef.current.style.width = `${val}%`;
-      if (pctRef.current) pctRef.current.textContent = `${val}%`;
-      if (ringRef.current) {
-        ringRef.current.style.strokeDashoffset = String(TRYON_RING_CIRC * (1 - pct / 100));
-      }
-      if (etaRef.current) {
-        const remaining = Math.max(0, TRYON_TARGET_SECONDS - Math.floor(elapsed));
-        etaRef.current.textContent = elapsed >= TRYON_TARGET_SECONDS ? "•••" : `~${remaining}s`;
-      }
-    }, 200);
-    return () => clearInterval(id2);
-  }, [isActive]);
-  if (!isActive) return null;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-progress-wrap", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-progress-ring", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "64", height: "64", viewBox: "0 0 64 64", "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "32", cy: "32", r: TRYON_RING_RADIUS, className: "ps-tryon-progress-ring-track" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "circle",
-          {
-            ref: ringRef,
-            cx: "32",
-            cy: "32",
-            r: TRYON_RING_RADIUS,
-            className: "ps-tryon-progress-ring-fill",
-            strokeDasharray: TRYON_RING_CIRC,
-            strokeDashoffset: TRYON_RING_CIRC
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { ref: etaRef, className: "ps-tryon-progress-eta", children: `~${TRYON_TARGET_SECONDS}s` })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-progress-bar-wrap", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: barRef, className: "ps-tryon-progress-bar-fill" }) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { ref: pctRef, className: "ps-tryon-progress-pct", children: "0%" })
-  ] });
-}
 function FaceOverlay({
   landmarks,
   imgWidth,
@@ -19440,14 +19540,20 @@ function StageCycler({
     { title: t2("MATCHING SIZE"), desc: t2("Comparing your measurements to the size guide.") },
     { title: t2("FINALIZING RESULT"), desc: t2("Almost done — preparing your recommendation.") }
   ];
+  const TOTAL_MS = 6e3;
+  const LAST_HOLD_MS = 1e3;
+  const startRef = reactExports.useRef(Date.now());
   const [idx, setIdx] = reactExports.useState(0);
   reactExports.useEffect(() => {
-    if (sizingDone) return;
+    const stepMs = (TOTAL_MS - LAST_HOLD_MS) / Math.max(1, sizingStages.length - 1);
     const id2 = setInterval(() => {
-      setIdx((i) => Math.min(i + 1, sizingStages.length - 1));
-    }, 900);
+      const elapsed = Date.now() - startRef.current;
+      const next = Math.min(sizingStages.length - 1, Math.floor(elapsed / stepMs));
+      setIdx((prev) => prev === next ? prev : next);
+      if (next >= sizingStages.length - 1) clearInterval(id2);
+    }, 100);
     return () => clearInterval(id2);
-  }, [sizingDone, sizingStages.length]);
+  }, [sizingStages.length]);
   const current = sizingStages[idx] ?? sizingStages[0];
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-msc-stage", style: { alignSelf: "center", marginTop: "auto", marginBottom: "auto" }, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-msc-stage-slot", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-msc-stage-title", children: current.title }),
@@ -19721,19 +19827,11 @@ function SectionDetailView({
   internationalSizes,
   continueLabel,
   renderRaw = false,
-  sectionFound,
-  onSelectForTryOn,
-  onRegenerateTryOn,
-  pendingOverride,
-  retryLoading,
-  retryStartedAt
+  sectionFound
 }) {
   const recSize = sectionResult?.recommendedSize || "";
-  const [selectedSize, setSelectedSize] = reactExports.useState(
-    pendingOverride?.selectedSize && pendingOverride.selectedSize !== (sectionResult?.recommendedSize || "") ? pendingOverride.selectedSize : null
-  );
+  const [selectedSize, setSelectedSize] = reactExports.useState(null);
   const tryOnElapsedS = useElapsedSeconds(tryOnStartedAt ?? null);
-  const retryElapsedS = useElapsedSeconds(retryStartedAt ?? null);
   const unitLblLower = unitLbl.toLowerCase();
   const displayUnitId = unitLblLower.includes("mm") ? "mm" : unitLblLower.includes("cm") ? "cm" : "in";
   const fromUnit = chartUnit || displayUnitId;
@@ -19746,9 +19844,7 @@ function SectionDetailView({
   const countryOptions = internationalSizes ? Object.keys(internationalSizes) : [];
   const [selectedCountry, setSelectedCountry] = reactExports.useState(null);
   const recLength = lengthEntry?.secResult?.recommendedSize || "";
-  const [selectedLength, setSelectedLength] = reactExports.useState(
-    pendingOverride?.selectedLength && pendingOverride.selectedLength !== recLength ? pendingOverride.selectedLength : null
-  );
+  const [selectedLength, setSelectedLength] = reactExports.useState(null);
   const lengthSizes = reactExports.useMemo(() => {
     if (!lengthEntry) return [];
     const sec = lengthEntry.section;
@@ -19975,8 +20071,8 @@ function SectionDetailView({
               const userInColUnit = colIsCm && userIsInches ? +(userNum2 * 2.54).toFixed(1) : !colIsCm && !userIsInches ? +(userNum2 * 2.54).toFixed(1) : userNum2;
               const range2 = rMaxRaw - rMinRaw;
               const threshold2 = range2 > 0 ? range2 * 0.5 : rMinRaw * 0.05 || 3;
-              const tol2 = Math.max((rMaxRaw || rMinRaw) * 5e-3, 0.25);
-              if (userInColUnit >= rMinRaw - tol2 && userInColUnit <= rMaxRaw + tol2) fit2 = "good";
+              const tol = colIsCm ? 2.54 : 1;
+              if (userInColUnit > rMinRaw - tol && userInColUnit < rMaxRaw + tol) fit2 = "good";
               else if (userInColUnit < rMinRaw) {
                 const diff = rMinRaw - userInColUnit;
                 fit2 = diff > threshold2 * 2 ? "too-long" : diff > threshold2 ? "long" : "a-bit-long";
@@ -20009,8 +20105,10 @@ function SectionDetailView({
       const measLower = m2.measurement.toLowerCase();
       const isDirectional = /length|inseam|sleeve|hem|rise/.test(measLower);
       let fit;
-      const tol = Math.max((rMax || rMin) * 0.03, 0.5);
-      if (userNum >= rMin - tol && userNum <= rMax + tol) {
+      const perfectTol = chartUnit === "cm" ? 2.54 : chartUnit === "mm" ? 25.4 : 1;
+      const lowBound = rMin - perfectTol;
+      const highBound = rMax + perfectTol;
+      if (userNum > lowBound && userNum < highBound) {
         fit = "good";
       } else if (isDirectional) {
         const diff = userNum > rMax ? userNum - rMax : rMin - userNum;
@@ -20057,65 +20155,6 @@ function SectionDetailView({
     const start = Math.max(0, Math.min(lengthOptions.length - 3, idx - 1));
     return lengthOptions.slice(start, start + 3);
   })();
-  const autoCommitInitialMount = reactExports.useRef(true);
-  reactExports.useLayoutEffect(() => {
-    if (autoCommitInitialMount.current) {
-      autoCommitInitialMount.current = false;
-      return;
-    }
-    if (!onSelectForTryOn) return;
-    const effSize = displaySize;
-    const effLength = selectedLength || backendLength || "";
-    const hasSizePick = !!selectedSize && selectedSize !== recSize;
-    const hasLengthPick = !!selectedLength && selectedLength !== backendLength;
-    if (!hasSizePick && !hasLengthPick) {
-      onSelectForTryOn(sectionName, null);
-      return;
-    }
-    const mainDetails = sectionResult?.matchDetails || [];
-    const lengthMeasurements = new Set(
-      (lengthEntry?.secResult?.matchDetails || []).map((m2) => m2.measurement.toLowerCase())
-    );
-    const overrideMd = mainDetails.length ? mainDetails.map((m2) => {
-      const measLc = m2.measurement.toLowerCase();
-      if (lengthMeasurements.has(measLc) && lengthEntry) {
-        const sec = lengthEntry.section;
-        const sizeCol = sec.headers.findIndex((h) => /size|length/i.test(h.trim()));
-        const sIdx = sizeCol >= 0 ? sizeCol : 0;
-        const targetCol = sec.headers.findIndex((h) => {
-          const hLc = h.toLowerCase().replace(/\s*\(.*?\)\s*/g, "").trim();
-          return !!hLc && (hLc === measLc || hLc.includes(measLc) || measLc.includes(hLc));
-        });
-        if (targetCol < 0) return m2;
-        const row = sec.rows.find((r2) => cellValFn(r2, sIdx, sec.headers[sIdx]) === effLength);
-        if (!row) return m2;
-        const cell = cellValFn(row, targetCol, sec.headers[targetCol]);
-        return cell ? { ...m2, chartRange: cell } : m2;
-      }
-      const alt = chartRangeFor(m2.measurement, effSize);
-      if (alt?.range) return { ...m2, chartRange: alt.range };
-      return m2;
-    }) : void 0;
-    const label = effLength ? `${effSize} / ${effLength}` : effSize;
-    console.log(`[ps-sdk:auto-commit] section="${sectionName}" label="${label}"`, {
-      selectedSize,
-      selectedLength,
-      recSize,
-      backendLength,
-      overrideMdPreview: overrideMd?.map((m2) => ({
-        area: m2.measurement,
-        userValue: m2.userValue,
-        chartRange: m2.chartRange
-      }))
-    });
-    onSelectForTryOn(sectionName, {
-      sectionName,
-      selectedSize: effSize,
-      selectedLength: hasLengthPick ? effLength : void 0,
-      displayLabel: label,
-      matchDetails: overrideMd
-    });
-  }, [selectedSize, selectedLength]);
   if (isMobileProp) {
     const cleanSectionName = sectionName.replace(/\s*[—–-]\s*.*/g, "");
     const measurementDesc = (area) => {
@@ -20599,169 +20638,7 @@ function SectionDetailView({
             s
           );
         }) })
-      ] }),
-      (onRegenerateTryOn || onSelectForTryOn && (!isRecommended || selectedLength && selectedLength !== backendLength)) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { marginTop: "0.6vw", marginBottom: "0.2vw" }, children: (() => {
-        const effSize = displaySize;
-        const effLength = selectedLength || backendLength || "";
-        const hasLengthPick = !!(selectedLength && selectedLength !== backendLength);
-        const label = effLength ? `${effSize} / ${effLength}` : effSize;
-        const buildOverrideMatchDetails = () => {
-          const mainDetails = sectionResult?.matchDetails || [];
-          if (!mainDetails.length) return void 0;
-          const lengthMeasurements = new Set(
-            (lengthEntry?.secResult?.matchDetails || []).map((m2) => m2.measurement.toLowerCase())
-          );
-          const out = mainDetails.map((m2) => {
-            const measLc = m2.measurement.toLowerCase();
-            if (lengthMeasurements.has(measLc) && lengthEntry) {
-              const numericPick = effLength && !Number.isNaN(parseFloat(effLength)) ? effLength : null;
-              if (numericPick) {
-                return { ...m2, chartRange: numericPick };
-              }
-              const sec = lengthEntry.section;
-              const sizeCol = sec.headers.findIndex((h) => /size|length/i.test(h.trim()));
-              const sIdx = sizeCol >= 0 ? sizeCol : 0;
-              const targetCol = sec.headers.findIndex((h) => {
-                const hLc = h.toLowerCase().replace(/\s*\(.*?\)\s*/g, "").trim();
-                return !!hLc && (hLc === measLc || hLc.includes(measLc) || measLc.includes(hLc));
-              });
-              if (targetCol < 0) return m2;
-              const row = sec.rows.find((r2) => cellValFn(r2, sIdx, sec.headers[sIdx]) === effLength);
-              if (!row) return m2;
-              const cell = cellValFn(row, targetCol, sec.headers[targetCol]);
-              return cell ? { ...m2, chartRange: cell } : m2;
-            }
-            const alt = chartRangeFor(m2.measurement, effSize);
-            if (alt?.range) return { ...m2, chartRange: alt.range };
-            return m2;
-          });
-          if (effLength && Number.isNaN(parseFloat(effLength))) {
-            out.push({
-              measurement: "Length",
-              userValue: "",
-              chartRange: effLength,
-              fit: "good"
-            });
-          }
-          return out;
-        };
-        const isStored = pendingOverride?.selectedSize === effSize;
-        if (onRegenerateTryOn) {
-          const isRegenerating = !!retryLoading;
-          const TARGET_S = 22;
-          const countdownS = isRegenerating ? Math.max(0, TARGET_S - retryElapsedS) : TARGET_S;
-          return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-            "button",
-            {
-              type: "button",
-              "data-ps-regen": "1",
-              disabled: isRegenerating,
-              onClick: () => {
-                const md2 = buildOverrideMatchDetails();
-                onRegenerateTryOn({
-                  sectionName,
-                  selectedSize: effSize,
-                  selectedLength: hasLengthPick ? effLength : void 0,
-                  displayLabel: label,
-                  matchDetails: md2
-                });
-              },
-              style: {
-                width: "100%",
-                padding: "0.55vw 0.8vw",
-                borderRadius: "0.45vw",
-                fontSize: "0.7vw",
-                fontWeight: 700,
-                background: "var(--ps-accent)",
-                color: "#FFFFFF",
-                border: "1.5px solid var(--ps-accent)",
-                cursor: isRegenerating ? "progress" : "pointer",
-                fontFamily: "inherit",
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center",
-                gap: "0.4vw",
-                position: "relative",
-                overflow: "hidden"
-              },
-              children: [
-                isRegenerating && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                  "div",
-                  {
-                    className: "ps-tryon-regen-fill",
-                    "aria-hidden": "true"
-                  },
-                  retryStartedAt ?? "regen"
-                ),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { position: "relative", zIndex: 1 }, children: isRegenerating ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-                  t2("Generating new try-on…"),
-                  " ",
-                  countdownS,
-                  "s"
-                ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-                  t2("Try It On"),
-                  " ",
-                  /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { fontSize: "0.65vw", opacity: 0.9 }, children: [
-                    "(",
-                    label,
-                    ")"
-                  ] })
-                ] }) })
-              ]
-            }
-          );
-        }
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "button",
-          {
-            type: "button",
-            onClick: () => {
-              if (!onSelectForTryOn) return;
-              onSelectForTryOn(sectionName, isStored ? null : {
-                sectionName,
-                selectedSize: effSize,
-                selectedLength: hasLengthPick ? effLength : void 0,
-                displayLabel: label,
-                matchDetails: buildOverrideMatchDetails()
-              });
-            },
-            style: {
-              width: "100%",
-              padding: "0.55vw 0.8vw",
-              borderRadius: "0.45vw",
-              fontSize: "0.7vw",
-              fontWeight: 700,
-              background: isStored ? "var(--ps-accent)" : "transparent",
-              color: isStored ? "#FFFFFF" : "var(--ps-accent)",
-              border: `1.5px ${isStored ? "solid" : "dashed"} var(--ps-accent)`,
-              cursor: "pointer",
-              fontFamily: "inherit",
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              gap: "0.4vw",
-              transition: "background 0.15s, color 0.15s"
-            },
-            children: isStored ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-              t2("Will use this on Try On"),
-              " ",
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { fontSize: "0.65vw", opacity: 0.9 }, children: [
-                "(",
-                label,
-                ") ✓"
-              ] })
-            ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-              t2("Use this for Try On"),
-              " ",
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { fontSize: "0.65vw", opacity: 0.75 }, children: [
-                "(",
-                label,
-                ")"
-              ] })
-            ] })
-          }
-        );
-      })() })
+      ] })
     ] }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", paddingTop: "0.6vw", borderTop: "1px solid rgba(0,0,0,0.06)", flexShrink: 0 }, children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-bp-back-btn", onClick: onBack, type: "button", style: { fontSize: "0.7vw" }, children: [
@@ -20837,15 +20714,13 @@ function SizeResultView({
   sizeGuide,
   resultImageUrl,
   productImage,
+  productImages,
   productTitle,
   productMaterial,
   productDescription,
   sizingUnit,
   setView,
   handleDownload,
-  onRetryWithFit,
-  retryLoading,
-  retryStartedAt,
   selectedFile,
   previewUrl,
   handleFileSelect,
@@ -20864,7 +20739,6 @@ function SizeResultView({
   userHeightCm,
   pendingCustomSizes: pendingCustomSizesProp,
   onPendingCustomSizeChange,
-  onRegenerateTryOn,
   t: t2
 }) {
   const resultUnitRaw = (sizingResult?.unit || sizingUnit || "").toString().toLowerCase();
@@ -20970,9 +20844,6 @@ function SizeResultView({
   const [poseReady, setPoseReady] = reactExports.useState(false);
   const [imgDims, setImgDims] = reactExports.useState({ w: 800, h: 1200 });
   const pendingCustomSizes = pendingCustomSizesProp ?? {};
-  const setPendingCustomSize = (sectionName, override) => {
-    onPendingCustomSizeChange?.(sectionName, override);
-  };
   const handleImgLoad = reactExports.useCallback((e) => {
     const el2 = e.currentTarget;
     if (el2.naturalWidth && el2.naturalHeight) {
@@ -21141,7 +21012,7 @@ function SizeResultView({
     const prettyLength = lengthRec.replace(/\s+/g, " ").trim();
     return `${baseSize} / ${prettyLength}`;
   }, [lengthEntries, allSectionEntries]);
-  const heightLineLabel = reactExports.useMemo(() => {
+  reactExports.useMemo(() => {
     const cm = userHeightCm || 0;
     if (!cm) return "";
     if (unitLbl === "in") {
@@ -21153,8 +21024,8 @@ function SizeResultView({
     return `${Math.round(cm)} cm`;
   }, [userHeightCm, unitLbl]);
   const hasPhoto = !!previewUrl;
-  const isSnapProcessing = hasPhoto && (tryOnProcessing || sizingLoading && !sizingResult);
-  const isSizingOnly = !hasPhoto && sizingLoading && !sizingResult;
+  const isSnapProcessing = hasPhoto && sizingLoading;
+  const isSizingOnly = !hasPhoto && sizingLoading;
   const sizingDone = !!sizingResult;
   const tryOnDone = !!resultImageUrl && !tryOnProcessing;
   const allDone = hasPhoto ? sizingDone && tryOnDone : sizingDone;
@@ -21221,20 +21092,12 @@ function SizeResultView({
             onLoad: handleImgLoad
           }
         ),
-        tryOnProcessing ? /* @__PURE__ */ jsxRuntimeExports.jsx(RegenScanOverlay, { active: true }) : measurementType === "face" || measurementType === "head" ? faceLandmarks && /* @__PURE__ */ jsxRuntimeExports.jsx(FaceOverlay, { landmarks: faceLandmarks, imgWidth: imgDims.w, imgHeight: imgDims.h }) : bodyLandmarks && /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonOverlay, { landmarks: bodyLandmarks, imgWidth: imgDims.w, imgHeight: imgDims.h })
+        measurementType === "face" || measurementType === "head" ? faceLandmarks && /* @__PURE__ */ jsxRuntimeExports.jsx(FaceOverlay, { landmarks: faceLandmarks, imgWidth: imgDims.w, imgHeight: imgDims.h }) : bodyLandmarks && /* @__PURE__ */ jsxRuntimeExports.jsx(SkeletonOverlay, { landmarks: bodyLandmarks, imgWidth: imgDims.w, imgHeight: imgDims.h })
       ] }),
       (() => {
         const isFaceCategory = measurementType === "face" || measurementType === "head";
         isFaceCategory ? measurementType === "head" ? t2("Detecting head") : t2("Detecting face") : t2("Detecting body pose");
-        return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-right-col", style: { display: "flex", alignItems: tryOnProcessing ? "stretch" : "center", justifyContent: "center" }, children: tryOnProcessing ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-          EngagingTryOnView,
-          {
-            productMaterial,
-            productDescription,
-            variant: "panel-only",
-            t: t2
-          }
-        ) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+        return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-right-col", style: { display: "flex", alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
           StageCycler,
           {
             category: isFaceCategory ? measurementType : "body",
@@ -21272,11 +21135,6 @@ function SizeResultView({
                   })(),
                   onBack: () => setActiveSection(null),
                   internationalSizes: entry.secResult?.internationalSizes,
-                  onSelectForTryOn: setPendingCustomSize,
-                  onRegenerateTryOn: isAccessory ? void 0 : resultImageUrl && onRegenerateTryOn ? onRegenerateTryOn : void 0,
-                  retryLoading,
-                  retryStartedAt,
-                  pendingOverride: pendingCustomSizes[entry.name] ?? null,
                   productImage: resultImageUrl || productImage,
                   productTitle,
                   isMobile: true,
@@ -21314,10 +21172,7 @@ function SizeResultView({
             ] });
           }
           return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2-bg", style: { position: "relative" }, children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: resultImageUrl || productImage, alt: productTitle, className: "ps-tryon-v2-bg-img" }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx(RegenScanOverlay, { active: !!retryLoading && !!resultImageUrl })
-            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-v2-bg", style: { position: "relative" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: resultImageUrl || productImage, alt: productTitle, className: "ps-tryon-v2-bg-img" }) }),
             /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2-panel", children: [
               mismatchNotice,
               /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -21339,11 +21194,6 @@ function SizeResultView({
                   })(),
                   onBack: () => setActiveSection(null),
                   internationalSizes: entry.secResult?.internationalSizes,
-                  onSelectForTryOn: setPendingCustomSize,
-                  onRegenerateTryOn: isAccessory ? void 0 : resultImageUrl && onRegenerateTryOn ? onRegenerateTryOn : void 0,
-                  retryLoading,
-                  retryStartedAt,
-                  pendingOverride: pendingCustomSizes[entry.name] ?? null,
                   t: t2
                 }
               )
@@ -21413,11 +21263,8 @@ function SizeResultView({
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2-bg", style: { position: "relative" }, children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: tryOnProcessing && previewUrl ? previewUrl : resultImageUrl || productImage, alt: productTitle, className: "ps-tryon-v2-bg-img", onLoad: handleImgLoad }),
-            tryOnProcessing && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2-processing-label", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: t2("Generating try-on...") }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx(TryOnProgress, { t: t2, isActive: true })
-            ] }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx(RegenScanOverlay, { active: !!retryLoading && !!resultImageUrl && !tryOnProcessing || !!tryOnProcessing }),
+            tryOnProcessing && /* @__PURE__ */ jsxRuntimeExports.jsx(TryOnGenerationBadge, { tryOnStartedAt: tryOnStartedAt ?? null, t: t2 }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(RegenScanOverlay, { active: !!tryOnProcessing }),
             resultImageUrl && !tryOnProcessing && poseReady && poseLines && /* @__PURE__ */ jsxRuntimeExports.jsx(MeasurementOverlay, { lines: poseLines, fitRows: (() => {
               const all = [...sizingResult?.matchDetails || []];
               if (sizingResult?.sections) {
@@ -21483,11 +21330,15 @@ function SizeResultView({
                   /* @__PURE__ */ jsxRuntimeExports.jsx(
                     "span",
                     {
-                      className: "ps-tryon-sr-card-v2-rec",
-                      style: isOverridden ? { color: "#b45309", fontWeight: 600 } : void 0,
-                      children: isOverridden ? t2("your selection · not recommended") : heightLineLabel ? `${t2("recommended")} · ${heightLineLabel}` : t2("recommended")
+                      className: `ps-tryon-sr-card-v2-rec-pill${isOverridden ? " is-overridden" : ""}`,
+                      children: isOverridden ? t2("YOUR SELECTION") : t2("RECOMMENDED")
                     }
-                  )
+                  ),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ps-tryon-sr-card-v2-view", children: [
+                    t2("VIEW DETAILS"),
+                    " ",
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { "aria-hidden": "true", children: "›" })
+                  ] })
                 ] }),
                 sectionImg && /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: sectionImg, alt: name, className: "ps-tryon-sr-card-v2-img" })
               ] }, name);
@@ -21578,11 +21429,6 @@ function SizeResultView({
                   },
                   backLabel: t2("Back"),
                   internationalSizes: sizingResult?.internationalSizes,
-                  onSelectForTryOn: setPendingCustomSize,
-                  onRegenerateTryOn: isAccessory ? void 0 : resultImageUrl && onRegenerateTryOn ? onRegenerateTryOn : void 0,
-                  retryLoading,
-                  retryStartedAt,
-                  pendingOverride: pendingCustomSizes[sectionName] ?? null,
                   onTryOn: resultImageUrl || vtoExcluded ? void 0 : handleSingleTryOn,
                   continueLabel: resultImageUrl ? t2("Continue Shopping") : void 0,
                   tryOnProcessing,
@@ -21612,50 +21458,158 @@ function SizeResultView({
           }
           return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2-bg", style: { position: "relative" }, children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: resultImageUrl || productImage, alt: productTitle, className: "ps-tryon-v2-bg-img", onLoad: handleImgLoad }),
-              resultImageUrl && poseReady && poseLines && /* @__PURE__ */ jsxRuntimeExports.jsx(MeasurementOverlay, { lines: poseLines, fitRows: (sizingResult?.matchDetails || []).map((m2) => ({ area: m2.measurement, userNum: parseFloat(m2.userValue) || 0, chartLabel: m2.chartRange || "", fit: m2.fit })), show: showLines, imgWidth: imgDims.w, imgHeight: imgDims.h }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "img",
+                {
+                  src: tryOnProcessing && previewUrl ? previewUrl : resultImageUrl || productImage,
+                  alt: productTitle,
+                  className: "ps-tryon-v2-bg-img",
+                  onLoad: handleImgLoad
+                }
+              ),
+              tryOnProcessing && /* @__PURE__ */ jsxRuntimeExports.jsx(TryOnGenerationBadge, { tryOnStartedAt: tryOnStartedAt ?? null, t: t2 }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(RegenScanOverlay, { active: !!tryOnProcessing }),
+              resultImageUrl && !tryOnProcessing && poseReady && poseLines && /* @__PURE__ */ jsxRuntimeExports.jsx(MeasurementOverlay, { lines: poseLines, fitRows: (sizingResult?.matchDetails || []).map((m2) => ({ area: m2.measurement, userNum: parseFloat(m2.userValue) || 0, chartLabel: m2.chartRange || "", fit: m2.fit })), show: showLines, imgWidth: imgDims.w, imgHeight: imgDims.h }),
               resultImageUrl && !tryOnProcessing && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { position: "absolute", bottom: "0.5vw", left: "0.5vw", zIndex: 3, display: "flex", flexDirection: "column", gap: "0.3vw" }, children: [
                 !isAccessory && /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "ps-tryon-sr-glass-btn", onClick: () => setShowLines(!showLines), children: showLines ? t2("Hide Fit") : t2("Show Fit") }),
                 /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "ps-tryon-sr-glass-btn", onClick: handleDownload, children: t2("Download") })
-              ] }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx(RegenScanOverlay, { active: !!retryLoading && !!resultImageUrl && !tryOnProcessing })
+              ] })
             ] }),
             /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-v2-panel", children: [
               mismatchNotice,
-              /* @__PURE__ */ jsxRuntimeExports.jsx(
-                SectionDetailView,
-                {
-                  sectionName,
-                  section: singleSection,
-                  sectionResult: singleResult,
-                  sectionFound: sizingResult?.found,
-                  userMeasurements: singleUserMeasurements,
-                  unitLbl,
-                  chartUnit: resultUnit,
-                  lengthEntry: null,
-                  onBack: () => {
-                    if (resultImageUrl) {
-                      onResetTryOn?.();
-                    } else {
-                      setView("body-profile");
+              activeSection === sectionName ? (
+                /* DETAIL VIEW — full size table, same as multi-garment */
+                /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  SectionDetailView,
+                  {
+                    sectionName,
+                    section: singleSection,
+                    sectionResult: singleResult,
+                    sectionFound: sizingResult?.found,
+                    userMeasurements: singleUserMeasurements,
+                    unitLbl,
+                    chartUnit: resultUnit,
+                    lengthEntry: null,
+                    onBack: () => setActiveSection(null),
+                    backLabel: t2("Back"),
+                    internationalSizes: sizingResult?.internationalSizes,
+                    onTryOn: resultImageUrl || vtoExcluded ? void 0 : handleSingleTryOn,
+                    continueLabel: resultImageUrl ? t2("Continue Shopping") : void 0,
+                    tryOnProcessing,
+                    tryOnStartedAt,
+                    t: t2,
+                    renderRaw: isAccessory
+                  }
+                )
+              ) : sizingResult?.found === false ? (
+                /* NO-FIT EMPTY STATE — match% < 50% or backend reports
+                   no valid size. Skip the card + gallery + try-on
+                   entirely so the user gets immediate feedback that
+                   this product doesn't carry their size. */
+                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-nofit", children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-nofit-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "36", height: "36", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "12", cy: "12", r: "10" }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "ps-tryon-nofit-title", children: t2("No size matches your measurements") }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "ps-tryon-nofit-sub", children: t2("This product's size chart doesn't carry a fit close enough to your body. Try another product or update your profile.") }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-nofit-actions", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                      "button",
+                      {
+                        className: "ps-bp-back-btn",
+                        onClick: () => {
+                          if (resultImageUrl) onResetTryOn?.();
+                          else setView("body-profile");
+                        },
+                        type: "button",
+                        children: [
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-bp-back-arrow", children: "←" }),
+                          " ",
+                          t2("Back")
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-tryon-v2-cta", style: { marginTop: 0 }, onClick: onClose, type: "button", children: [
+                      t2("Continue Shopping"),
+                      " →"
+                    ] })
+                  ] })
+                ] })
+              ) : (
+                /* CARD VIEW — clickable summary card + gallery strip */
+                /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "ps-tryon-v2-title", children: t2("Your Perfect Fit") }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "ps-tryon-v2-subtitle", children: t2("Tap the card for detailed breakdown") }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-v2-sep" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ps-tryon-sr-cards-v2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    "button",
+                    {
+                      className: `ps-tryon-sr-card-v2 ps-full${pendingCustomSizes[sectionName] ? " ps-overridden" : ""}`,
+                      onClick: () => setActiveSection(sectionName),
+                      type: "button",
+                      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ps-tryon-sr-card-v2-text", children: [
+                        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-sr-card-v2-label", children: sectionName }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-tryon-sr-card-v2-value", children: pendingCustomSizes[sectionName]?.displayLabel || singleResult.recommendedSize || "—" }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsx(
+                          "span",
+                          {
+                            className: `ps-tryon-sr-card-v2-rec-pill${pendingCustomSizes[sectionName] ? " is-overridden" : ""}`,
+                            children: pendingCustomSizes[sectionName] ? t2("YOUR SELECTION") : t2("RECOMMENDED")
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ps-tryon-sr-card-v2-view", children: [
+                          t2("VIEW DETAILS"),
+                          " ",
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { "aria-hidden": "true", children: "›" })
+                        ] })
+                      ] })
                     }
-                  },
-                  backLabel: t2("Back"),
-                  internationalSizes: sizingResult?.internationalSizes,
-                  onSelectForTryOn: setPendingCustomSize,
-                  onRegenerateTryOn: isAccessory ? void 0 : resultImageUrl && onRegenerateTryOn ? onRegenerateTryOn : void 0,
-                  retryLoading,
-                  retryStartedAt,
-                  pendingOverride: pendingCustomSizes[sectionName] ?? null,
-                  onTryOn: resultImageUrl || vtoExcluded ? void 0 : handleSingleTryOn,
-                  continueLabel: resultImageUrl ? t2("Continue Shopping") : void 0,
-                  tryOnProcessing,
-                  tryOnStartedAt,
-                  t: t2,
-                  renderRaw: isAccessory
-                }
+                  ) }),
+                  productImages && productImages.length >= 2 && /* @__PURE__ */ jsxRuntimeExports.jsx(ProductPhotoCarouselCard, { photos: productImages, productTitle, t: t2 }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginTop: "0.5vw", gap: "0.5vw" }, children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                      "button",
+                      {
+                        className: "ps-bp-back-btn",
+                        onClick: () => {
+                          if (resultImageUrl) onResetTryOn?.();
+                          else setView("body-profile");
+                        },
+                        type: "button",
+                        children: [
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ps-bp-back-arrow", children: "←" }),
+                          " ",
+                          t2("Back")
+                        ]
+                      }
+                    ),
+                    resultImageUrl && !tryOnProcessing ? /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-tryon-v2-cta", style: { marginTop: 0 }, onClick: onClose, children: [
+                      t2("Continue Shopping"),
+                      " →"
+                    ] }) : vtoExcluded ? /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { className: "ps-tryon-v2-cta", style: { marginTop: 0 }, onClick: onClose, children: [
+                      t2("Continue Shopping"),
+                      " →"
+                    ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                      "button",
+                      {
+                        className: "ps-tryon-v2-cta",
+                        style: { marginTop: 0 },
+                        disabled: tryOnProcessing,
+                        onClick: handleSingleTryOn,
+                        type: "button",
+                        children: [
+                          /* @__PURE__ */ jsxRuntimeExports.jsx(CameraIcon$1, { size: 14 }),
+                          " ",
+                          tryOnProcessing ? t2("Processing...") : t2("Try It On")
+                        ]
+                      }
+                    )
+                  ] })
+                ] })
               )
-            ] }, "panel-single")
+            ] }, `panel-single-${activeSection ? "detail" : "card"}`)
           ] });
         })()
       ),
@@ -27696,6 +27650,19 @@ function detectMeasurementType(title) {
   if (/\b(sunglass|sunglasses|eyewear|eyeglasses|glasses|spectacles|optical|goggles|frames|aviator|wayfarer|lens)\b/.test(t2)) return "face";
   return "body";
 }
+function computeMatchScore(recData) {
+  if (!recData) return null;
+  const all = [];
+  for (const m2 of recData.matchDetails ?? []) all.push(m2);
+  if (recData.sections) {
+    for (const sec of Object.values(recData.sections)) {
+      for (const m2 of sec?.matchDetails ?? []) all.push(m2);
+    }
+  }
+  if (all.length === 0) return null;
+  const good = all.filter((r2) => r2.fit === "good" || r2.fit === "a-bit-tight" || r2.fit === "a-bit-loose").length;
+  return Math.round(good / all.length * 100);
+}
 function measurementTypeToVtoCategory(type) {
   if (type === "face") return "sunglasses";
   if (type === "head") return "hat";
@@ -27704,6 +27671,7 @@ function measurementTypeToVtoCategory(type) {
 }
 function PrimeStyleTryonInner({
   productImage,
+  productImages,
   productTitle = "Product",
   productId,
   productDescription,
@@ -27744,9 +27712,7 @@ function PrimeStyleTryonInner({
   const [resultImageUrl, setResultImageUrl] = reactExports.useState(null);
   const [errorMessage, setErrorMessage] = reactExports.useState(null);
   const [dragOver, setDragOver] = reactExports.useState(false);
-  const [retryLoading, setRetryLoading] = reactExports.useState(false);
   const [tryOnStartedAt, setTryOnStartedAt] = reactExports.useState(null);
-  const [retryStartedAt, setRetryStartedAt] = reactExports.useState(null);
   const [activeSection, setActiveSection] = reactExports.useState(null);
   const [pendingCustomSizes, setPendingCustomSizes] = reactExports.useState({});
   const pendingCustomSizesRef = reactExports.useRef({});
@@ -27756,7 +27722,7 @@ function PrimeStyleTryonInner({
   const sizingResultRef = reactExports.useRef(null);
   const sizeGuideRef = reactExports.useRef(null);
   const resultImageUrlRef = reactExports.useRef(null);
-  const setPendingCustomSizeBySection = reactExports.useCallback((sectionName, override) => {
+  reactExports.useCallback((sectionName, override) => {
     setPendingCustomSizes((prev) => {
       const next = { ...prev };
       if (override === null) delete next[sectionName];
@@ -27778,6 +27744,7 @@ function PrimeStyleTryonInner({
   const [estimationDone, setEstimationDone] = reactExports.useState(false);
   const [tryOnProcessing, setTryOnProcessing] = reactExports.useState(false);
   const [sizeGuide, setSizeGuide] = reactExports.useState(null);
+  const noFitFoundRef = reactExports.useRef(false);
   reactExports.useEffect(() => {
     sizingResultRef.current = sizingResult;
   }, [sizingResult]);
@@ -27836,6 +27803,7 @@ function PrimeStyleTryonInner({
   const [faceLandmarks, setFaceLandmarks] = reactExports.useState(null);
   const selectedFileRef = reactExports.useRef(null);
   const modelImageIdRef = reactExports.useRef(null);
+  const autoTryOnFiredRef = reactExports.useRef(false);
   reactExports.useEffect(() => {
     try {
       const key = getApiKey();
@@ -28243,6 +28211,15 @@ function PrimeStyleTryonInner({
     unsubRef.current = null;
   }, []);
   const handleVtoUpdate = reactExports.useCallback((update) => {
+    if (noFitFoundRef.current) {
+      if (update.status === "completed" || update.status === "failed") {
+        completedRef.current = true;
+        cleanupJob();
+        setTryOnProcessing(false);
+        setTryOnStartedAt(null);
+      }
+      return;
+    }
     if (update.status === "completed" && update.imageUrl) {
       setResultImageUrl((prev) => {
         if (!prev || prev.startsWith("data:")) return update.imageUrl;
@@ -28425,11 +28402,15 @@ function PrimeStyleTryonInner({
     }
     setEstimationDone(false);
     try {
+      const tReq = Date.now();
+      const payloadBytes = JSON.stringify(payload).length;
+      console.log(`[ps-sdk:T] ▶ POST /sizing/recommend (quick) payload=${Math.round(payloadBytes / 1024)}KB bodyImage=${!!payload.bodyImage}`);
       const res = await fetch(`${baseUrl}/api/v1/sizing/recommend`, {
         method: "POST",
         headers: { "Content-Type": "application/json", Authorization: `Bearer ${key}` },
         body: JSON.stringify(payload)
       });
+      console.log(`[ps-sdk:T] ◀ /sizing/recommend (quick) status=${res.status} roundTrip=${Date.now() - tReq}ms`);
       if (res.ok) {
         const data = await res.json();
         console.log("[PS-SDK] Sizing recommend RESULT:", JSON.stringify(data));
@@ -28565,6 +28546,8 @@ function PrimeStyleTryonInner({
     const objUrl = data.photoFile ? URL.createObjectURL(data.photoFile) : data.photoBase64.startsWith("data:") ? data.photoBase64 : `data:image/jpeg;base64,${data.photoBase64}`;
     setPreviewUrl(objUrl);
     completedRef.current = false;
+    modelImageIdRef.current = null;
+    noFitFoundRef.current = false;
     setTryOnProcessing(false);
     setTryOnStartedAt(null);
     setSizingResult(null);
@@ -28575,12 +28558,12 @@ function PrimeStyleTryonInner({
     const measurementType = detectMeasurementType(productTitle);
     if (measurementType === "face" || measurementType === "head") {
       setFaceLandmarks(null);
-      const minVisible = new Promise((r2) => setTimeout(r2, 4500));
+      const minVisible2 = new Promise((r2) => setTimeout(r2, 4500));
       try {
         const faceResult = await detectFaceMeasurements(objUrl);
         if (!faceResult) {
           console.warn("[ps-sdk] face detection returned no result — likely a full-body photo for a face/head product");
-          await minVisible;
+          await minVisible2;
           const msg = measurementType === "head" ? t2("We couldn't detect your head clearly. Please upload a close-up photo that shows your full head and ears.") : t2("We couldn't detect your face clearly. Please upload a close-up selfie that shows both eyes.");
           setErrorMessage(msg);
           setView("error");
@@ -28608,7 +28591,7 @@ function PrimeStyleTryonInner({
         });
         if (recRes.ok) {
           const recData = await recRes.json();
-          await minVisible;
+          await minVisible2;
           setSizingResult(recData);
           onComplete?.(recData);
           persistResultToProfile(
@@ -28625,12 +28608,12 @@ function PrimeStyleTryonInner({
             { skipBodyEstimate: true }
           );
         } else {
-          await minVisible;
+          await minVisible2;
           setEstimationDone(true);
         }
       } catch (err) {
         console.error("[ps-sdk] face-recommend failed:", err);
-        await minVisible;
+        await minVisible2;
         setEstimationDone(true);
       }
       setSizingLoading(false);
@@ -28700,12 +28683,17 @@ function PrimeStyleTryonInner({
       const jointCount = lmObj ? Object.keys(lmObj).filter((k2) => k2 !== "imageWidth" && k2 !== "imageHeight" && lmObj[k2]).length : 0;
       console.log(`[ps-sdk:debug] payload → bodyLandmarks=${!!lmObj}(${jointCount} joints)`);
     }
+    const minVisible = new Promise((r2) => setTimeout(r2, 6e3));
     try {
+      const tReq = Date.now();
+      const payloadBytes = JSON.stringify(payload).length;
+      console.log(`[ps-sdk:T] ▶ POST /sizing/recommend payload=${Math.round(payloadBytes / 1024)}KB bodyImage=${!!payload.bodyImage} landmarks=${!!payload.bodyLandmarks}`);
       const recRes = await fetch(`${baseUrl}/api/v1/sizing/recommend`, {
         method: "POST",
         headers: { "Content-Type": "application/json", Authorization: `Bearer ${key}` },
         body: JSON.stringify(payload)
       });
+      console.log(`[ps-sdk:T] ◀ /sizing/recommend status=${recRes.status} roundTrip=${Date.now() - tReq}ms`);
       if (recRes.ok) {
         const recData = await recRes.json();
         if (recData?.found === false && recData?.reasoning === "NO_SIZE_CHART") {
@@ -28714,26 +28702,38 @@ function PrimeStyleTryonInner({
           setSizingLoading(false);
           return;
         }
-        setSizingResult(recData);
-        onComplete?.(recData);
-        persistResultToProfile(
-          {
-            gender: data.gender,
-            height: data.height,
-            weight: data.weight,
-            heightUnit: data.heightUnit,
-            weightUnit: data.weightUnit,
-            age: data.age,
-            bodyImage: data.photoBase64
-          },
-          recData
-        );
+        const matchScore = computeMatchScore(recData);
+        const isLowFit = recData?.found === false || matchScore != null && matchScore < 50;
+        if (isLowFit) {
+          console.log(`[ps-sdk:gate] LOW FIT (match=${matchScore ?? "?"}%, found=${recData?.found}) — suppressing try-on`);
+          noFitFoundRef.current = true;
+          setTryOnProcessing(false);
+          setTryOnStartedAt(null);
+          setSizingResult({ ...recData, found: false });
+          onComplete?.({ ...recData, found: false });
+        } else {
+          setSizingResult(recData);
+          onComplete?.(recData);
+          persistResultToProfile(
+            {
+              gender: data.gender,
+              height: data.height,
+              weight: data.weight,
+              heightUnit: data.heightUnit,
+              weightUnit: data.weightUnit,
+              age: data.age,
+              bodyImage: data.photoBase64
+            },
+            recData
+          );
+        }
       } else {
         setEstimationDone(true);
       }
     } catch {
       setEstimationDone(true);
     }
+    await minVisible;
     setSizingLoading(false);
   }, [apiUrl, productImage, productTitle, sizingUnit, weightUnit, sizingCountry, sizeGuide, dynamicFields, persistResultToProfile]);
   snapSubmitRef.current = handleSnapSubmit;
@@ -28757,9 +28757,9 @@ function PrimeStyleTryonInner({
     const isApparel = vtoCategory === "apparel";
     const previewObjUrl = (overrideFile ? null : previewUrl) || URL.createObjectURL(file);
     if (overrideFile || !previewUrl) setPreviewUrl(previewObjUrl);
-    modelPoseRef.current = null;
-    setBodyLandmarks(null);
-    if (isApparel) {
+    if (isApparel && (!modelPoseRef.current || !bodyLandmarks)) {
+      modelPoseRef.current = null;
+      setBodyLandmarks(null);
       detectMeasurementLines(previewObjUrl).then((lines) => {
         modelPoseRef.current = lines;
       }).catch(() => {
@@ -28810,20 +28810,20 @@ function PrimeStyleTryonInner({
         console.log("[ps-sdk:flatten] sizingResult keys:", Object.keys(sizingResult || {}));
         console.log("[ps-sdk:flatten] root matchDetails:", (sizingResult?.matchDetails || []).map((m2) => m2.measurement));
         console.log("[ps-sdk:flatten] sections:", sizingResult?.sections ? Object.keys(sizingResult.sections) : "none");
-        const push = (md2, src) => {
+        const push = (md2, src, section) => {
           if (!md2) return;
           console.log(`[ps-sdk:flatten]   ${src} →`, md2.map((m2) => m2.measurement));
           for (const m2 of md2) {
             const k2 = m2.measurement.toLowerCase().replace(/\s*\(.*?\)\s*/g, "").trim();
             if (seen.has(k2)) continue;
             seen.add(k2);
-            out.push(m2);
+            out.push({ ...m2, section });
           }
         };
-        push(sizingResult?.matchDetails, "root");
+        push(sizingResult?.matchDetails, "root", void 0);
         if (sizingResult?.sections) {
           for (const [secName, sec] of Object.entries(sizingResult.sections)) {
-            push(sec?.matchDetails, `section:${secName}`);
+            push(sec?.matchDetails, `section:${secName}`, secName);
           }
         }
         console.log("[ps-sdk:flatten] final unique:", out.map((m2) => m2.measurement));
@@ -28832,7 +28832,9 @@ function PrimeStyleTryonInner({
       const effectiveMatchDetails = override?.matchDetails && override.matchDetails.length ? override.matchDetails : flattenAllMatchDetails();
       let fitInfo;
       if (isApparel && effectiveMatchDetails.length) {
-        fitInfo = buildFitInfo(effectiveMatchDetails, modelPoseRef.current);
+        const unitRaw = (sizingResult?.unit || sizingUnit || "in").toString().toLowerCase();
+        const unit = unitRaw === "cm" ? "cm" : unitRaw === "mm" ? "mm" : "in";
+        fitInfo = buildFitInfo(effectiveMatchDetails, modelPoseRef.current, unit);
       }
       console.log("[ps-sdk:tryon] fitInfo built", { count: fitInfo?.length || 0, areas: fitInfo?.map((f2) => `${f2.area}(${f2.fit})`) });
       const response = await apiRef.current.submitTryOn(
@@ -28881,167 +28883,19 @@ function PrimeStyleTryonInner({
       onError?.({ message, code });
     }
   }, [selectedFile, productImage, productTitle, sizingResult, onProcessing, onError, handleVtoUpdate]);
-  const handleRetryWithFit = reactExports.useCallback(async (fitInfo, selectedSizeOverride) => {
-    const file = selectedFile || selectedFileRef.current;
-    if (!file || !apiRef.current || !sseRef.current) {
-      console.warn("[ps-sdk:retry] skipping — no file/api/sse", {
-        hasFile: !!file,
-        hasApi: !!apiRef.current,
-        hasSse: !!sseRef.current
-      });
-      return;
-    }
-    console.log("[ps-sdk:retry] starting", { fitInfoCount: fitInfo.length, selectedSizeOverride, fitInfo });
-    setRetryLoading(true);
-    setRetryStartedAt(Date.now());
-    const vtoCategory = measurementTypeToVtoCategory(detectMeasurementType(productTitle));
-    const isApparel = vtoCategory === "apparel";
-    if (isApparel && modelPoseRef.current) {
-      const AREA_MAP = {
-        chest: "chest",
-        bust: "chest",
-        waist: "waist",
-        hips: "hips",
-        hip: "hips"
-      };
-      for (const area of fitInfo) {
-        const key = AREA_MAP[area.area.toLowerCase()];
-        if (key && modelPoseRef.current[key]) {
-          const line = modelPoseRef.current[key];
-          area.y = Math.round(line.y * 1e3) / 1e3;
-          area.x1 = Math.round(line.x1 * 1e3) / 1e3;
-          area.x2 = Math.round(line.x2 * 1e3) / 1e3;
-        }
-      }
-    }
-    try {
-      completedRef.current = false;
-      unsubRef.current?.();
-      if (pollingRef.current) {
-        clearInterval(pollingRef.current);
-        pollingRef.current = null;
-      }
-      const useExistingResult = false;
-      const modelImage = await compressImage(file, { maxDimension: 1024, quality: 0.85 });
-      console.log("[ps-sdk:retry] modelImage source", {
-        useExistingResult,
-        bytes: modelImage.length,
-        isPng: modelImage.startsWith("data:image/png")
-      });
-      const outboundFitInfo = isApparel ? fitInfo : void 0;
-      const response = await apiRef.current.submitTryOn(
-        modelImage,
-        productImage,
-        outboundFitInfo,
-        vtoCategory ?? "apparel",
-        {
-          editFromPrevious: useExistingResult,
-          productId: effectiveProductId,
-          productTitle,
-          productDescription,
-          productMaterial,
-          silhouetteContext: buildSilhouetteContext(sizingResultRef.current, sizeGuideRef.current, selectedSizeOverride),
-          modelImageId: modelImageIdRef.current ?? void 0
-        }
-      );
-      if (response.modelImageId) modelImageIdRef.current = response.modelImageId;
-      unsubRef.current = sseRef.current.onJob(response.jobId, (update) => {
-        if (update.status === "completed" && update.imageUrl) {
-          setResultImageUrl(update.imageUrl);
-          setRetryLoading(false);
-          setRetryStartedAt(null);
-          completedRef.current = true;
-          unsubRef.current?.();
-          unsubRef.current = null;
-          if (pollingRef.current) {
-            clearInterval(pollingRef.current);
-            pollingRef.current = null;
-          }
-        } else if (update.status === "failed") {
-          setRetryLoading(false);
-          setRetryStartedAt(null);
-          completedRef.current = true;
-          unsubRef.current?.();
-          unsubRef.current = null;
-          if (pollingRef.current) {
-            clearInterval(pollingRef.current);
-            pollingRef.current = null;
-          }
-        }
-      });
-      let attempts = 0;
-      pollingRef.current = setInterval(async () => {
-        if (completedRef.current) {
-          if (pollingRef.current) clearInterval(pollingRef.current);
-          pollingRef.current = null;
-          return;
-        }
-        attempts++;
-        if (attempts > 60) {
-          if (pollingRef.current) clearInterval(pollingRef.current);
-          pollingRef.current = null;
-          setRetryLoading(false);
-          setRetryStartedAt(null);
-          return;
-        }
-        try {
-          const status = await apiRef.current.getStatus(response.jobId);
-          if (status.status === "completed" && status.imageUrl) {
-            if (!completedRef.current) {
-              completedRef.current = true;
-              setResultImageUrl(status.imageUrl);
-              setRetryLoading(false);
-              setRetryStartedAt(null);
-              unsubRef.current?.();
-              unsubRef.current = null;
-            }
-            if (pollingRef.current) {
-              clearInterval(pollingRef.current);
-              pollingRef.current = null;
-            }
-          } else if (status.status === "failed") {
-            completedRef.current = true;
-            setRetryLoading(false);
-            setRetryStartedAt(null);
-            if (pollingRef.current) {
-              clearInterval(pollingRef.current);
-              pollingRef.current = null;
-            }
-          }
-        } catch {
-        }
-      }, 3e3);
-    } catch {
-      setRetryLoading(false);
-      setRetryStartedAt(null);
-    }
-  }, [selectedFile, productImage, productTitle]);
-  const handleRegenerateTryOn = reactExports.useCallback((override) => {
-    console.log("[ps-sdk:regen] fired", { sectionName: override.sectionName, override, hasFile: !!selectedFile, hasRefFile: !!selectedFileRef.current });
-    setPendingCustomSizeBySection(override.sectionName, override);
-    const map = { ...pendingCustomSizesRef.current, [override.sectionName]: override };
-    const seen = /* @__PURE__ */ new Set();
-    const merged = [];
-    for (const key of Object.keys(map)) {
-      for (const m2 of map[key].matchDetails || []) {
-        const k2 = m2.measurement.toLowerCase().trim();
-        if (seen.has(k2)) continue;
-        seen.add(k2);
-        merged.push(m2);
-      }
-    }
-    if (!merged.length) {
-      console.warn("[ps-sdk:regen] no matchDetails across any section — cannot rebuild fitInfo");
+  reactExports.useEffect(() => {
+    if (!sizingResult) {
+      autoTryOnFiredRef.current = false;
       return;
     }
-    const fitInfo = buildFitInfo(merged, modelPoseRef.current);
-    const compositeLabel = Object.keys(map).map((s) => {
-      const cleanName = s.replace(/\s*[—–-]\s*.*/g, "").trim();
-      return `${cleanName} ${map[s].displayLabel}`;
-    }).join(", ");
-    console.log("[ps-sdk:regen] merged fitInfo built", { fitInfo, compositeLabel, sections: Object.keys(map) });
-    handleRetryWithFit(fitInfo, compositeLabel);
-  }, [handleRetryWithFit, selectedFile, setPendingCustomSizeBySection]);
+    if (sizingResult.found === false) return;
+    if (noFitFoundRef.current) return;
+    if (autoTryOnFiredRef.current) return;
+    if (tryOnProcessing || resultImageUrl) return;
+    if (!selectedFile && !selectedFileRef.current) return;
+    autoTryOnFiredRef.current = true;
+    handleTryOnSubmit();
+  }, [sizingResult, tryOnProcessing, resultImageUrl, selectedFile, handleTryOnSubmit]);
   const handleDownload = reactExports.useCallback(() => {
     if (!resultImageUrl) return;
     if (resultImageUrl.startsWith("data:")) {
@@ -29483,15 +29337,13 @@ function PrimeStyleTryonInner({
             sizeGuide,
             resultImageUrl,
             productImage,
+            productImages,
             productTitle,
             productMaterial,
             productDescription,
             sizingUnit,
             setView,
             handleDownload,
-            onRetryWithFit: handleRetryWithFit,
-            retryLoading,
-            retryStartedAt,
             selectedFile,
             previewUrl,
             handleFileSelect,
@@ -29504,9 +29356,6 @@ function PrimeStyleTryonInner({
             measurementType: detectMeasurementType(productTitle),
             activeSection,
             setActiveSection,
-            pendingCustomSizes,
-            onPendingCustomSizeChange: setPendingCustomSizeBySection,
-            onRegenerateTryOn: handleRegenerateTryOn,
             onResetTryOn: () => {
               setSelectedFile(null);
               if (previewUrl) URL.revokeObjectURL(previewUrl);