@primestyleai/tryon 3.4.2 → 3.5.1

package/dist/react/index.js

@@ -21,6 +21,22 @@ function lsSet(key, value) {
   } catch {
   }
 }
+const FALLBACK_FIELDS_FEMALE = [
+  { key: "bust", label: "Bust", required: true, unit: "cm", placeholder: "e.g. 88", category: "body" },
+  { key: "waist", label: "Waist", required: true, unit: "cm", placeholder: "e.g. 70", category: "body" },
+  { key: "hips", label: "Hips", required: true, unit: "cm", placeholder: "e.g. 96", category: "body" },
+  { key: "shoulderWidth", label: "Shoulders", required: false, unit: "cm", placeholder: "e.g. 39", category: "body" },
+  { key: "inseam", label: "Inseam", required: false, unit: "cm", placeholder: "e.g. 76", category: "body" },
+  { key: "footLengthCm", label: "Foot length", required: false, unit: "cm", placeholder: "e.g. 24", category: "shoe" }
+];
+const FALLBACK_FIELDS_MALE = [
+  { key: "chest", label: "Chest", required: true, unit: "cm", placeholder: "e.g. 104", category: "body" },
+  { key: "waist", label: "Waist", required: true, unit: "cm", placeholder: "e.g. 84", category: "body" },
+  { key: "shoulderWidth", label: "Shoulders", required: false, unit: "cm", placeholder: "e.g. 46", category: "body" },
+  { key: "sleeveLength", label: "Sleeve", required: false, unit: "cm", placeholder: "e.g. 64", category: "body" },
+  { key: "inseam", label: "Inseam", required: false, unit: "cm", placeholder: "e.g. 81", category: "body" },
+  { key: "footLengthCm", label: "Foot length", required: false, unit: "cm", placeholder: "e.g. 27", category: "shoe" }
+];
 const SIZING_COUNTRIES = [
   { code: "US", label: "United States" },
   { code: "UK", label: "United Kingdom" },
@@ -425,6 +441,12 @@ function PrimeStyleTryonInner({
       }
     }
   }, [onComplete, onError, cleanupJob]);
+  const dynamicFields = useMemo(() => {
+    if (sizeGuide?.found && sizeGuide.requiredFields && sizeGuide.requiredFields.length > 0) {
+      return sizeGuide.requiredFields;
+    }
+    return formGender === "female" ? FALLBACK_FIELDS_FEMALE : FALLBACK_FIELDS_MALE;
+  }, [sizeGuide, formGender]);
   const submitSizing = useCallback(async () => {
     if (!apiRef.current) return;
     const baseUrl = getApiUrl(apiUrl);
@@ -435,10 +457,17 @@ function PrimeStyleTryonInner({
       product: { title: productTitle, description: "", variants: [] }
     };
     if (sizeGuide?.found) payload.sizeGuide = sizeGuide;
+    payload.sizingUnit = sizingUnit;
     if (sizingMethod === "exact") {
-      const m = { gender: formRef.current.gender || "male" };
-      const keys = ["chest", "bust", "waist", "hips", "shoulderWidth", "sleeveLength", "inseam", "neckCircumference", "footLengthCm"];
-      for (const k of keys) {
+      const m = { gender: formRef.current.gender || "male", sizingUnit };
+      const numericKeys = /* @__PURE__ */ new Set();
+      for (const f of dynamicFields) {
+        if (f.unit !== "size" && !["shoeEU", "shoeUS", "shoeUK"].includes(f.key)) numericKeys.add(f.key);
+      }
+      for (const k of ["chest", "bust", "waist", "hips", "shoulderWidth", "sleeveLength", "inseam", "neckCircumference", "footLengthCm"]) {
+        if (formRef.current[k]) numericKeys.add(k);
+      }
+      for (const k of numericKeys) {
         if (formRef.current[k]) m[k] = sizingUnit === "in" ? inToCm(parseFloat(formRef.current[k])) : parseFloat(formRef.current[k]);
       }
       if (formRef.current.shoeEU) m.shoeEU = formRef.current.shoeEU;
@@ -474,7 +503,7 @@ function PrimeStyleTryonInner({
     } finally {
       setSizingLoading(false);
     }
-  }, [apiUrl, sizingMethod, sizingCountry, heightUnit, weightUnit, sizingUnit, sizeGuide, productTitle]);
+  }, [apiUrl, sizingMethod, sizingCountry, heightUnit, weightUnit, sizingUnit, sizeGuide, productTitle, dynamicFields]);
   const handleSubmit = useCallback(async () => {
     if (!selectedFile || !apiRef.current || !sseRef.current) {
       const msg = !apiRef.current ? "Missing NEXT_PUBLIC_PRIMESTYLE_API_KEY" : "No file selected";
@@ -575,6 +604,11 @@ function PrimeStyleTryonInner({
     if (p.shoeUS) fd.shoeUS = p.shoeUS;
     if (p.shoeUK) fd.shoeUK = p.shoeUK;
     if (p.fitPreference) fd.fitPreference = p.fitPreference;
+    if (p.customMeasurements) {
+      for (const [key, value] of Object.entries(p.customMeasurements)) {
+        fd[key] = String(value);
+      }
+    }
     formRef.current = fd;
     setFormGender(fd.gender || "male");
     if (p.country) setSizingCountry(p.country);
@@ -610,6 +644,33 @@ function PrimeStyleTryonInner({
       weightUnit,
       createdAt: Date.now()
     };
+    const KNOWN_PROFILE_KEYS = /* @__PURE__ */ new Set([
+      "chest",
+      "bust",
+      "waist",
+      "hips",
+      "shoulderWidth",
+      "sleeveLength",
+      "inseam",
+      "neckCircumference",
+      "footLengthCm",
+      "shoeEU",
+      "shoeUS",
+      "shoeUK",
+      "fitPreference",
+      "gender",
+      "height",
+      "weight",
+      "heightFeet",
+      "heightInches"
+    ]);
+    const custom = {};
+    for (const [key, val] of Object.entries(formRef.current)) {
+      if (!KNOWN_PROFILE_KEYS.has(key) && val && !isNaN(Number(val))) {
+        custom[key] = parseFloat(val);
+      }
+    }
+    if (Object.keys(custom).length > 0) p.customMeasurements = custom;
     setProfiles((prev) => {
       const idx = prev.findIndex((x) => x.id === id);
       if (idx >= 0) {
@@ -821,7 +882,7 @@ function PrimeStyleTryonInner({
           /* @__PURE__ */ jsx("div", { className: "ps-tryon-choice-icon", children: /* @__PURE__ */ jsx(RulerIcon, { size: 24 }) }),
           /* @__PURE__ */ jsxs("div", { className: "ps-tryon-choice-info", children: [
             /* @__PURE__ */ jsx("div", { className: "ps-tryon-choice-title", children: "Enter my measurements" }),
-            /* @__PURE__ */ jsx("div", { className: "ps-tryon-choice-desc", children: "Chest, waist, hips, shoes & more" })
+            /* @__PURE__ */ jsx("div", { className: "ps-tryon-choice-desc", children: sizeGuide?.requiredFields?.length ? sizeGuide.requiredFields.filter((f) => f.required).slice(0, 3).map((f) => f.label).join(", ") + (sizeGuide.requiredFields.length > 3 ? " & more" : "") : "Chest, waist, hips, shoes & more" })
           ] }),
           /* @__PURE__ */ jsx("span", { className: "ps-tryon-choice-badge", children: "Best accuracy" })
         ] }),
@@ -891,42 +952,77 @@ function PrimeStyleTryonInner({
         setHeightUnit(v === "cm" ? "cm" : "ft");
         setWeightUnit(v === "cm" ? "kg" : "lbs");
       } }) }),
-      sizingMethod === "exact" ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        isFemale ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(InputRow, { label: "Bust *", fieldKey: "bust", placeholder: isCm ? "e.g. 88" : "e.g. 35", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Waist *", fieldKey: "waist", placeholder: isCm ? "e.g. 70" : "e.g. 28", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Hips *", fieldKey: "hips", placeholder: isCm ? "e.g. 96" : "e.g. 38", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Shoulders", fieldKey: "shoulderWidth", placeholder: isCm ? "e.g. 39" : "e.g. 15", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Inseam", fieldKey: "inseam", placeholder: isCm ? "e.g. 76" : "e.g. 30", type: "number", unit: sizingUnit })
-        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(InputRow, { label: "Chest *", fieldKey: "chest", placeholder: isCm ? "e.g. 104" : "e.g. 41", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Waist *", fieldKey: "waist", placeholder: isCm ? "e.g. 84" : "e.g. 33", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Shoulders", fieldKey: "shoulderWidth", placeholder: isCm ? "e.g. 46" : "e.g. 18", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Sleeve", fieldKey: "sleeveLength", placeholder: isCm ? "e.g. 64" : "e.g. 25", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Inseam", fieldKey: "inseam", placeholder: isCm ? "e.g. 81" : "e.g. 32", type: "number", unit: sizingUnit })
-        ] }),
-        isFemale && /* @__PURE__ */ jsxs("div", { className: "ps-tryon-input-row", children: [
-          /* @__PURE__ */ jsx("label", { children: "Fit type" }),
-          /* @__PURE__ */ jsx("div", { className: "ps-tryon-unit-toggle", children: ["petite", "standard", "tall", "plus"].map((fp) => /* @__PURE__ */ jsx(
-            "button",
+      sizingMethod === "exact" ? /* @__PURE__ */ jsx(Fragment, { children: (() => {
+        const reqFields = dynamicFields.filter((f) => f.required);
+        const optFields = dynamicFields.filter((f) => !f.required);
+        const renderField = (field) => {
+          if (["shoeEU", "shoeUS", "shoeUK"].includes(field.key)) {
+            return /* @__PURE__ */ jsx(InputRow, { label: `${field.label} *`, fieldKey: field.key, placeholder: field.placeholder }, field.key);
+          }
+          const phCm = field.placeholder?.replace(/[^0-9.]/g, "") || "0";
+          const phIn = String(field.unit === "cm" ? Math.round(parseFloat(phCm) / 2.54) : phCm);
+          const placeholder = isCm ? field.placeholder || "" : `e.g. ${phIn}`;
+          return /* @__PURE__ */ jsx(
+            InputRow,
             {
-              className: `ps-tryon-unit-btn${(formRef.current.fitPreference || "standard") === fp ? " ps-active" : ""}`,
-              onClick: (e) => {
-                updateField("fitPreference", fp);
-                const btns = e.target.parentElement.querySelectorAll(".ps-tryon-unit-btn");
-                btns.forEach((b) => b.classList.toggle("ps-active", b.textContent?.toLowerCase() === fp));
-              },
-              children: fp.charAt(0).toUpperCase() + fp.slice(1)
+              label: `${field.label}${field.required ? " *" : ""}`,
+              fieldKey: field.key,
+              placeholder,
+              type: "number",
+              unit: field.unit === "cm" ? sizingUnit : void 0
             },
-            fp
-          )) })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "ps-tryon-shoe-section", children: [
-          /* @__PURE__ */ jsx("div", { className: "ps-tryon-shoe-title", children: "Shoe sizing (optional)" }),
-          /* @__PURE__ */ jsx(InputRow, { label: "Foot length", fieldKey: "footLengthCm", placeholder: isCm ? "e.g. 27" : "e.g. 10.5", type: "number", unit: sizingUnit }),
-          /* @__PURE__ */ jsx(InputRow, { label: shoeField.label, fieldKey: shoeField.key, placeholder: shoeField.ph })
-        ] })
-      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            field.key
+          );
+        };
+        return /* @__PURE__ */ jsxs(Fragment, { children: [
+          reqFields.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("div", { className: "ps-tryon-section-label", children: "Required for this product" }),
+            reqFields.map(renderField)
+          ] }),
+          isFemale && /* @__PURE__ */ jsxs("div", { className: "ps-tryon-input-row", children: [
+            /* @__PURE__ */ jsx("label", { children: "Fit type" }),
+            /* @__PURE__ */ jsx("div", { className: "ps-tryon-unit-toggle", children: ["petite", "standard", "tall", "plus"].map((fp) => /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: `ps-tryon-unit-btn${(formRef.current.fitPreference || "standard") === fp ? " ps-active" : ""}`,
+                onClick: (e) => {
+                  updateField("fitPreference", fp);
+                  const btns = e.target.parentElement.querySelectorAll(".ps-tryon-unit-btn");
+                  btns.forEach((b) => b.classList.toggle("ps-active", b.textContent?.toLowerCase() === fp));
+                },
+                children: fp.charAt(0).toUpperCase() + fp.slice(1)
+              },
+              fp
+            )) })
+          ] }),
+          optFields.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ps-tryon-optional-section", children: [
+            /* @__PURE__ */ jsxs("button", { className: "ps-tryon-optional-toggle", onClick: (e) => {
+              const wrap = e.target.closest(".ps-tryon-optional-section").querySelector(".ps-tryon-optional-fields");
+              const arrow = e.target.closest(".ps-tryon-optional-toggle").querySelector(".ps-tryon-chevron");
+              if (wrap) {
+                const open = wrap.style.display !== "none";
+                wrap.style.display = open ? "none" : "flex";
+                if (arrow) arrow.style.transform = open ? "rotate(0deg)" : "rotate(180deg)";
+              }
+            }, children: [
+              /* @__PURE__ */ jsx("span", { children: "Optional — improve accuracy & save to profile" }),
+              /* @__PURE__ */ jsx("span", { className: "ps-tryon-chevron", children: "▾" })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "ps-tryon-optional-fields", style: { display: "none" }, children: [
+              optFields.map(renderField),
+              !dynamicFields.some((f) => f.category === "shoe") && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(InputRow, { label: "Foot length", fieldKey: "footLengthCm", placeholder: isCm ? "e.g. 27" : "e.g. 10.5", type: "number", unit: sizingUnit }),
+                /* @__PURE__ */ jsx(InputRow, { label: shoeField.label, fieldKey: shoeField.key, placeholder: shoeField.ph })
+              ] })
+            ] })
+          ] }),
+          optFields.length === 0 && !dynamicFields.some((f) => f.category === "shoe") && /* @__PURE__ */ jsxs("div", { className: "ps-tryon-shoe-section", children: [
+            /* @__PURE__ */ jsx("div", { className: "ps-tryon-shoe-title", children: "Shoe sizing (optional)" }),
+            /* @__PURE__ */ jsx(InputRow, { label: "Foot length", fieldKey: "footLengthCm", placeholder: isCm ? "e.g. 27" : "e.g. 10.5", type: "number", unit: sizingUnit }),
+            /* @__PURE__ */ jsx(InputRow, { label: shoeField.label, fieldKey: shoeField.key, placeholder: shoeField.ph })
+          ] })
+        ] });
+      })() }) : /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsxs("div", { className: "ps-tryon-input-row", children: [
           /* @__PURE__ */ jsx("label", { children: "Height *" }),
           heightUnit === "ft" ? /* @__PURE__ */ jsxs("div", { className: "ps-tryon-height-ft", children: [
@@ -974,7 +1070,10 @@ function PrimeStyleTryonInner({
   function ProcessingView() {
     return /* @__PURE__ */ jsxs("div", { className: "ps-tryon-processing", children: [
       /* @__PURE__ */ jsxs("div", { className: "ps-tryon-processing-image-wrap", children: [
-        previewUrl && /* @__PURE__ */ jsx("img", { src: previewUrl, alt: "Your photo", className: "ps-tryon-processing-model" }),
+        previewUrl && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("div", { className: "ps-tryon-processing-blur", style: { backgroundImage: `url(${previewUrl})` } }),
+          /* @__PURE__ */ jsx("img", { src: previewUrl, alt: "Your photo", className: "ps-tryon-processing-model" })
+        ] }),
         /* @__PURE__ */ jsx("div", { className: "ps-tryon-scan-line" }),
         /* @__PURE__ */ jsx("div", { className: "ps-tryon-scan-overlay" })
       ] }),
@@ -990,6 +1089,8 @@ function PrimeStyleTryonInner({
     const hasSizing = !!sizingResult || sizingLoading;
     const hasBoth = !!resultImageUrl && hasSizing;
     const [profileName, setProfileName] = useState("");
+    const [showFitDetails, setShowFitDetails] = useState(false);
+    const confidenceLabel = sizingResult?.confidence === "high" ? "High Confidence" : sizingResult?.confidence === "medium" ? "Medium Confidence" : sizingResult?.confidence === "low" ? "Low Confidence" : "";
     return /* @__PURE__ */ jsxs("div", { className: `ps-tryon-result-layout${hasBoth ? " ps-tryon-result-split" : ""}`, children: [
       resultImageUrl && /* @__PURE__ */ jsx("div", { className: "ps-tryon-result-image-col", children: /* @__PURE__ */ jsx("img", { src: resultImageUrl, alt: "Try-on result", className: cn.resultImage }) }),
       /* @__PURE__ */ jsxs("div", { className: "ps-tryon-result-info-col", children: [
@@ -998,20 +1099,23 @@ function PrimeStyleTryonInner({
           /* @__PURE__ */ jsx("p", { className: "ps-tryon-size-reasoning", children: "Analyzing your size..." })
         ] }),
         sizingResult && /* @__PURE__ */ jsxs("div", { className: "ps-tryon-size-recommend", children: [
-          /* @__PURE__ */ jsx("div", { className: "ps-tryon-size-badge", children: sizingResult.recommendedSize }),
-          /* @__PURE__ */ jsxs("div", { className: "ps-tryon-size-confidence", children: [
-            "Confidence: ",
-            /* @__PURE__ */ jsx("span", { className: `ps-conf-${sizingResult.confidence}`, children: sizingResult.confidence })
+          /* @__PURE__ */ jsx("h3", { className: "ps-tryon-size-title", children: "Recommended Size" }),
+          /* @__PURE__ */ jsxs("div", { className: "ps-tryon-size-hero-row", children: [
+            /* @__PURE__ */ jsx("div", { className: "ps-tryon-size-badge", children: sizingResult.recommendedSize }),
+            /* @__PURE__ */ jsx("span", { className: `ps-tryon-size-conf-label ps-conf-${sizingResult.confidence}`, children: confidenceLabel })
           ] }),
-          /* @__PURE__ */ jsx("p", { className: "ps-tryon-size-reasoning", children: sizingResult.reasoning }),
-          sizingResult.internationalSizes && /* @__PURE__ */ jsx("div", { className: "ps-tryon-intl-sizes", children: Object.entries(sizingResult.internationalSizes).map(([k, v]) => /* @__PURE__ */ jsxs("span", { className: "ps-tryon-intl-chip", children: [
-            k,
-            ": ",
-            v
-          ] }, k)) }),
-          sizingResult.matchDetails && sizingResult.matchDetails.length > 0 && /* @__PURE__ */ jsxs("details", { className: "ps-tryon-match-details", children: [
-            /* @__PURE__ */ jsx("summary", { children: "Measurement breakdown" }),
-            /* @__PURE__ */ jsxs("table", { children: [
+          sizingResult.matchDetails && sizingResult.matchDetails.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ps-tryon-fit-summary", children: [
+            /* @__PURE__ */ jsx("h4", { className: "ps-tryon-fit-summary-title", children: "Fit Summary" }),
+            sizingResult.matchDetails.map((m, i) => /* @__PURE__ */ jsxs("div", { className: "ps-tryon-fit-row", children: [
+              /* @__PURE__ */ jsx("span", { className: `ps-tryon-fit-icon ps-fit-icon-${m.fit}`, children: m.fit === "good" ? "✓" : m.fit === "tight" ? "↑" : "↓" }),
+              /* @__PURE__ */ jsxs("span", { className: "ps-tryon-fit-text", children: [
+                /* @__PURE__ */ jsx("strong", { children: m.measurement }),
+                " ",
+                m.fit === "good" ? "within range" : m.fit === "tight" ? "may be snug" : "may be loose"
+              ] })
+            ] }, i)),
+            /* @__PURE__ */ jsx("button", { className: "ps-tryon-fit-details-toggle", onClick: () => setShowFitDetails(!showFitDetails), children: showFitDetails ? "Hide detailed fit analysis ↑" : "See detailed fit analysis ↓" }),
+            showFitDetails && /* @__PURE__ */ jsxs("table", { className: "ps-tryon-fit-table", children: [
               /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
                 /* @__PURE__ */ jsx("th", { children: "Area" }),
                 /* @__PURE__ */ jsx("th", { children: "You" }),
@@ -1025,7 +1129,15 @@ function PrimeStyleTryonInner({
                 /* @__PURE__ */ jsx("td", { className: `ps-fit-${m.fit}`, children: m.fit })
               ] }, i)) })
             ] })
-          ] })
+          ] }),
+          sizingResult.internationalSizes && Object.keys(sizingResult.internationalSizes).length > 0 && /* @__PURE__ */ jsxs("div", { className: "ps-tryon-equiv-section", children: [
+            /* @__PURE__ */ jsx("h4", { className: "ps-tryon-equiv-title", children: "Equivalent Sizes" }),
+            /* @__PURE__ */ jsx("div", { className: "ps-tryon-equiv-chips", children: Object.entries(sizingResult.internationalSizes).map(([k, v]) => /* @__PURE__ */ jsxs("div", { className: "ps-tryon-equiv-chip", children: [
+              /* @__PURE__ */ jsx("span", { className: "ps-tryon-equiv-region", children: k }),
+              /* @__PURE__ */ jsx("span", { className: "ps-tryon-equiv-value", children: v })
+            ] }, k)) })
+          ] }),
+          (!sizingResult.matchDetails || sizingResult.matchDetails.length === 0) && sizingResult.reasoning && /* @__PURE__ */ jsx("p", { className: "ps-tryon-size-reasoning", children: sizingResult.reasoning })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: cx("ps-tryon-result-actions", cn.resultActions), children: [
           /* @__PURE__ */ jsx("button", { onClick: handleDownload, className: cx("ps-tryon-btn-download", cn.downloadButton), children: "Download" }),
@@ -1036,15 +1148,21 @@ function PrimeStyleTryonInner({
           /* @__PURE__ */ jsxs("div", { className: "ps-tryon-save-row", children: [
             /* @__PURE__ */ jsx("input", { type: "text", placeholder: "Name this profile (e.g. John, Sarah)", value: profileName, onChange: (e) => setProfileName(e.target.value) }),
             activeProfileId ? /* @__PURE__ */ jsxs("div", { className: "ps-tryon-save-btn-group", children: [
-              /* @__PURE__ */ jsx("button", { onClick: () => {
+              /* @__PURE__ */ jsxs("button", { onClick: () => {
                 if (profileName.trim()) saveProfile(profileName.trim());
-              }, children: "Update" }),
+              }, children: [
+                "💾",
+                " Update"
+              ] }),
               /* @__PURE__ */ jsx("button", { className: "ps-tryon-save-new-btn", onClick: () => {
                 if (profileName.trim()) saveProfile(profileName.trim(), true);
               }, children: "+ New" })
-            ] }) : /* @__PURE__ */ jsx("button", { onClick: () => {
+            ] }) : /* @__PURE__ */ jsxs("button", { onClick: () => {
               if (profileName.trim()) saveProfile(profileName.trim());
-            }, children: "Save" })
+            }, children: [
+              "💾",
+              " Save"
+            ] })
           ] })
         ] }),
         profileSaved && /* @__PURE__ */ jsxs("div", { className: "ps-tryon-save-done", children: [
@@ -1229,7 +1347,11 @@ const STYLES = `
   .ps-tryon-overlay {
     position: fixed; inset: 0; background: var(--ps-modal-overlay, rgba(0,0,0,0.6));
     display: flex; align-items: center; justify-content: center;
-    z-index: 999999; padding: 16px; animation: ps-fade-in 0.2s ease;
+    z-index: 999999;
+    padding: 16px;
+    padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
+    animation: ps-fade-in 0.2s ease;
+    overflow-y: auto; -webkit-overflow-scrolling: touch;
   }
   @keyframes ps-fade-in { from { opacity: 0; } to { opacity: 1; } }
 
@@ -1240,6 +1362,7 @@ const STYLES = `
     font-family: var(--ps-modal-font, system-ui, -apple-system, sans-serif);
     box-shadow: 0 25px 50px rgba(0,0,0,0.4); animation: ps-slide-up 0.3s ease;
     scrollbar-width: thin; scrollbar-color: #333 transparent;
+    flex-shrink: 0;
   }
   .ps-tryon-modal-wide { max-width: 920px; }
   .ps-tryon-modal:has(.ps-tryon-drawer-open) { overflow: hidden; }
@@ -1439,6 +1562,12 @@ const STYLES = `
     font-size: 12px; font-weight: 600; cursor: pointer; transition: all 0.2s; font-family: inherit;
   }
   .ps-tryon-unit-btn.ps-active { background: #bb945c; color: #111; }
+  .ps-tryon-section-label { font-size: 11px; font-weight: 700; color: #bb945c; text-transform: uppercase; letter-spacing: 0.08em; margin: 4px 0 2px; }
+  .ps-tryon-optional-section { border-top: 1px solid #333; padding-top: 10px; margin-top: 6px; }
+  .ps-tryon-optional-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border: 1px solid #333; border-radius: 10px; padding: 10px 14px; color: #999; font-size: 13px; font-weight: 600; cursor: pointer; font-family: inherit; transition: all 0.2s; }
+  .ps-tryon-optional-toggle:hover { border-color: #555; color: #ccc; }
+  .ps-tryon-chevron { transition: transform 0.2s; font-size: 14px; }
+  .ps-tryon-optional-fields { display: flex; flex-direction: column; gap: 10px; padding-top: 12px; }
   .ps-tryon-shoe-section { border-top: 1px solid #333; padding-top: 14px; margin-top: 6px; display: flex; flex-direction: column; gap: 10px; }
   .ps-tryon-shoe-title { font-size: 13px; font-weight: 600; color: #999; }
   .ps-tryon-disclaimer { font-size: 11px; color: #666; margin: 4px 0 0; }
@@ -1460,11 +1589,15 @@ const STYLES = `
   .ps-tryon-processing { text-align: center; padding: 24px; display: flex; flex-direction: column; align-items: center; }
 
   .ps-tryon-processing-image-wrap {
-    position: relative; width: 200px; height: 260px; margin: 0 auto 24px;
+    position: relative; width: 220px; height: 280px; margin: 0 auto 24px;
     border-radius: 16px; overflow: hidden; border: 2px solid #333;
   }
+  .ps-tryon-processing-blur {
+    position: absolute; inset: -20px; background-size: cover; background-position: center;
+    filter: blur(25px) brightness(0.5); transform: scale(1.2);
+  }
   .ps-tryon-processing-model {
-    width: 100%; height: 100%; object-fit: cover; display: block;
+    position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; display: block;
   }
   .ps-tryon-scan-overlay {
     position: absolute; inset: 0;
@@ -1523,12 +1656,20 @@ const STYLES = `
 
   /* Size recommendation */
   .ps-tryon-size-recommend { margin-bottom: 16px; }
+  .ps-tryon-size-title { font-size: 18px; font-weight: 700; color: #fff; margin: 0 0 14px; }
+  .ps-tryon-size-hero-row {
+    display: flex; align-items: center; gap: 16px; padding: 16px 20px;
+    border: 1.5px solid #333; border-radius: 14px; margin-bottom: 18px; background: rgba(255,255,255,0.02);
+  }
   .ps-tryon-size-badge {
     display: inline-flex; align-items: center; justify-content: center;
-    width: 56px; height: 56px; border-radius: 50%;
+    min-width: 56px; height: 56px; padding: 0 12px; border-radius: 12px;
     background: linear-gradient(135deg, #bb945c, #d6ba7d);
-    color: #111; font-size: 20px; font-weight: 700; margin-bottom: 10px;
+    color: #111; font-size: 24px; font-weight: 800; letter-spacing: -0.02em;
   }
+  .ps-tryon-size-conf-label { font-size: 15px; font-weight: 600; }
+  .ps-conf-high { color: #4ade80; } .ps-conf-medium { color: #bb945c; } .ps-conf-low { color: #ef4444; }
+
   .ps-tryon-sizing-loading { text-align: center; padding: 20px 0; }
   .ps-tryon-size-loading-spinner {
     width: 36px; height: 36px; border: 3px solid #333;
@@ -1536,18 +1677,42 @@ const STYLES = `
     animation: ps-spin 0.8s linear infinite; margin: 0 auto 12px;
   }
   @keyframes ps-spin { to { transform: rotate(360deg); } }
-  .ps-tryon-size-confidence { font-size: 12px; color: #999; margin-bottom: 8px; }
-  .ps-conf-high { color: #4ade80; } .ps-conf-medium { color: #bb945c; } .ps-conf-low { color: #ef4444; }
-  .ps-tryon-size-reasoning { font-size: 13px; color: #ccc; line-height: 1.5; margin-bottom: 12px; }
-  .ps-tryon-intl-sizes { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
-  .ps-tryon-intl-chip { padding: 4px 10px; border: 1px solid #333; border-radius: 8px; font-size: 11px; color: #ccc; font-weight: 500; }
-  .ps-tryon-match-details { margin-top: 12px; }
-  .ps-tryon-match-details summary { font-size: 12px; color: #bb945c; cursor: pointer; font-weight: 600; }
-  .ps-tryon-match-details table { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 12px; }
-  .ps-tryon-match-details th { text-align: left; padding: 6px 8px; border-bottom: 1px solid #333; color: #999; font-weight: 600; }
-  .ps-tryon-match-details td { padding: 6px 8px; border-bottom: 1px solid #222; color: #ccc; }
+
+  /* Fit Summary */
+  .ps-tryon-fit-summary { margin-bottom: 16px; }
+  .ps-tryon-fit-summary-title { font-size: 15px; font-weight: 700; color: #fff; margin: 0 0 10px; }
+  .ps-tryon-fit-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; }
+  .ps-tryon-fit-icon {
+    width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
+    font-size: 12px; font-weight: 700; flex-shrink: 0;
+  }
+  .ps-fit-icon-good { background: rgba(74,222,128,0.15); color: #4ade80; }
+  .ps-fit-icon-tight { background: rgba(245,158,11,0.15); color: #f59e0b; }
+  .ps-fit-icon-loose { background: rgba(96,165,250,0.15); color: #60a5fa; }
+  .ps-tryon-fit-text { font-size: 14px; color: #ccc; line-height: 1.4; }
+  .ps-tryon-fit-text strong { color: #fff; font-weight: 600; }
+  .ps-tryon-fit-details-toggle {
+    display: inline-block; margin-top: 8px; font-size: 13px; color: #bb945c; cursor: pointer;
+    font-weight: 600; background: none; border: none; padding: 0; font-family: inherit;
+  }
+  .ps-tryon-fit-details-toggle:hover { color: #d6ba7d; }
+  .ps-tryon-fit-table { width: 100%; border-collapse: collapse; margin-top: 10px; font-size: 13px; }
+  .ps-tryon-fit-table th { text-align: left; padding: 8px 10px; border-bottom: 1px solid #333; color: #999; font-weight: 600; }
+  .ps-tryon-fit-table td { padding: 8px 10px; border-bottom: 1px solid #222; color: #ccc; }
   .ps-fit-good { color: #4ade80; } .ps-fit-tight { color: #f59e0b; } .ps-fit-loose { color: #60a5fa; }
 
+  /* Equivalent Sizes */
+  .ps-tryon-equiv-section { margin-bottom: 16px; }
+  .ps-tryon-equiv-title { font-size: 15px; font-weight: 700; color: #fff; margin: 0 0 10px; }
+  .ps-tryon-equiv-chips { display: flex; flex-wrap: wrap; gap: 8px; }
+  .ps-tryon-equiv-chip {
+    display: flex; align-items: center; border: 1.5px solid #333; border-radius: 10px; overflow: hidden;
+  }
+  .ps-tryon-equiv-region { padding: 7px 10px; font-size: 12px; color: #999; font-weight: 600; background: rgba(255,255,255,0.03); }
+  .ps-tryon-equiv-value { padding: 7px 12px; font-size: 14px; color: #fff; font-weight: 700; }
+
+  .ps-tryon-size-reasoning { font-size: 14px; color: #ccc; line-height: 1.6; margin-bottom: 14px; }
+
   /* Save profile prompt */
   .ps-tryon-save-prompt { margin-top: 14px; padding: 14px; border: 1px solid #333; border-radius: 12px; background: #1a1b1a; }
   .ps-tryon-save-label { font-size: 12px; color: #999; margin-bottom: 10px; }
@@ -1677,13 +1842,27 @@ const STYLES = `
   .ps-tryon-detail-delete svg { stroke: currentColor; fill: none; }
 
   /* Mobile responsive */
+  @media (max-width: 768px) {
+    .ps-tryon-overlay {
+      padding: 0;
+      padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
+      align-items: stretch; justify-content: stretch;
+    }
+    .ps-tryon-modal {
+      max-width: 100%; max-height: none; width: 100%;
+      border-radius: 0; box-shadow: none;
+      min-height: 100%; flex: 1;
+      display: flex; flex-direction: column;
+    }
+    .ps-tryon-modal-wide { max-width: 100%; }
+    .ps-tryon-modal > :last-child { flex: 1; }
+    .ps-tryon-header { border-radius: 0; }
+  }
   @media (max-width: 720px) {
     .ps-tryon-result-split { flex-direction: column; }
     .ps-tryon-result-image-col { flex: none; }
-    .ps-tryon-modal-wide { max-width: 520px; }
   }
   @media (max-width: 480px) {
-    .ps-tryon-modal { max-height: 100vh; border-radius: 14px; }
     .ps-tryon-body { padding: 18px; }
     .ps-tryon-header { padding: 14px 18px; }
     .ps-tryon-stepper { padding: 14px 18px 8px; }

package/logo.svg

@@ -1,46 +1,46 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 26.0.3, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 841.9 510.4" style="enable-background:new 0 0 841.9 510.4;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#D6BA7D;}
-</style>
-<g>
-	<path class="st0" d="M333.7,230.1c-9.1-0.1-12.4,3.9-10.7,12.8c1.2,6.3,2.8,12.7,5.3,18.7c16.1,39.2,43.1,69.4,77.8,93.1
-		c5.8,3.9,11,3.7,16.8,0.2c20.3-12.2,37.5-28.1,52-46.6c15-19.1,27.6-39.7,32.5-64c2.2-11-2.4-15.7-13.8-14.5
-		c-2.9,0.3-5.7,1.4-8.5,1.9c-1.9,0.4-3.8,0.4-6.9,0.7c10.4-11.8,29.4-13.9,39.3-4.7c11,10.2,21,21.3,31.8,31.7
-		c5.2,4.9,8,10.6,6.9,17.4c-2.2,14.3-3.6,28.9-8,42.5c-14.1,43.9-41.2,79.8-72.3,113.1c-6.5,6.9-7.2,6.9-13-1.1
-		c-13.3-18.4-26.3-37-39.7-55.3c-8.3-11.3-8.5-11.2-16.7,0.3c-13.3,18.6-26.6,37.3-39.9,56c-2.8,3.8-5.4,6.9-10.2,1.8
-		c-27.8-29.9-52.8-61.7-68.4-99.8c-7.6-18.6-14-37.7-13.7-58.1c0.1-4.7,1.5-10.6,4.5-13.9c11.1-12.1,22.8-23.6,34.8-34.8
-		c9.9-9.2,29.1-6.9,39.2,4.9C345.6,231.4,339.7,230,333.7,230.1z M375.1,401.5c7.5-10.7,14.9-21.4,22.7-31.8c3-4.1,2.6-6.2-1.7-9.1
-		c-27.9-18.8-50.4-42.9-66.7-72.2c-7.5-13.5-12.2-28.6-18.3-43.3c-0.2,0.2-1.7,1.2-2.9,2.4c-4.1,4.1-7.5,9.1-12.2,12.3
-		c-12.4,8.4-12.5,19.7-9.7,32.6c7.5,34.4,22.9,64.9,43.9,92.8c9.4,12.4,19.5,24.4,30,37.4C365.7,414.8,370.4,408.1,375.1,401.5z
-		 M429.1,364.4c13.7,19.3,27.2,38.3,41.2,57.9c20.5-23.3,39.3-47,53.7-74c10-18.7,16.8-38.4,20.3-59.3c1.9-11.5,1-21.2-9.4-28.8
-		c-5.7-4.3-10.2-10.2-16.3-16.4C506.1,297.7,473,334.6,429.1,364.4z"/>
-	<path class="st0" d="M481.8,268.1c-45.8-25.2-85.4-57.9-117.4-99.3c-6.8-8.8-11.9-19.4-15.4-30c-9.1-28.2,0.9-56.7,24.9-75.2
-		c21.6-16.5,54-18.1,77.7-3c16.9,10.8,27.8,26.1,30.3,46.3c0.4,3.4-1.6,8.3-4.2,10.6c-2,1.8-7.6,2.4-9.8,0.9
-		c-3.1-2.2-5.5-6.5-6.5-10.4c-6.6-25.5-26.7-39.5-53-36.5c-23.2,2.6-41.3,23.8-41.5,48.2c-0.1,13,4.2,24.7,12.4,34
-		c16.2,18.4,32.4,37.2,50.9,53.1c20,17.2,42.7,31.1,65.1,47.1c-1.8,4.5-4.3,10.7-6.9,17.2C485.7,270,483.7,269.3,481.8,268.1z"/>
-	<path class="st0" d="M134.3,426.9c64-0.3,127.9-0.2,191.9-0.1c2.3,0,5.5-0.2,6.8,1.1c6.5,6.5,12.4,13.5,19.1,20.9
-		c-2.4,0.2-4.1,0.4-5.7,0.4c-73.1,0-146.3-0.1-219.4-0.2c-3.4,0-6.8-0.2-10.1-0.7c-18.1-2.9-25-17.4-16-35.3
-		C108.4,426.9,121,426.9,134.3,426.9z"/>
-	<path class="st0" d="M705.1,448.9c-0.8,0-1.5,0-2.2,0c-73.6,0.1-147.3,0.2-220.9,0.3c-1.3,0-2.6-0.3-4.1-0.5
-		c5.6-5.9,11.1-11.2,16-17.1c2.9-3.5,5.8-5,10.4-5c64.7,0.2,129.4,0,194.1,0.4c12.9,0.1,24.5-1.1,32.3-14.9
-		C737.7,437.7,729.3,448.9,705.1,448.9z"/>
-	<path class="st0" d="M264.5,297.8c1.3,5-0.8,6.7-4.9,8.4c-22.4,9.4-45.2,18.2-67,28.9c-25.3,12.3-50.2,25.6-74.4,40
-		c-15.8,9.4-26.4,24-30.2,42.5c-1.1,5-0.9,10.3-1.4,17.3c-2.4-3.3-4.2-5.1-5.3-7.3c-8.5-17.5-8.9-35.3,3.8-50.3
-		c9.4-11,20.8-21.3,33.4-28.2c31.3-17.1,63.6-32.3,95.8-47.6c15.5-7.3,31.6-13.2,48.5-20.2C263.4,287.7,263.2,292.9,264.5,297.8z"/>
-	<path class="st0" d="M742.9,419.1c-3.1-18.8-13.7-33.1-29-43.3c-15.6-10.4-31.8-20.3-48.7-28.3c-31-14.7-62.6-27.8-93.9-41.8
-		c-2.2-1.1-5.5-3.5-5.5-5.2c0.2-6.2,1.6-12.3,2.6-18.8c2.2,0.7,4.1,1.1,5.8,1.9c34,15.1,68.3,29.5,101.8,45.5
-		c17.7,8.5,34.6,19.1,51.2,29.8c11.6,7.6,21.2,17.8,25.4,31.6c4.8,15.9,2.4,30.6-8.8,45C743.4,429,743.6,424,742.9,419.1z"/>
-	<path class="st0" d="M379.1,227.4c17-9.9,16.9-10.1,30.2,4.5c0.3,0.4,0.5,0.9,1.4,2.5c-22.4,12.4-44.9,24.7-68.2,37.6
-		c-3-7.7-5.3-13.7-7.8-20C350.1,243.5,364.7,235.7,379.1,227.4z"/>
-	<path class="st0" d="M556.3,327.9c2-5,3.5-9,5.3-13.4c48.9,20.7,98.9,36.9,143.1,66.1C657,358.4,606.5,344.1,556.3,327.9z"/>
-	<path class="st0" d="M268.3,315.2c1.1,2.9,2,4.9,2.6,6.9c0.6,2.1,1,4.1,1.2,5.1c-48.9,17.4-97.3,34.7-143.9,51.3
-		C170.4,351.4,219.9,335,268.3,315.2z"/>
-	<path class="st0" d="M465,299.1c-33.6,10.9-67,9.6-100.5,0c-7.8-2.2-9.4-3.6-12.6-12.2c42.3,15.7,84.4,16.7,127.2-0.3
-		C476.5,294.7,471.1,297.1,465,299.1z"/>
-	<path class="st0" d="M381.9,140.1c9.7,6.8,19.9,14.1,30.2,21.2c11.4,8,17.3,19,18.8,33.9C415.3,183.5,382.7,146,381.9,140.1z"/>
-	<path class="st0" d="M360.8,276c36.5,10.4,71.8,9.6,107.1,1.3C442.6,294.2,376.8,293.8,360.8,276z"/>
-</g>
-</svg>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 26.0.3, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 841.9 510.4" style="enable-background:new 0 0 841.9 510.4;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#D6BA7D;}
+</style>
+<g>
+	<path class="st0" d="M333.7,230.1c-9.1-0.1-12.4,3.9-10.7,12.8c1.2,6.3,2.8,12.7,5.3,18.7c16.1,39.2,43.1,69.4,77.8,93.1
+		c5.8,3.9,11,3.7,16.8,0.2c20.3-12.2,37.5-28.1,52-46.6c15-19.1,27.6-39.7,32.5-64c2.2-11-2.4-15.7-13.8-14.5
+		c-2.9,0.3-5.7,1.4-8.5,1.9c-1.9,0.4-3.8,0.4-6.9,0.7c10.4-11.8,29.4-13.9,39.3-4.7c11,10.2,21,21.3,31.8,31.7
+		c5.2,4.9,8,10.6,6.9,17.4c-2.2,14.3-3.6,28.9-8,42.5c-14.1,43.9-41.2,79.8-72.3,113.1c-6.5,6.9-7.2,6.9-13-1.1
+		c-13.3-18.4-26.3-37-39.7-55.3c-8.3-11.3-8.5-11.2-16.7,0.3c-13.3,18.6-26.6,37.3-39.9,56c-2.8,3.8-5.4,6.9-10.2,1.8
+		c-27.8-29.9-52.8-61.7-68.4-99.8c-7.6-18.6-14-37.7-13.7-58.1c0.1-4.7,1.5-10.6,4.5-13.9c11.1-12.1,22.8-23.6,34.8-34.8
+		c9.9-9.2,29.1-6.9,39.2,4.9C345.6,231.4,339.7,230,333.7,230.1z M375.1,401.5c7.5-10.7,14.9-21.4,22.7-31.8c3-4.1,2.6-6.2-1.7-9.1
+		c-27.9-18.8-50.4-42.9-66.7-72.2c-7.5-13.5-12.2-28.6-18.3-43.3c-0.2,0.2-1.7,1.2-2.9,2.4c-4.1,4.1-7.5,9.1-12.2,12.3
+		c-12.4,8.4-12.5,19.7-9.7,32.6c7.5,34.4,22.9,64.9,43.9,92.8c9.4,12.4,19.5,24.4,30,37.4C365.7,414.8,370.4,408.1,375.1,401.5z
+		 M429.1,364.4c13.7,19.3,27.2,38.3,41.2,57.9c20.5-23.3,39.3-47,53.7-74c10-18.7,16.8-38.4,20.3-59.3c1.9-11.5,1-21.2-9.4-28.8
+		c-5.7-4.3-10.2-10.2-16.3-16.4C506.1,297.7,473,334.6,429.1,364.4z"/>
+	<path class="st0" d="M481.8,268.1c-45.8-25.2-85.4-57.9-117.4-99.3c-6.8-8.8-11.9-19.4-15.4-30c-9.1-28.2,0.9-56.7,24.9-75.2
+		c21.6-16.5,54-18.1,77.7-3c16.9,10.8,27.8,26.1,30.3,46.3c0.4,3.4-1.6,8.3-4.2,10.6c-2,1.8-7.6,2.4-9.8,0.9
+		c-3.1-2.2-5.5-6.5-6.5-10.4c-6.6-25.5-26.7-39.5-53-36.5c-23.2,2.6-41.3,23.8-41.5,48.2c-0.1,13,4.2,24.7,12.4,34
+		c16.2,18.4,32.4,37.2,50.9,53.1c20,17.2,42.7,31.1,65.1,47.1c-1.8,4.5-4.3,10.7-6.9,17.2C485.7,270,483.7,269.3,481.8,268.1z"/>
+	<path class="st0" d="M134.3,426.9c64-0.3,127.9-0.2,191.9-0.1c2.3,0,5.5-0.2,6.8,1.1c6.5,6.5,12.4,13.5,19.1,20.9
+		c-2.4,0.2-4.1,0.4-5.7,0.4c-73.1,0-146.3-0.1-219.4-0.2c-3.4,0-6.8-0.2-10.1-0.7c-18.1-2.9-25-17.4-16-35.3
+		C108.4,426.9,121,426.9,134.3,426.9z"/>
+	<path class="st0" d="M705.1,448.9c-0.8,0-1.5,0-2.2,0c-73.6,0.1-147.3,0.2-220.9,0.3c-1.3,0-2.6-0.3-4.1-0.5
+		c5.6-5.9,11.1-11.2,16-17.1c2.9-3.5,5.8-5,10.4-5c64.7,0.2,129.4,0,194.1,0.4c12.9,0.1,24.5-1.1,32.3-14.9
+		C737.7,437.7,729.3,448.9,705.1,448.9z"/>
+	<path class="st0" d="M264.5,297.8c1.3,5-0.8,6.7-4.9,8.4c-22.4,9.4-45.2,18.2-67,28.9c-25.3,12.3-50.2,25.6-74.4,40
+		c-15.8,9.4-26.4,24-30.2,42.5c-1.1,5-0.9,10.3-1.4,17.3c-2.4-3.3-4.2-5.1-5.3-7.3c-8.5-17.5-8.9-35.3,3.8-50.3
+		c9.4-11,20.8-21.3,33.4-28.2c31.3-17.1,63.6-32.3,95.8-47.6c15.5-7.3,31.6-13.2,48.5-20.2C263.4,287.7,263.2,292.9,264.5,297.8z"/>
+	<path class="st0" d="M742.9,419.1c-3.1-18.8-13.7-33.1-29-43.3c-15.6-10.4-31.8-20.3-48.7-28.3c-31-14.7-62.6-27.8-93.9-41.8
+		c-2.2-1.1-5.5-3.5-5.5-5.2c0.2-6.2,1.6-12.3,2.6-18.8c2.2,0.7,4.1,1.1,5.8,1.9c34,15.1,68.3,29.5,101.8,45.5
+		c17.7,8.5,34.6,19.1,51.2,29.8c11.6,7.6,21.2,17.8,25.4,31.6c4.8,15.9,2.4,30.6-8.8,45C743.4,429,743.6,424,742.9,419.1z"/>
+	<path class="st0" d="M379.1,227.4c17-9.9,16.9-10.1,30.2,4.5c0.3,0.4,0.5,0.9,1.4,2.5c-22.4,12.4-44.9,24.7-68.2,37.6
+		c-3-7.7-5.3-13.7-7.8-20C350.1,243.5,364.7,235.7,379.1,227.4z"/>
+	<path class="st0" d="M556.3,327.9c2-5,3.5-9,5.3-13.4c48.9,20.7,98.9,36.9,143.1,66.1C657,358.4,606.5,344.1,556.3,327.9z"/>
+	<path class="st0" d="M268.3,315.2c1.1,2.9,2,4.9,2.6,6.9c0.6,2.1,1,4.1,1.2,5.1c-48.9,17.4-97.3,34.7-143.9,51.3
+		C170.4,351.4,219.9,335,268.3,315.2z"/>
+	<path class="st0" d="M465,299.1c-33.6,10.9-67,9.6-100.5,0c-7.8-2.2-9.4-3.6-12.6-12.2c42.3,15.7,84.4,16.7,127.2-0.3
+		C476.5,294.7,471.1,297.1,465,299.1z"/>
+	<path class="st0" d="M381.9,140.1c9.7,6.8,19.9,14.1,30.2,21.2c11.4,8,17.3,19,18.8,33.9C415.3,183.5,382.7,146,381.9,140.1z"/>
+	<path class="st0" d="M360.8,276c36.5,10.4,71.8,9.6,107.1,1.3C442.6,294.2,376.8,293.8,360.8,276z"/>
+</g>
+</svg>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primestyleai/tryon",
-  "version": "3.4.2",
+  "version": "3.5.1",
   "description": "PrimeStyle Virtual Try-On SDK — React component & Web Component",
   "type": "module",
   "main": "dist/primestyle-tryon.js",