@snowcone-app/canvas 0.27.0 → 0.28.0

package/dist/{FontAnalyzer-EF3gLPr8.js → FontAnalyzer-PE6nysqE.js}

@@ -111,8 +111,8 @@ E.chdir = function(r) {
 E.umask = function() {
   return 0;
 };
-var ie = Rt.exports;
-const Dt = /* @__PURE__ */ te(ie);
+var se = Rt.exports;
+const Dt = /* @__PURE__ */ te(se);
 let It = 1;
 class nt {
   constructor(t = {}) {
@@ -192,7 +192,7 @@ class nt {
    * Returns true if point is near the border (within tolerance)
    */
   hitTestBorder(t, e, o = 5) {
-    const i = t >= this.x - o && t <= this.x + this.width + o, s = e >= this.y - o && e <= this.y + this.height + o, a = Math.abs(t - this.x) <= o && s, n = Math.abs(t - (this.x + this.width)) <= o && s, h = Math.abs(e - this.y) <= o && i, l = Math.abs(e - (this.y + this.height)) <= o && i;
+    const s = t >= this.x - o && t <= this.x + this.width + o, i = e >= this.y - o && e <= this.y + this.height + o, a = Math.abs(t - this.x) <= o && i, n = Math.abs(t - (this.x + this.width)) <= o && i, h = Math.abs(e - this.y) <= o && s, l = Math.abs(e - (this.y + this.height)) <= o && s;
     return a || n || h || l;
   }
   /**
@@ -210,7 +210,9 @@ class nt {
       backgroundType: this.backgroundType,
       backgroundTexture: this.backgroundTexture,
       exportBackground: this.exportBackground,
-      clipShape: this.clipShape,
+      // ClipShape is a string-or-object union — deep-copy object variants so the
+      // clone doesn't share nested path/pieces data with the original
+      clipShape: typeof this.clipShape == "object" ? structuredClone(this.clipShape) : this.clipShape,
       previewBackgroundColor: this.previewBackgroundColor,
       role: this.role,
       distressTexture: this.distressTexture ? { ...this.distressTexture } : void 0,
@@ -300,11 +302,11 @@ class qe {
     if (!e)
       return [];
     const o = e.getElementIds();
-    if (o.forEach((i) => {
-      this.elementToArtboard.delete(i);
+    if (o.forEach((s) => {
+      this.elementToArtboard.delete(s);
     }), this.artboards.delete(t), this.activeArtboardId === t) {
-      const i = Array.from(this.artboards.keys());
-      this.activeArtboardId = i.length > 0 ? i[0] : null;
+      const s = Array.from(this.artboards.keys());
+      this.activeArtboardId = s.length > 0 ? s[0] : null;
     }
     return o;
   }
@@ -351,10 +353,10 @@ class qe {
     const o = this.artboards.get(e);
     if (!o)
       return !1;
-    const i = this.elementToArtboard.get(t);
-    if (i) {
-      const s = this.artboards.get(i);
-      s == null || s.removeElementId(t);
+    const s = this.elementToArtboard.get(t);
+    if (s) {
+      const i = this.artboards.get(s);
+      i == null || i.removeElementId(t);
     }
     return o.addElementId(t), this.elementToArtboard.set(t, e), !0;
   }
@@ -394,19 +396,19 @@ class qe {
    */
   findArtboardAtPoint(t, e) {
     const o = Array.from(this.artboards.values()).reverse();
-    for (const i of o)
-      if (i.containsPoint(t, e))
-        return i;
+    for (const s of o)
+      if (s.containsPoint(t, e))
+        return s;
     return null;
   }
   /**
    * Find artboard border at point (for resize handles)
    */
   findArtboardBorderAtPoint(t, e, o = 5) {
-    const i = Array.from(this.artboards.values()).reverse();
-    for (const s of i)
-      if (s.hitTestBorder(t, e, o))
-        return s;
+    const s = Array.from(this.artboards.values()).reverse();
+    for (const i of s)
+      if (i.hitTestBorder(t, e, o))
+        return i;
     return null;
   }
   /**
@@ -447,8 +449,8 @@ class qe {
   reorderArtboards(t, e) {
     const o = Array.from(this.artboards.entries());
     if (t < 0 || t >= o.length || e < 0 || e >= o.length || t === e) return;
-    const [i] = o.splice(t, 1);
-    o.splice(e, 0, i), this.artboards = new Map(o);
+    const [s] = o.splice(t, 1);
+    o.splice(e, 0, s), this.artboards = new Map(o);
   }
   /**
    * Clear all artboards
@@ -471,8 +473,8 @@ class qe {
   fromJSON(t) {
     this.clear(), t.artboards.forEach((e) => {
       const o = nt.fromJSON(e);
-      this.artboards.set(o.id, o), o.getElementIds().forEach((i) => {
-        this.elementToArtboard.set(i, o.id);
+      this.artboards.set(o.id, o), o.getElementIds().forEach((s) => {
+        this.elementToArtboard.set(s, o.id);
       });
     }), this.activeArtboardId = t.activeArtboardId;
   }
@@ -482,11 +484,11 @@ class qe {
    */
   validateMappings(t) {
     const e = new Set(t.map((o) => o.id));
-    for (const [o, i] of this.elementToArtboard.entries())
+    for (const [o, s] of this.elementToArtboard.entries())
       e.has(o) || this.removeElementFromArtboard(o);
     for (const o of this.artboards.values()) {
-      const i = o.getElementIds().filter((s) => e.has(s));
-      o.clearElementIds(), i.forEach((s) => o.addElementId(s));
+      const s = o.getElementIds().filter((i) => e.has(i));
+      o.clearElementIds(), s.forEach((i) => o.addElementId(i));
     }
   }
 }
@@ -519,7 +521,7 @@ const D = {
     return t > 180 && (t -= 360), t;
   }
 };
-let se = 1;
+let ie = 1;
 class Q {
   /** Whether this element clips content below it (derived from blendMode === 'clip') */
   get isClipping() {
@@ -529,7 +531,7 @@ class Q {
     t ? (this.blendMode = "clip", this.knockoutParts || (this.knockoutParts = { fill: !0, scope: "group" })) : this.blendMode === "clip" && (this.blendMode = "normal");
   }
   constructor(t = {}) {
-    this.id = t.id || `element-${se++}`, this.x = t.x !== void 0 ? t.x : 100, this.y = t.y !== void 0 ? t.y : 100, this.rotation = t.rotation !== void 0 ? t.rotation : 0, this.opacity = t.opacity !== void 0 ? t.opacity : 1, this.transformType = t.transformType || "custom", this.transformData = t.transformData || {}, this.blendMode = t.blendMode, this.knockoutParts = t.knockoutParts, this.stroke = t.stroke, this.masks = t.masks, this.distressEffect = t.distressEffect, t.isClipping && !t.blendMode && (this.blendMode = "clip", this.knockoutParts || (this.knockoutParts = { fill: !0, scope: "group" })), this.name = t.name, this.visible = t.visible !== void 0 ? t.visible : !0, this.locked = t.locked !== void 0 ? t.locked : !1;
+    this.id = t.id || `element-${ie++}`, this.x = t.x !== void 0 ? t.x : 100, this.y = t.y !== void 0 ? t.y : 100, this.rotation = t.rotation !== void 0 ? t.rotation : 0, this.opacity = t.opacity !== void 0 ? t.opacity : 1, this.transformType = t.transformType || "custom", this.transformData = t.transformData || {}, this.blendMode = t.blendMode, this.knockoutParts = t.knockoutParts, this.stroke = t.stroke, this.masks = t.masks, this.distressEffect = t.distressEffect, t.isClipping && !t.blendMode && (this.blendMode = "clip", this.knockoutParts || (this.knockoutParts = { fill: !0, scope: "group" })), this.name = t.name, this.visible = t.visible !== void 0 ? t.visible : !0, this.locked = t.locked !== void 0 ? t.locked : !1;
   }
   /**
    * Get visual bounding box (tight fit around actual rendered content)
@@ -552,7 +554,7 @@ class Q {
    * Uses visual bounding box for better user experience
    */
   hitTest(t, e) {
-    const o = this.getVisualBoundingBox(), i = this.getRotationAnchor(), s = D.toRadiansInverse(this.rotation), a = Math.cos(s), n = Math.sin(s), h = t - i.x, l = e - i.y, c = h * a - l * n, g = h * n + l * a, d = i.x + c, f = i.y + g;
+    const o = this.getVisualBoundingBox(), s = this.getRotationAnchor(), i = D.toRadiansInverse(this.rotation), a = Math.cos(i), n = Math.sin(i), h = t - s.x, l = e - s.y, c = h * a - l * n, g = h * n + l * a, d = s.x + c, f = s.y + g;
     return d >= o.x && d <= o.x + o.width && f >= o.y && f <= o.y + o.height;
   }
   /**
@@ -578,8 +580,16 @@ class Q {
       // Effects properties (only include if defined)
       ...this.blendMode && { blendMode: this.blendMode },
       ...this.knockoutParts && { knockoutParts: { ...this.knockoutParts } },
-      ...this.stroke && { stroke: { ...this.stroke } },
-      ...this.masks && { masks: this.masks.map((t) => ({ ...t })) },
+      ...this.stroke && {
+        stroke: {
+          ...this.stroke,
+          ...this.stroke.dashArray && { dashArray: [...this.stroke.dashArray] }
+        }
+      },
+      // maskElement is a nested config object — structuredClone so clones don't share it
+      ...this.masks && {
+        masks: this.masks.map((t) => ({ ...t, maskElement: structuredClone(t.maskElement) }))
+      },
       ...this.distressEffect && { distressEffect: { ...this.distressEffect } },
       // Layer properties (only include if defined)
       ...this.name && { name: this.name },
@@ -655,10 +665,10 @@ class R {
    * @returns Point in local coordinates
    */
   worldToLocal(t, e) {
-    const o = this.element.rotation * Math.PI / 180, i = Math.cos(o), s = Math.sin(o), a = t - this.element.x, n = e - this.element.y;
+    const o = this.element.rotation * Math.PI / 180, s = Math.cos(o), i = Math.sin(o), a = t - this.element.x, n = e - this.element.y;
     return {
-      x: a * i - n * s,
-      y: a * s + n * i
+      x: a * s - n * i,
+      y: a * i + n * s
     };
   }
   /**
@@ -671,7 +681,7 @@ class R {
    * @returns Point in world coordinates
    */
   localToWorld(t, e) {
-    const o = -this.element.rotation * Math.PI / 180, i = Math.cos(o), s = Math.sin(o), a = t * i - e * s, n = t * s + e * i;
+    const o = -this.element.rotation * Math.PI / 180, s = Math.cos(o), i = Math.sin(o), a = t * s - e * i, n = t * i + e * s;
     return {
       x: this.element.x + a,
       y: this.element.y + n
@@ -687,10 +697,10 @@ class R {
    * @returns Delta in local space
    */
   worldDeltaToLocal(t, e) {
-    const o = this.element.rotation * Math.PI / 180, i = Math.cos(o), s = Math.sin(o);
+    const o = this.element.rotation * Math.PI / 180, s = Math.cos(o), i = Math.sin(o);
     return {
-      dx: t * i - e * s,
-      dy: t * s + e * i
+      dx: t * s - e * i,
+      dy: t * i + e * s
     };
   }
   /**
@@ -702,10 +712,10 @@ class R {
    * @returns Delta in world space
    */
   localDeltaToWorld(t, e) {
-    const o = -this.element.rotation * Math.PI / 180, i = Math.cos(o), s = Math.sin(o);
+    const o = -this.element.rotation * Math.PI / 180, s = Math.cos(o), i = Math.sin(o);
     return {
-      dx: t * i - e * s,
-      dy: t * s + e * i
+      dx: t * s - e * i,
+      dy: t * i + e * s
     };
   }
   /**
@@ -719,11 +729,11 @@ class R {
    * @param angleDegrees - Rotation angle in degrees (positive = clockwise in UI)
    * @returns Rotated point in world space
    */
-  static rotatePointAroundAnchor(t, e, o, i, s) {
-    const a = -s * Math.PI / 180, n = Math.cos(a), h = Math.sin(a), l = t - o, c = e - i, g = l * n - c * h, d = l * h + c * n;
+  static rotatePointAroundAnchor(t, e, o, s, i) {
+    const a = -i * Math.PI / 180, n = Math.cos(a), h = Math.sin(a), l = t - o, c = e - s, g = l * n - c * h, d = l * h + c * n;
     return {
       x: o + g,
-      y: i + d
+      y: s + d
     };
   }
   /**
@@ -2295,8 +2305,8 @@ function Ke(r = 0.1, t) {
   if (e.startsWith("oklch("))
     return `${e.slice(0, -1)} / ${r})`;
   if (e.startsWith("#")) {
-    const o = e.replace("#", ""), i = parseInt(o.substring(0, 2), 16), s = parseInt(o.substring(2, 4), 16), a = parseInt(o.substring(4, 6), 16);
-    return `rgba(${i}, ${s}, ${a}, ${r})`;
+    const o = e.replace("#", ""), s = parseInt(o.substring(0, 2), 16), i = parseInt(o.substring(2, 4), 16), a = parseInt(o.substring(4, 6), 16);
+    return `rgba(${s}, ${i}, ${a}, ${r})`;
   }
   return e;
 }
@@ -2328,13 +2338,13 @@ function oo(r) {
   const t = he(r);
   return t.startsWith("oklch(") ? `${t.slice(0, -1)} / 0.2)` : "rgba(0,0,0,0.2)";
 }
-function io(r) {
+function so(r) {
   if (typeof window > "u" || typeof document > "u")
     return "oklch(0% 0 0 / 0.2)";
   const t = document.documentElement;
   return getComputedStyle(t).getPropertyValue("--divider").trim() || "oklch(0% 0 0 / 0.2)";
 }
-function so(r) {
+function io(r) {
   if (typeof window > "u" || typeof document > "u")
     return "oklch(0% 0 0 / 0.5)";
   const t = document.documentElement, e = getComputedStyle(t).getPropertyValue("--foreground").trim();
@@ -2503,16 +2513,16 @@ class J {
       return e.refCount++, e.image;
     const o = new Image();
     o.crossOrigin = "anonymous";
-    const i = {
+    const s = {
       image: o,
       refCount: 1,
       loaded: !1
     };
     return o.onload = () => {
-      i.loaded = !0;
+      s.loaded = !0;
     }, o.onerror = () => {
-      i.loaded = !0;
-    }, this.cache.set(t, i), (!t.includes(":") || /^https?:\/\/|^data:|^blob:/.test(t)) && (o.src = t), o;
+      s.loaded = !0;
+    }, this.cache.set(t, s), (!t.includes(":") || /^https?:\/\/|^data:|^blob:/.test(t)) && (o.src = t), o;
   }
   /**
    * Release a reference to a cached image.
@@ -2568,13 +2578,13 @@ function C(r) {
 class pt extends Q {
   // Track URL acquired from ImageCache for release on destroy
   constructor(t = {}) {
-    var e, o, i, s, a, n, h, l, c, g;
+    var e, o, s, i, a, n, h, l, c, g;
     super(t), this.svgBlobUrl = null, this.loadTimeoutId = null, this.retryAttempt = 0, this.cachedImageUrl = null, this.transformType = "image", this.transformData = {
       type: "image",
       width: ((e = t.transformData) == null ? void 0 : e.width) || 200,
       height: ((o = t.transformData) == null ? void 0 : o.height) || 200,
-      cropX: ((i = t.transformData) == null ? void 0 : i.cropX) ?? 0,
-      cropY: ((s = t.transformData) == null ? void 0 : s.cropY) ?? 0,
+      cropX: ((s = t.transformData) == null ? void 0 : s.cropX) ?? 0,
+      cropY: ((i = t.transformData) == null ? void 0 : i.cropY) ?? 0,
       cropWidth: ((a = t.transformData) == null ? void 0 : a.cropWidth) ?? 1,
       cropHeight: ((n = t.transformData) == null ? void 0 : n.cropHeight) ?? 1,
       flipHorizontal: ((h = t.transformData) == null ? void 0 : h.flipHorizontal) ?? !1,
@@ -2609,28 +2619,28 @@ class pt extends Q {
     this.clearLoadTimeout(), this.releaseImageCache();
     const o = J.getInstance().acquire(t);
     this.cachedImageUrl = t;
-    let i = !1;
-    const s = () => {
-      i = !0, this.clearLoadTimeout();
+    let s = !1;
+    const i = () => {
+      s = !0, this.clearLoadTimeout();
     };
     if (o.complete && o.naturalWidth > 0) {
-      s(), this.imageElement = o, this.imageLoaded = !0, this.imageLoadState = "loaded", this.imageLoadError = null, this.imageAspectRatio = o.naturalWidth / o.naturalHeight, this.preserveDimensions || (this.transformData.height = this.transformData.width / this.imageAspectRatio), this.onLoadCallback && this.onLoadCallback(this.clone()), et(this.id);
+      i(), this.imageElement = o, this.imageLoaded = !0, this.imageLoadState = "loaded", this.imageLoadError = null, this.imageAspectRatio = o.naturalWidth / o.naturalHeight, this.preserveDimensions || (this.transformData.height = this.transformData.width / this.imageAspectRatio), this.onLoadCallback && this.onLoadCallback(this.clone()), et(this.id);
       return;
     }
     const a = o.onload, n = o.onerror;
     o.onload = (l) => {
-      i || (s(), this.imageElement = o, this.imageLoaded = !0, this.imageLoadState = "loaded", this.imageLoadError = null, this.imageAspectRatio = o.naturalWidth / o.naturalHeight, this.preserveDimensions || (this.transformData.height = this.transformData.width / this.imageAspectRatio), this.onLoadCallback && this.onLoadCallback(this.clone()), et(this.id), a && a !== o.onload && a(l));
+      s || (i(), this.imageElement = o, this.imageLoaded = !0, this.imageLoadState = "loaded", this.imageLoadError = null, this.imageAspectRatio = o.naturalWidth / o.naturalHeight, this.preserveDimensions || (this.transformData.height = this.transformData.width / this.imageAspectRatio), this.onLoadCallback && this.onLoadCallback(this.clone()), et(this.id), a && a !== o.onload && a(l));
     }, o.onerror = (l) => {
-      if (i) return;
-      s();
+      if (s) return;
+      i();
       const c = new Error(`Failed to load image: ${t}`);
       this.handleLoadFailure(t, c), n && n !== o.onerror && n(l);
     }, this.loadTimeoutId = setTimeout(() => {
-      if (i) return;
-      s(), o.src = "";
+      if (s) return;
+      i(), o.src = "";
       const l = new Error(`Image load timed out after ${kt}ms: ${t}`);
       this.handleLoadFailure(t, l);
-    }, kt), (!o.src || o.src !== t) && (o.src = t), !i && o.complete && o.naturalWidth > 0 && ((h = o.onload) == null || h.call(o, new Event("load")));
+    }, kt), (!o.src || o.src !== t) && (o.src = t), !s && o.complete && o.naturalWidth > 0 && ((h = o.onload) == null || h.call(o, new Event("load")));
   }
   /**
    * Handle a load failure - either retry with backoff or set error state.
@@ -2679,10 +2689,10 @@ class pt extends Q {
     this.revokeSvgBlobUrl();
     const e = new Image();
     e.crossOrigin = "anonymous", e.onload = () => {
-      const i = document.createElement("canvas");
-      i.width = e.width * 4, i.height = e.height * 4;
-      const s = i.getContext("2d");
-      s.scale(4, 4), s.drawImage(e, 0, 0), i.toBlob((a) => {
+      const s = document.createElement("canvas");
+      s.width = e.width * 4, s.height = e.height * 4;
+      const i = s.getContext("2d");
+      i.scale(4, 4), i.drawImage(e, 0, 0), s.toBlob((a) => {
         if (!a) {
           ot.error("Failed to convert SVG to blob"), this.imageLoaded = !1;
           return;
@@ -2703,10 +2713,10 @@ class pt extends Q {
   getBoundingBox() {
     if (this.isCropping) {
       const t = this.transformData.width * this.transformData.cropWidth, e = this.transformData.height * this.transformData.cropHeight;
-      let o = this.transformData.width / 2 - (this.transformData.cropX * this.transformData.width + t / 2), i = this.transformData.height / 2 - (this.transformData.cropY * this.transformData.height + e / 2);
-      const s = this.transformData.flipHorizontal ? -1 : 1, a = this.transformData.flipVertical ? -1 : 1;
-      o *= s, i *= a;
-      const n = Math.cos(D.toRadians(this.rotation)), h = Math.sin(D.toRadians(this.rotation)), l = o * n - i * h, c = o * h + i * n, g = this.x + l, d = this.y + c;
+      let o = this.transformData.width / 2 - (this.transformData.cropX * this.transformData.width + t / 2), s = this.transformData.height / 2 - (this.transformData.cropY * this.transformData.height + e / 2);
+      const i = this.transformData.flipHorizontal ? -1 : 1, a = this.transformData.flipVertical ? -1 : 1;
+      o *= i, s *= a;
+      const n = Math.cos(D.toRadians(this.rotation)), h = Math.sin(D.toRadians(this.rotation)), l = o * n - s * h, c = o * h + s * n, g = this.x + l, d = this.y + c;
       return {
         x: g - this.transformData.width / 2,
         y: d - this.transformData.height / 2,
@@ -2744,10 +2754,10 @@ class pt extends Q {
   getRotationAnchor() {
     if (this.isCropping) {
       const t = this.transformData.width * this.transformData.cropWidth, e = this.transformData.height * this.transformData.cropHeight;
-      let o = this.transformData.width / 2 - (this.transformData.cropX * this.transformData.width + t / 2), i = this.transformData.height / 2 - (this.transformData.cropY * this.transformData.height + e / 2);
-      const s = this.transformData.flipHorizontal ? -1 : 1, a = this.transformData.flipVertical ? -1 : 1;
-      o *= s, i *= a;
-      const n = Math.cos(D.toRadians(this.rotation)), h = Math.sin(D.toRadians(this.rotation)), l = o * n - i * h, c = o * h + i * n;
+      let o = this.transformData.width / 2 - (this.transformData.cropX * this.transformData.width + t / 2), s = this.transformData.height / 2 - (this.transformData.cropY * this.transformData.height + e / 2);
+      const i = this.transformData.flipHorizontal ? -1 : 1, a = this.transformData.flipVertical ? -1 : 1;
+      o *= i, s *= a;
+      const n = Math.cos(D.toRadians(this.rotation)), h = Math.sin(D.toRadians(this.rotation)), l = o * n - s * h, c = o * h + s * n;
       return {
         x: this.x + l,
         y: this.y + c
@@ -2764,10 +2774,10 @@ class pt extends Q {
   hitTest(t, e) {
     const o = this.worldToLocal(t, e);
     if (this.isCropping) {
-      const i = this.transformData.width * this.transformData.cropWidth, s = this.transformData.height * this.transformData.cropHeight, a = this.transformData.width / 2 - (this.transformData.cropX * this.transformData.width + i / 2), n = this.transformData.height / 2 - (this.transformData.cropY * this.transformData.height + s / 2), h = this.transformData.width / 2, l = this.transformData.height / 2;
+      const s = this.transformData.width * this.transformData.cropWidth, i = this.transformData.height * this.transformData.cropHeight, a = this.transformData.width / 2 - (this.transformData.cropX * this.transformData.width + s / 2), n = this.transformData.height / 2 - (this.transformData.cropY * this.transformData.height + i / 2), h = this.transformData.width / 2, l = this.transformData.height / 2;
       return o.x >= a - h && o.x <= a + h && o.y >= n - l && o.y <= n + l;
     } else {
-      const i = this.transformData.width * this.transformData.cropWidth, s = this.transformData.height * this.transformData.cropHeight, a = i / 2, n = s / 2;
+      const s = this.transformData.width * this.transformData.cropWidth, i = this.transformData.height * this.transformData.cropHeight, a = s / 2, n = i / 2;
       return o.x >= -a && o.x <= a && o.y >= -n && o.y <= n;
     }
   }
@@ -2780,8 +2790,8 @@ class pt extends Q {
       return;
     }
     t.save(), this.opacity !== void 0 && this.opacity !== 1 && (t.globalAlpha = this.opacity), t.translate(this.x, this.y), t.rotate(D.toRadians(this.rotation));
-    const i = this.transformData.flipHorizontal ? -1 : 1, s = this.transformData.flipVertical ? -1 : 1;
-    if (t.scale(i, s), this.isCropping) {
+    const s = this.transformData.flipHorizontal ? -1 : 1, i = this.transformData.flipVertical ? -1 : 1;
+    if (t.scale(s, i), this.isCropping) {
       const a = this.transformData.width * this.transformData.cropWidth, n = this.transformData.height * this.transformData.cropHeight, h = this.transformData.width / 2 - (this.transformData.cropX * this.transformData.width + a / 2), l = this.transformData.height / 2 - (this.transformData.cropY * this.transformData.height + n / 2), c = h - this.transformData.width / 2, g = l - this.transformData.height / 2, d = this.transformData.borderRadius || 0;
       if (d > 0) {
         t.save();
@@ -2842,48 +2852,48 @@ class pt extends Q {
    */
   renderPlaceholder(t) {
     t.save(), t.translate(this.x, this.y), t.rotate(D.toRadians(this.rotation));
-    const e = this.transformData.width * this.transformData.cropWidth, o = this.transformData.height * this.transformData.cropHeight, i = -e / 2, s = -o / 2;
+    const e = this.transformData.width * this.transformData.cropWidth, o = this.transformData.height * this.transformData.cropHeight, s = -e / 2, i = -o / 2;
     let a, n, h;
-    this.imageLoadState === "error" ? (a = "#f0e0e0", n = "#993333", h = "Image failed to load") : this.imageLoadState === "retrying" ? (a = "#e0e0e0", n = "#666", h = "Retrying...") : this.imageLoadState === "loading" ? (a = "#e0e0e0", n = "#666", h = "Loading...") : (a = "#e0e0e0", n = "#666", h = this.imageUrl ? "Loading..." : "No image"), t.fillStyle = a, t.fillRect(i, s, e, o), t.fillStyle = n, t.font = "14px system-ui, -apple-system, sans-serif", t.textAlign = "center", t.textBaseline = "middle", t.fillText(h, 0, 0), t.restore();
+    this.imageLoadState === "error" ? (a = "#f0e0e0", n = "#993333", h = "Image failed to load") : this.imageLoadState === "retrying" ? (a = "#e0e0e0", n = "#666", h = "Retrying...") : this.imageLoadState === "loading" ? (a = "#e0e0e0", n = "#666", h = "Loading...") : (a = "#e0e0e0", n = "#666", h = this.imageUrl ? "Loading..." : "No image"), t.fillStyle = a, t.fillRect(s, i, e, o), t.fillStyle = n, t.font = "14px system-ui, -apple-system, sans-serif", t.textAlign = "center", t.textBaseline = "middle", t.fillText(h, 0, 0), t.restore();
   }
   /**
    * Handle resize - maintain aspect ratio
    * @returns {boolean} true if resize was applied
    */
-  resize(t, e, o, i) {
-    let s, a;
-    this.isCropping ? (s = e / C(i).width, a = o / C(i).height) : (s = e / (i.width ?? 1), a = o / (i.height ?? 1));
-    const n = (s + a) / 2;
+  resize(t, e, o, s) {
+    let i, a;
+    this.isCropping ? (i = e / C(s).width, a = o / C(s).height) : (i = e / (s.width ?? 1), a = o / (s.height ?? 1));
+    const n = (i + a) / 2;
     let h = t;
-    this.isCropping && (h = this.remapAnchorForFlips(t, i));
+    this.isCropping && (h = this.remapAnchorForFlips(t, s));
     let l = n;
     if (this.isCropping) {
-      const I = this.transformData.width / C(i).width;
+      const I = this.transformData.width / C(s).width;
       n < I && (l = this.calculateMinScaleForCropBounds(
         h,
-        i,
+        s,
         n,
         I
       ));
     }
-    this.transformData.width = C(i).width * l, this.transformData.height = this.transformData.width / this.imageAspectRatio, this.rotation = i.rotation;
+    this.transformData.width = C(s).width * l, this.transformData.height = this.transformData.width / this.imageAspectRatio, this.rotation = s.rotation;
     let c, g;
     if (this.isCropping) {
-      const I = (C(i).cropX + C(i).cropWidth / 2) * C(i).width - C(i).width / 2, O = (C(i).cropY + C(i).cropHeight / 2) * C(i).height - C(i).height / 2, B = I, L = O, H = R.fromSnapshot(i).localDeltaToWorld(B, L), G = H.dx, $ = H.dy;
-      c = i.x - G, g = i.y - $;
+      const I = (C(s).cropX + C(s).cropWidth / 2) * C(s).width - C(s).width / 2, O = (C(s).cropY + C(s).cropHeight / 2) * C(s).height - C(s).height / 2, B = I, L = O, H = R.fromSnapshot(s).localDeltaToWorld(B, L), G = H.dx, $ = H.dy;
+      c = s.x - G, g = s.y - $;
     } else {
-      const I = (C(i).cropX + C(i).cropWidth / 2) * C(i).width - C(i).width / 2, O = (C(i).cropY + C(i).cropHeight / 2) * C(i).height - C(i).height / 2, B = I, L = O, H = R.fromSnapshot(i).localDeltaToWorld(B, L), G = H.dx, $ = H.dy;
-      c = i.x - G, g = i.y - $;
+      const I = (C(s).cropX + C(s).cropWidth / 2) * C(s).width - C(s).width / 2, O = (C(s).cropY + C(s).cropHeight / 2) * C(s).height - C(s).height / 2, B = I, L = O, H = R.fromSnapshot(s).localDeltaToWorld(B, L), G = H.dx, $ = H.dy;
+      c = s.x - G, g = s.y - $;
     }
     let d, f, u = 0, m = 0;
-    h === "top-left" ? (u = C(i).width / 2, m = C(i).height / 2) : h === "top-right" ? (u = -C(i).width / 2, m = C(i).height / 2) : h === "bottom-left" ? (u = C(i).width / 2, m = -C(i).height / 2) : h === "bottom-right" ? (u = -C(i).width / 2, m = -C(i).height / 2) : h === "middle-left" ? (u = C(i).width / 2, m = 0) : h === "middle-right" ? (u = -C(i).width / 2, m = 0) : h === "middle-top" ? (u = 0, m = C(i).height / 2) : h === "middle-bottom" && (u = 0, m = -C(i).height / 2);
-    const y = R.fromSnapshot(i).localDeltaToWorld(u, m), x = y.dx, b = y.dy;
+    h === "top-left" ? (u = C(s).width / 2, m = C(s).height / 2) : h === "top-right" ? (u = -C(s).width / 2, m = C(s).height / 2) : h === "bottom-left" ? (u = C(s).width / 2, m = -C(s).height / 2) : h === "bottom-right" ? (u = -C(s).width / 2, m = -C(s).height / 2) : h === "middle-left" ? (u = C(s).width / 2, m = 0) : h === "middle-right" ? (u = -C(s).width / 2, m = 0) : h === "middle-top" ? (u = 0, m = C(s).height / 2) : h === "middle-bottom" && (u = 0, m = -C(s).height / 2);
+    const y = R.fromSnapshot(s).localDeltaToWorld(u, m), x = y.dx, b = y.dy;
     d = c + x, f = g + b;
     let S = 0, v = 0;
     h === "top-left" ? (S = this.transformData.width / 2, v = this.transformData.height / 2) : h === "top-right" ? (S = -this.transformData.width / 2, v = this.transformData.height / 2) : h === "bottom-left" ? (S = this.transformData.width / 2, v = -this.transformData.height / 2) : h === "bottom-right" ? (S = -this.transformData.width / 2, v = -this.transformData.height / 2) : h === "middle-left" ? (S = this.transformData.width / 2, v = 0) : h === "middle-right" ? (S = -this.transformData.width / 2, v = 0) : h === "middle-top" ? (S = 0, v = this.transformData.height / 2) : h === "middle-bottom" && (S = 0, v = -this.transformData.height / 2);
     const T = new R(this).localDeltaToWorld(S, v), F = T.dx, A = T.dy, M = d - F, k = f - A;
     if (this.isCropping) {
-      const I = i.x, O = i.y, B = C(i).cropWidth * C(i).width, L = C(i).cropHeight * C(i).height;
+      const I = s.x, O = s.y, B = C(s).cropWidth * C(s).width, L = C(s).cropHeight * C(s).height;
       this.x = I, this.y = O;
       const _ = B / this.transformData.width, H = L / this.transformData.height, G = I - M, $ = O - k, At = new R(this).worldDeltaToLocal(G, $), Jt = At.dx, qt = At.dy, jt = this.transformData.width / 2 + Jt, Zt = this.transformData.height / 2 + qt, Kt = jt / this.transformData.width - _ / 2, Qt = Zt / this.transformData.height - H / 2;
       this.transformData.cropX = Kt, this.transformData.cropY = Qt, this.transformData.cropWidth = _, this.transformData.cropHeight = H;
@@ -2945,9 +2955,9 @@ class pt extends Q {
       // bottom-left
       { x: t.x + t.width, y: t.y + t.height }
       // bottom-right
-    ].map((s) => ({
-      x: this.x + s.x * e - s.y * o,
-      y: this.y + s.x * o + s.y * e
+    ].map((i) => ({
+      x: this.x + i.x * e - i.y * o,
+      y: this.y + i.x * o + i.y * e
     }));
   }
   /**
@@ -2955,8 +2965,8 @@ class pt extends Q {
    * Local coordinates are relative to this.x, this.y (the center of the visible area)
    */
   worldToLocal(t, e) {
-    const o = t - this.x, i = e - this.y, s = Math.cos(D.toRadiansInverse(this.rotation)), a = Math.sin(D.toRadiansInverse(this.rotation));
-    let n = o * s - i * a, h = o * a + i * s;
+    const o = t - this.x, s = e - this.y, i = Math.cos(D.toRadiansInverse(this.rotation)), a = Math.sin(D.toRadiansInverse(this.rotation));
+    let n = o * i - s * a, h = o * a + s * i;
     const l = this.transformData.flipHorizontal ? -1 : 1, c = this.transformData.flipVertical ? -1 : 1;
     return n *= l, h *= c, {
       x: n,
@@ -2969,9 +2979,9 @@ class pt extends Q {
    * Canvas transformations are applied in reverse: scale -> rotate -> translate
    */
   localToWorld(t, e) {
-    const o = this.transformData.flipHorizontal ? -1 : 1, i = this.transformData.flipVertical ? -1 : 1;
-    let s = t * o, a = e * i;
-    const n = Math.cos(D.toRadians(this.rotation)), h = Math.sin(D.toRadians(this.rotation)), l = s * n - a * h, c = s * h + a * n;
+    const o = this.transformData.flipHorizontal ? -1 : 1, s = this.transformData.flipVertical ? -1 : 1;
+    let i = t * o, a = e * s;
+    const n = Math.cos(D.toRadians(this.rotation)), h = Math.sin(D.toRadians(this.rotation)), l = i * n - a * h, c = i * h + a * n;
     return {
       x: this.x + l,
       y: this.y + c
@@ -2986,29 +2996,29 @@ class pt extends Q {
    */
   hitTestCropHandle(t, e, o = 1) {
     if (!this.isCropping) return null;
-    const i = this.getCropBoxBounds();
-    if (!i) return null;
-    const s = this.worldToLocal(t, e), a = 1 / o, n = ce * a, h = de * a, l = ge * a, c = [
-      { x: i.x, y: i.y, anchor: "top-left" },
-      { x: i.x + i.width, y: i.y, anchor: "top-right" },
-      { x: i.x, y: i.y + i.height, anchor: "bottom-left" },
-      { x: i.x + i.width, y: i.y + i.height, anchor: "bottom-right" }
+    const s = this.getCropBoxBounds();
+    if (!s) return null;
+    const i = this.worldToLocal(t, e), a = 1 / o, n = ce * a, h = de * a, l = ge * a, c = [
+      { x: s.x, y: s.y, anchor: "top-left" },
+      { x: s.x + s.width, y: s.y, anchor: "top-right" },
+      { x: s.x, y: s.y + s.height, anchor: "bottom-left" },
+      { x: s.x + s.width, y: s.y + s.height, anchor: "bottom-right" }
     ];
     for (const d of c) {
-      const f = s.x - d.x, u = s.y - d.y;
+      const f = i.x - d.x, u = i.y - d.y;
       if (Math.sqrt(f * f + u * u) <= n) {
         const p = this.localToWorld(d.x, d.y);
         return { type: "corner", anchor: d.anchor, worldX: p.x, worldY: p.y };
       }
     }
     const g = [
-      { x: i.x + i.width / 2, y: i.y, anchor: "top", orientation: "horizontal" },
-      { x: i.x + i.width / 2, y: i.y + i.height, anchor: "bottom", orientation: "horizontal" },
-      { x: i.x, y: i.y + i.height / 2, anchor: "left", orientation: "vertical" },
-      { x: i.x + i.width, y: i.y + i.height / 2, anchor: "right", orientation: "vertical" }
+      { x: s.x + s.width / 2, y: s.y, anchor: "top", orientation: "horizontal" },
+      { x: s.x + s.width / 2, y: s.y + s.height, anchor: "bottom", orientation: "horizontal" },
+      { x: s.x, y: s.y + s.height / 2, anchor: "left", orientation: "vertical" },
+      { x: s.x + s.width, y: s.y + s.height / 2, anchor: "right", orientation: "vertical" }
     ];
     for (const d of g) {
-      const f = s.x - d.x, u = s.y - d.y;
+      const f = i.x - d.x, u = i.y - d.y;
       let m, p;
       if (d.orientation === "horizontal" ? (m = h / 2, p = l / 2) : (m = l / 2, p = h / 2), Math.abs(f) <= m && Math.abs(u) <= p) {
         const y = this.localToWorld(d.x, d.y);
@@ -3025,8 +3035,8 @@ class pt extends Q {
     if (!this.isCropping) return !1;
     const o = this.getCropBoxBounds();
     if (!o) return !1;
-    const i = this.worldToLocal(t, e);
-    return i.x >= o.x && i.x <= o.x + o.width && i.y >= o.y && i.y <= o.y + o.height;
+    const s = this.worldToLocal(t, e);
+    return s.x >= o.x && s.x <= o.x + o.width && s.y >= o.y && s.y <= o.y + o.height;
   }
   /**
    * Update crop box (normalized 0-1 coordinates)
@@ -3036,46 +3046,46 @@ class pt extends Q {
    * @param {number} cropHeight - Normalized height (0-1)
    * @param {boolean} adjustPosition - Whether to adjust this.x, this.y to keep visual position stable (default: false)
    */
-  updateCrop(t, e, o, i, s = !1) {
-    let n = Math.max(0.1, Math.min(1, o)), h = Math.max(0.1, Math.min(1, i)), l = Math.max(0, Math.min(1 - n, t)), c = Math.max(0, Math.min(1 - h, e));
+  updateCrop(t, e, o, s, i = !1) {
+    let n = Math.max(0.1, Math.min(1, o)), h = Math.max(0.1, Math.min(1, s)), l = Math.max(0, Math.min(1 - n, t)), c = Math.max(0, Math.min(1 - h, e));
     l + n > 1 && (n = 1 - l), c + h > 1 && (h = 1 - c);
     let g = 0, d = 0;
-    if (s) {
+    if (i) {
       const f = this.transformData.cropX * this.transformData.width + this.transformData.cropWidth * this.transformData.width / 2, u = this.transformData.cropY * this.transformData.height + this.transformData.cropHeight * this.transformData.height / 2, m = l * this.transformData.width + n * this.transformData.width / 2, p = c * this.transformData.height + h * this.transformData.height / 2, y = m - f, x = p - u, b = Math.cos(D.toRadians(this.rotation)), S = Math.sin(D.toRadians(this.rotation));
       g = y * b - x * S, d = y * S + x * b;
     }
-    this.transformData.cropX = l, this.transformData.cropY = c, this.transformData.cropWidth = n, this.transformData.cropHeight = h, s && (this.x += g, this.y += d);
+    this.transformData.cropX = l, this.transformData.cropY = c, this.transformData.cropWidth = n, this.transformData.cropHeight = h, i && (this.x += g, this.y += d);
   }
   /**
    * Get the local position of the corner opposite to the given anchor
    * Corners are relative to frame center
    */
   getOppositeCornerLocalPosition(t, e, o) {
-    const i = e / 2, s = o / 2;
+    const s = e / 2, i = o / 2;
     return {
-      "top-left": { x: i, y: s },
+      "top-left": { x: s, y: i },
       // Opposite is bottom-right
-      "top-right": { x: -i, y: s },
+      "top-right": { x: -s, y: i },
       // Opposite is bottom-left
-      "bottom-left": { x: i, y: -s },
+      "bottom-left": { x: s, y: -i },
       // Opposite is top-right
-      "bottom-right": { x: -i, y: -s },
+      "bottom-right": { x: -s, y: -i },
       // Opposite is top-left
-      top: { x: 0, y: s },
+      top: { x: 0, y: i },
       // Opposite is bottom edge
-      bottom: { x: 0, y: -s },
+      bottom: { x: 0, y: -i },
       // Opposite is top edge
-      left: { x: i, y: 0 },
+      left: { x: s, y: 0 },
       // Opposite is right edge
-      right: { x: -i, y: 0 },
+      right: { x: -s, y: 0 },
       // Opposite is left edge
-      "middle-top": { x: 0, y: s },
+      "middle-top": { x: 0, y: i },
       // Opposite is bottom edge
-      "middle-bottom": { x: 0, y: -s },
+      "middle-bottom": { x: 0, y: -i },
       // Opposite is top edge
-      "middle-left": { x: i, y: 0 },
+      "middle-left": { x: s, y: 0 },
       // Opposite is right edge
-      "middle-right": { x: -i, y: 0 }
+      "middle-right": { x: -s, y: 0 }
       // Opposite is left edge
     }[t];
   }
@@ -3084,7 +3094,7 @@ class pt extends Q {
    * In crop mode, this.x/y is the crop center, not the frame center
    */
   calculateFrameCenterFromCropCenter(t) {
-    const e = C(t).width * C(t).cropWidth, o = C(t).height * C(t).cropHeight, i = C(t).width / 2 - (C(t).cropX * C(t).width + e / 2), s = C(t).height / 2 - (C(t).cropY * C(t).height + o / 2), n = new R(t).localDeltaToWorld(i, s);
+    const e = C(t).width * C(t).cropWidth, o = C(t).height * C(t).cropHeight, s = C(t).width / 2 - (C(t).cropX * C(t).width + e / 2), i = C(t).height / 2 - (C(t).cropY * C(t).height + o / 2), n = new R(t).localDeltaToWorld(s, i);
     return {
       x: t.x + n.dx,
       y: t.y + n.dy
@@ -3098,10 +3108,10 @@ class pt extends Q {
       t,
       C(e).width,
       C(e).height
-    ), i = this.calculateFrameCenterFromCropCenter(e), a = new R(e).localDeltaToWorld(o.x, o.y);
+    ), s = this.calculateFrameCenterFromCropCenter(e), a = new R(e).localDeltaToWorld(o.x, o.y);
     return {
-      x: i.x + a.dx,
-      y: i.y + a.dy
+      x: s.x + a.dx,
+      y: s.y + a.dy
     };
   }
   /**
@@ -3109,15 +3119,15 @@ class pt extends Q {
    * The opposite corner from the anchor stays fixed in world space
    */
   calculateFrameCenterAfterResize(t, e, o) {
-    const i = this.getFixedCornerWorldPosition(e, o), s = C(o).width * t, a = s / this.imageAspectRatio, n = this.getOppositeCornerLocalPosition(e, s, a), l = new R({
+    const s = this.getFixedCornerWorldPosition(e, o), i = C(o).width * t, a = i / this.imageAspectRatio, n = this.getOppositeCornerLocalPosition(e, i, a), l = new R({
       x: 0,
       // Will calculate frame center
       y: 0,
       rotation: o.rotation
     }).localDeltaToWorld(n.x, n.y);
     return {
-      x: i.x - l.dx,
-      y: i.y - l.dy
+      x: s.x - l.dx,
+      y: s.y - l.dy
     };
   }
   /**
@@ -3126,7 +3136,7 @@ class pt extends Q {
    * would be positioned within the frame after resize.
    */
   calculateCropStateAtScale(t, e, o) {
-    const i = C(o).width * t, s = i / this.imageAspectRatio, a = C(o).cropWidth * C(o).width, n = C(o).cropHeight * C(o).height, h = a / i, l = n / s, c = this.calculateFrameCenterAfterResize(t, e, o), g = {
+    const s = C(o).width * t, i = s / this.imageAspectRatio, a = C(o).cropWidth * C(o).width, n = C(o).cropHeight * C(o).height, h = a / s, l = n / i, c = this.calculateFrameCenterAfterResize(t, e, o), g = {
       x: o.x,
       // In crop mode, this.x/y is the crop center
       y: o.y
@@ -3134,7 +3144,7 @@ class pt extends Q {
       x: c.x,
       y: c.y,
       rotation: o.rotation
-    }).worldDeltaToLocal(d, f), p = i / 2 + m.dx, y = s / 2 + m.dy, x = p / i - h / 2, b = y / s - l / 2;
+    }).worldDeltaToLocal(d, f), p = s / 2 + m.dx, y = i / 2 + m.dy, x = p / s - h / 2, b = y / i - l / 2;
     return {
       cropX: x,
       cropY: b,
@@ -3146,20 +3156,20 @@ class pt extends Q {
    * Check if a given scale keeps crop within frame bounds
    */
   isScaleValidForCropBounds(t, e, o) {
-    const s = this.calculateCropStateAtScale(t, e, o);
-    if (s.cropWidth > 1 + 1e-4 || s.cropHeight > 1 + 1e-4)
+    const i = this.calculateCropStateAtScale(t, e, o);
+    if (i.cropWidth > 1 + 1e-4 || i.cropHeight > 1 + 1e-4)
       return !1;
-    const a = s.cropX, n = s.cropX + s.cropWidth, h = s.cropY, l = s.cropY + s.cropHeight;
+    const a = i.cropX, n = i.cropX + i.cropWidth, h = i.cropY, l = i.cropY + i.cropHeight;
     return a >= -1e-4 && h >= -1e-4 && n <= 1 + 1e-4 && l <= 1 + 1e-4;
   }
   /**
    * Calculate minimum scale that keeps crop within frame bounds
    * Uses binary search to find the largest scale >= proposedScale that satisfies constraints
    */
-  calculateMinScaleForCropBounds(t, e, o, i) {
+  calculateMinScaleForCropBounds(t, e, o, s) {
     if (this.isScaleValidForCropBounds(o, t, e))
       return o;
-    let n = o, h = i;
+    let n = o, h = s;
     for (let l = 0; l < 20; l++) {
       const c = (n + h) / 2;
       if (this.isScaleValidForCropBounds(c, t, e) ? h = c : n = c, Math.abs(h - n) < 1e-4)
@@ -3172,15 +3182,15 @@ class pt extends Q {
    */
   remapAnchorForFlips(t, e) {
     let o = t;
-    const i = C(e).flipHorizontal, s = C(e).flipVertical;
-    return i && (o.includes("left") ? o = o.replace("left", "right") : o.includes("right") && (o = o.replace("right", "left"))), s && (o.includes("top") ? o = o.replace("top", "bottom") : o.includes("bottom") && (o = o.replace("bottom", "top"))), o;
+    const s = C(e).flipHorizontal, i = C(e).flipVertical;
+    return s && (o.includes("left") ? o = o.replace("left", "right") : o.includes("right") && (o = o.replace("right", "left"))), i && (o.includes("top") ? o = o.replace("top", "bottom") : o.includes("bottom") && (o = o.replace("bottom", "top"))), o;
   }
   /**
    * Clone this element
    */
   clone() {
-    const t = this.toJSON(), { imageUrl: e, ...o } = t, i = new pt(o);
-    return i.imageUrl = this.imageUrl, i.imageElement = this.imageElement, i.imageLoaded = this.imageLoaded, i.imageAspectRatio = this.imageAspectRatio, i.isCropping = this.isCropping, i.onLoadCallback = this.onLoadCallback, i.isSvg = this.isSvg, i.imageLoadState = this.imageLoadState, i.imageLoadError = this.imageLoadError, i.preserveDimensions = this.preserveDimensions, i;
+    const t = this.toJSON(), { imageUrl: e, ...o } = t, s = new pt(o);
+    return s.imageUrl = this.imageUrl, s.imageElement = this.imageElement, s.imageLoaded = this.imageLoaded, s.imageAspectRatio = this.imageAspectRatio, s.isCropping = this.isCropping, s.onLoadCallback = this.onLoadCallback, s.isSvg = this.isSvg, s.imageLoadState = this.imageLoadState, s.imageLoadError = this.imageLoadError, s.preserveDimensions = this.preserveDimensions, s;
   }
   /**
    * Serialize to JSON
@@ -3200,6 +3210,8 @@ class pt extends Q {
       // Explicitly include to ensure number type
       imageUrl: this.imageUrl,
       imageAspectRatio: this.imageAspectRatio,
+      preserveDimensions: this.preserveDimensions,
+      // dimension lock for cover crop must survive save→load
       transformData: { ...this.transformData }
     };
   }
@@ -3236,7 +3248,7 @@ function Te() {
 }
 class P {
   constructor(t = []) {
-    this.spans = t.length > 0 ? t : [{ text: "", style: {} }], this.normalize();
+    this.spans = t.length > 0 ? t.map((e) => ({ ...e, style: { ...e.style } })) : [{ text: "", style: {} }], this.normalize();
   }
   /**
    * Create RichText from plain text string (no special formatting)
@@ -3281,31 +3293,31 @@ class P {
   applyStyle(t, e, o) {
     if (t >= e || t < 0 || e > this.getLength())
       return;
-    const i = [];
-    let s = 0;
+    const s = [];
+    let i = 0;
     for (const a of this.spans) {
-      const n = s, h = s + a.text.length;
+      const n = i, h = i + a.text.length;
       if (h <= t) {
-        i.push(a), s = h;
+        s.push(a), i = h;
         continue;
       }
       if (n >= e) {
-        i.push(a), s = h;
+        s.push(a), i = h;
         continue;
       }
       const l = Math.max(t, n), c = Math.min(e, h);
-      l > n && i.push({
+      l > n && s.push({
         text: a.text.substring(0, l - n),
         style: a.style
-      }), i.push({
+      }), s.push({
         text: a.text.substring(l - n, c - n),
         style: { ...a.style, ...o }
-      }), c < h && i.push({
+      }), c < h && s.push({
         text: a.text.substring(c - n),
         style: a.style
-      }), s = h;
+      }), i = h;
     }
-    this.spans = i, this.normalize();
+    this.spans = s, this.normalize();
   }
   /**
    * Insert text at a specific position with a given style
@@ -3315,24 +3327,24 @@ class P {
    */
   insert(t, e, o) {
     if (e.length === 0) return;
-    const i = [];
-    let s = 0;
+    const s = [];
+    let i = 0;
     for (const a of this.spans) {
-      const n = s, h = s + a.text.length;
-      if (t <= n && i.length === 0 && i.push({ text: e, style: o }), t > n && t <= h) {
+      const n = i, h = i + a.text.length;
+      if (t <= n && s.length === 0 && s.push({ text: e, style: o }), t > n && t <= h) {
         const l = t - n;
-        i.push({
+        s.push({
           text: a.text.substring(0, l),
           style: a.style
-        }), i.push({ text: e, style: o }), i.push({
+        }), s.push({ text: e, style: o }), s.push({
           text: a.text.substring(l),
           style: a.style
-        }), s = h;
+        }), i = h;
         continue;
       }
-      i.push(a), s = h;
+      s.push(a), i = h;
     }
-    t >= this.getLength() && !i.some((a) => a.text === e) && i.push({ text: e, style: o }), this.spans = i, this.normalize();
+    t >= this.getLength() && !s.some((a) => a.text === e) && s.push({ text: e, style: o }), this.spans = s, this.normalize();
   }
   /**
    * Delete text in a character range
@@ -3343,28 +3355,28 @@ class P {
     const o = this.getLength();
     if (t = Math.max(0, Math.min(t, o)), e = Math.max(0, Math.min(e, o)), t >= e)
       return;
-    const i = [];
-    let s = 0;
+    const s = [];
+    let i = 0;
     for (const a of this.spans) {
-      const n = s, h = s + a.text.length;
+      const n = i, h = i + a.text.length;
       if (h <= t) {
-        i.push(a), s = h;
+        s.push(a), i = h;
         continue;
       }
       if (n >= e) {
-        i.push(a), s = h;
+        s.push(a), i = h;
         continue;
       }
       const l = Math.max(t, n), c = Math.min(e, h);
-      l > n && i.push({
+      l > n && s.push({
         text: a.text.substring(0, l - n),
         style: a.style
-      }), c < h && i.push({
+      }), c < h && s.push({
         text: a.text.substring(c - n),
         style: a.style
-      }), s = h;
+      }), i = h;
     }
-    this.spans = i.length > 0 ? i : [{ text: "", style: {} }], this.normalize();
+    this.spans = s.length > 0 ? s : [{ text: "", style: {} }], this.normalize();
   }
   /**
    * Normalize spans by:
@@ -3381,11 +3393,11 @@ class P {
     const t = [];
     let e = this.spans[0];
     for (let o = 1; o < this.spans.length; o++) {
-      const i = this.spans[o];
-      this.stylesEqual(e.style, i.style) ? e = {
-        text: e.text + i.text,
+      const s = this.spans[o];
+      this.stylesEqual(e.style, s.style) ? e = {
+        text: e.text + s.text,
         style: e.style
-      } : (t.push(e), e = i);
+      } : (t.push(e), e = s);
     }
     t.push(e), this.spans = t;
   }
@@ -3421,7 +3433,7 @@ class P {
    * Serialize to JSON
    */
   toJSON() {
-    return { spans: this.spans };
+    return { spans: this.spans.map((t) => ({ ...t, style: { ...t.style } })) };
   }
   /**
    * Deserialize from JSON
@@ -3513,8 +3525,8 @@ class q extends Q {
    * handled by SelectionRenderer and HoverRenderer.
    */
   render(t, e = !1, o = !1) {
-    const i = t.globalAlpha;
-    this.opacity !== void 0 && this.opacity !== 1 && (t.globalAlpha = this.opacity), gt(this.transformType)(t, this.toJSON()), t.globalAlpha = i;
+    const s = t.globalAlpha;
+    this.opacity !== void 0 && this.opacity !== 1 && (t.globalAlpha = this.opacity), gt(this.transformType)(t, this.toJSON()), t.globalAlpha = s;
   }
   /**
    * Serialize to JSON
@@ -3590,8 +3602,8 @@ class q extends Q {
    * Apply character-level formatting to a text range
    */
   applyFormatting(t, e, o) {
-    const i = this.getRichText();
-    i.applyStyle(t, e, o), this.text = i.getText();
+    const s = this.getRichText();
+    s.applyStyle(t, e, o), this.text = s.getText();
   }
   /**
    * Update font size
@@ -3607,15 +3619,15 @@ class q extends Q {
     const e = this.color;
     if (this.color = t, this.richText)
       for (let o = 0; o < this.richText.spans.length; o++) {
-        const i = this.richText.spans[o];
-        (i.style.color === void 0 || i.style.color === e) && (i.style.color = t);
+        const s = this.richText.spans[o];
+        (s.style.color === void 0 || s.style.color === e) && (s.style.color = t);
       }
   }
   /**
    * Handle resize transform
    * Must be implemented by subclasses
    */
-  resize(t, e, o, i) {
+  resize(t, e, o, s) {
     throw new Error("resize() must be implemented by subclass");
   }
   /**
@@ -3643,19 +3655,19 @@ function yt() {
   return ht;
 }
 function at(r, t, e = !1, o = !1) {
-  const i = [];
-  return o && i.push("italic"), e && i.push("bold"), i.push(`${r}px`), i.push(t), i.join(" ");
+  const s = [];
+  return o && s.push("italic"), e && s.push("bold"), s.push(`${r}px`), s.push(t), s.join(" ");
 }
-function vt(r, t, e, o, i = !1, s = !1, a, n = !1) {
+function vt(r, t, e, o, s = !1, i = !1, a, n = !1) {
   const l = yt().getContext("2d");
-  if (l.font = at(e, o, i, s), r.trim().length === 0)
+  if (l.font = at(e, o, s, i), r.trim().length === 0)
     return [r];
   if (r.includes(`
 `)) {
     const M = r.split(`
 `), k = [];
     for (let I = 0; I < M.length; I++) {
-      const O = M[I], B = vt(O, t, e, o, i, s, void 0, n);
+      const O = M[I], B = vt(O, t, e, o, s, i, void 0, n);
       k.push(...B);
     }
     return k;
@@ -3705,25 +3717,25 @@ function vt(r, t, e, o, i = !1, s = !1, a, n = !1) {
   }
   return w;
 }
-function Ot(r, t, e, o = !1, i = !1) {
+function Ot(r, t, e, o = !1, s = !1) {
   const a = yt().getContext("2d");
-  return a.font = at(t, e, o, i), a.measureText(r).width;
+  return a.font = at(t, e, o, s), a.measureText(r).width;
 }
 function Tt(r, t, e = !1, o = !1) {
-  const s = yt().getContext("2d");
-  s.font = at(r, t, e, o);
-  const n = s.measureText("ÁÉÍgjpqy"), h = n.actualBoundingBoxAscent || r * 0.8, l = n.actualBoundingBoxDescent || r * 0.2, c = h + l;
+  const i = yt().getContext("2d");
+  i.font = at(r, t, e, o);
+  const n = i.measureText("ÁÉÍgjpqy"), h = n.actualBoundingBoxAscent || r * 0.8, l = n.actualBoundingBoxDescent || r * 0.2, c = h + l;
   return { ascent: h, descent: l, height: c };
 }
-function Bt(r, t, e, o, i = !1, s = !1, a, n = !1) {
-  const h = vt(r, t, e, o, i, s, a, n), l = r.includes(`
+function Bt(r, t, e, o, s = !1, i = !1, a, n = !1) {
+  const h = vt(r, t, e, o, s, i, a, n), l = r.includes(`
 `), c = h.map((x, b) => ({
     isParagraphStart: !l && b === 0,
     isParagraphEnd: !l && b === h.length - 1
   })), d = yt().getContext("2d");
-  d.font = at(e, o, i, s);
+  d.font = at(e, o, s, i);
   let f = 0;
-  const u = Tt(e, o, i, s);
+  const u = Tt(e, o, s, i);
   let m = 0;
   h.forEach((x, b) => {
     const S = c[b].isParagraphStart, v = c[b].isParagraphEnd;
@@ -3769,7 +3781,7 @@ function ve() {
   return lt;
 }
 function Fe(r, t, e) {
-  const o = ve(), i = [], s = (p, y) => {
+  const o = ve(), s = [], i = (p, y) => {
     const x = y.fontSize || e.fontSize, b = y.fontFamily || e.fontFamily, S = y.bold !== void 0 ? y.bold : e.bold || !1, v = y.italic !== void 0 ? y.italic : e.italic || !1;
     return o.font = at(x, b, S, v), o.measureText(p).width;
   }, a = (p, y) => p.fontSize === y.fontSize && p.fontFamily === y.fontFamily && p.color === y.color && p.bold === y.bold && p.italic === y.italic && p.underline === y.underline && p.strikethrough === y.strikethrough, n = [];
@@ -3791,7 +3803,7 @@ function Fe(r, t, e) {
   g.length > 0 && c.push({ text: g, startIdx: d, endIdx: h.length - 1 });
   let f = [], u = 0;
   const m = () => {
-    f.length > 0 && (i.push(f), f = [], u = 0);
+    f.length > 0 && (s.push(f), f = [], u = 0);
   };
   return c.forEach((p, y) => {
     const x = [];
@@ -3801,7 +3813,7 @@ function Fe(r, t, e) {
       T !== b ? (x.push({ text: S, style: n[b].style }), S = h[w], b = T) : S += h[w];
     }
     S.length > 0 && x.push({ text: S, style: n[b].style });
-    const v = x.reduce((w, T) => w + s(T.text, T.style), 0);
+    const v = x.reduce((w, T) => w + i(T.text, T.style), 0);
     if (p.text === " ") {
       if (f.length > 0) {
         const w = f[f.length - 1];
@@ -3815,7 +3827,7 @@ function Fe(r, t, e) {
         const T = Array.from(w.text);
         let F = "";
         for (const A of T) {
-          const M = s(A, w.style);
+          const M = i(A, w.style);
           if (u + M > t && u > 0) {
             if (F.length > 0) {
               if (f.length > 0) {
@@ -3844,27 +3856,27 @@ function Fe(r, t, e) {
         } else
           f.push({ ...w });
       }), u += v;
-  }), m(), i.length === 0 && i.push([]), i;
+  }), m(), s.length === 0 && s.push([]), s;
 }
 function Me(r) {
   const t = [];
   let e = [];
   return r.spans.forEach((o) => {
-    const i = o.text.split(`
+    const s = o.text.split(`
 `);
-    i.forEach((s, a) => {
-      s.length > 0 && e.push({ text: s, style: o.style }), a < i.length - 1 && (t.push(e), e = []);
+    s.forEach((i, a) => {
+      i.length > 0 && e.push({ text: i, style: o.style }), a < s.length - 1 && (t.push(e), e = []);
     });
   }), e.length > 0 && t.push(e), t.length === 0 && t.push([]), t;
 }
-function it(r) {
+function st(r) {
   return typeof r.width == "number" ? r.width : void 0;
 }
 function Ut(r, t) {
   r.width = t;
 }
 function Ae(r, t, e) {
-  const o = e.transformData, i = it(o), s = i !== void 0 ? i : e.width ?? 0, a = t / s, n = e.fontSize ?? r.fontSize, h = n * a;
+  const o = e.transformData, s = st(o), i = s !== void 0 ? s : e.width ?? 0, a = t / i, n = e.fontSize ?? r.fontSize, h = n * a;
   let l;
   if (h < 16 ? l = Math.round(h) : l = Math.round(h * 2) / 2, r.setFontSize(l), e.richText && e.richText instanceof P && typeof r.setRichText == "function") {
     const f = e.richText.clone();
@@ -3876,8 +3888,8 @@ function Ae(r, t, e) {
     r.setRichText(f);
   }
   const c = r.transformData;
-  if (it(c) !== void 0 && i !== void 0) {
-    const d = n > 0 ? l / n : a, f = i * d;
+  if (st(c) !== void 0 && s !== void 0) {
+    const d = n > 0 ? l / n : a, f = s * d;
     Ut(c, Math.max(20, Math.ceil(f)));
   }
 }
@@ -3885,16 +3897,16 @@ function De(r, t, e, o) {
   if (t !== "middle-left" && t !== "middle-right")
     return;
   r.fontSize = o.fontSize ?? r.fontSize;
-  const i = r.transformData;
-  if (it(i) !== void 0) {
-    Ut(i, Math.max(Yt, e));
-    const a = D.toRadiansInverse(r.rotation), n = Math.cos(a), h = Math.sin(a), l = o.transformData, g = it(l) ?? o.width ?? 0, f = (it(i) ?? 0) - g;
+  const s = r.transformData;
+  if (st(s) !== void 0) {
+    Ut(s, Math.max(Yt, e));
+    const a = D.toRadiansInverse(r.rotation), n = Math.cos(a), h = Math.sin(a), l = o.transformData, g = st(l) ?? o.width ?? 0, f = (st(s) ?? 0) - g;
     t === "middle-left" ? (r.x = o.x - f / 2 * n, r.y = o.y - f / 2 * h) : t === "middle-right" && (r.x = o.x + f / 2 * n, r.y = o.y + f / 2 * h);
   }
 }
-function Gt(r, t, e, o, i) {
-  const s = t.includes("top") || t.includes("bottom"), a = t.includes("middle");
-  s ? Ae(r, e, i) : a && De(r, t, e, i);
+function Gt(r, t, e, o, s) {
+  const i = t.includes("top") || t.includes("bottom"), a = t.includes("middle");
+  i ? Ae(r, e, s) : a && De(r, t, e, s);
 }
 class Ie extends q {
   // Temporary property used during resize operations only
@@ -3915,7 +3927,7 @@ class Ie extends q {
    * Returns the total height based on the tallest font in each line
    */
   calculateRichTextHeight() {
-    const t = this.getRichText(), e = this.transformData.width - j * 2, o = Me(t), i = [];
+    const t = this.getRichText(), e = this.transformData.width - j * 2, o = Me(t), s = [];
     if (o.forEach((h) => {
       Fe(h, e, {
         fontSize: this.fontSize,
@@ -3923,22 +3935,22 @@ class Ie extends q {
         bold: this.bold,
         italic: this.italic
       }).forEach((c) => {
-        i.push(c);
+        s.push(c);
       });
-    }), i.length === 0)
+    }), s.length === 0)
       return 0;
-    let s = 0, a = 0;
-    i.forEach((h) => {
+    let i = 0, a = 0;
+    s.forEach((h) => {
       h.forEach((l) => {
         const c = l.style.fontSize !== void 0 ? l.style.fontSize : this.fontSize, g = l.style.fontFamily !== void 0 ? l.style.fontFamily : this.fontFamily, d = l.style.bold !== void 0 ? l.style.bold : this.bold, f = l.style.italic !== void 0 ? l.style.italic : this.italic, u = Tt(c, g, d, f);
-        s = Math.max(s, u.height), a = Math.max(a, u.ascent);
+        i = Math.max(i, u.height), a = Math.max(a, u.ascent);
       });
     });
     const n = this.fontSize * Xt;
-    if (i.length === 1)
-      return s;
+    if (s.length === 1)
+      return i;
     {
-      const h = Tt(this.fontSize, this.fontFamily, this.bold, this.italic), l = (i.length - 1) * n + h.height, c = Math.max(0, a - h.ascent), g = Math.max(0, s - a - (h.height - h.ascent));
+      const h = Tt(this.fontSize, this.fontFamily, this.bold, this.italic), l = (s.length - 1) * n + h.height, c = Math.max(0, a - h.ascent), g = Math.max(0, i - a - (h.height - h.ascent));
       return l + c + g;
     }
   }
@@ -4023,13 +4035,13 @@ class Ie extends q {
    */
   render(t, e = !1, o = !1) {
     var n;
-    const i = this.opacity ?? 1, s = !!((n = this.stroke) != null && n.enabled);
-    if (i < 1 && s) {
-      this.renderWithOffscreen(t, i);
+    const s = this.opacity ?? 1, i = !!((n = this.stroke) != null && n.enabled);
+    if (s < 1 && i) {
+      this.renderWithOffscreen(t, s);
       return;
     }
     const a = t.globalAlpha;
-    i !== 1 && (t.globalAlpha = i), gt("custom")(t, this.toJSON()), t.globalAlpha = a;
+    s !== 1 && (t.globalAlpha = s), gt("custom")(t, this.toJSON()), t.globalAlpha = a;
   }
   /**
    * Render stroke+fill to an offscreen canvas at full opacity, then composite
@@ -4037,7 +4049,7 @@ class Ie extends q {
    */
   renderWithOffscreen(t, e) {
     var d;
-    const i = (((d = this.stroke) == null ? void 0 : d.width) || 0) + 20, s = this.getVisualBoundingBox(), a = Math.ceil(s.width + i * 2), n = Math.ceil(s.height + i * 2), h = document.createElement("canvas");
+    const s = (((d = this.stroke) == null ? void 0 : d.width) || 0) + 20, i = this.getVisualBoundingBox(), a = Math.ceil(i.width + s * 2), n = Math.ceil(i.height + s * 2), h = document.createElement("canvas");
     h.width = a, h.height = n;
     const l = h.getContext("2d");
     if (!l) {
@@ -4045,7 +4057,7 @@ class Ie extends q {
       t.globalAlpha = e, gt("custom")(t, this.toJSON()), t.globalAlpha = f;
       return;
     }
-    const c = s.x + s.width / 2, g = s.y + s.height / 2;
+    const c = i.x + i.width / 2, g = i.y + i.height / 2;
     l.translate(a / 2 - c, n / 2 - g), gt("custom")(l, this.toJSON()), t.save(), t.globalAlpha = e, t.drawImage(h, c - a / 2, g - n / 2), t.restore();
   }
   /**
@@ -4060,8 +4072,8 @@ class Ie extends q {
    * Corner handles: uniform scale (fontSize and width both change) - line count locked
    * Side handles: only width changes - text re-wraps naturally
    */
-  resize(t, e, o, i) {
-    if (t === "top-left" || t === "top-right" || t === "bottom-left" || t === "bottom-right" || (this._lockedLineCount = void 0), Gt(this, t, e, o, i), this._lockedLineCount !== void 0 && this._lockedLineCount > 0) {
+  resize(t, e, o, s) {
+    if (t === "top-left" || t === "top-right" || t === "bottom-left" || t === "bottom-right" || (this._lockedLineCount = void 0), Gt(this, t, e, o, s), this._lockedLineCount !== void 0 && this._lockedLineCount > 0) {
       const n = Ot(this.text, this.fontSize, this.fontFamily, this.bold, this.italic) / this._lockedLineCount + j * 2;
       this.transformData.width < n && (this.transformData.width = Math.ceil(n));
     }
@@ -4100,32 +4112,33 @@ class Ie extends q {
       transformType: "custom",
       transformData: {
         type: "custom",
-        controlPoints: this.transformData.controlPoints,
+        // Copy point objects so serialized output never aliases the live array
+        controlPoints: this.transformData.controlPoints.map((e) => ({ ...e })),
         width: this.transformData.width
       }
     };
   }
 }
 function ke(r, t, e, o) {
-  const i = D.toRadians(o), s = Math.cos(i), a = Math.sin(i);
+  const s = D.toRadians(o), i = Math.cos(s), a = Math.sin(s);
   let n = 0, h = 0;
   e === "top-left" ? (n = r.width, h = r.height) : e === "top-right" ? (n = 0, h = r.height) : e === "bottom-left" ? (n = r.width, h = 0) : e === "bottom-right" && (n = 0, h = 0);
-  const l = r.x + (n * s - h * a), c = r.y + (n * a + h * s);
+  const l = r.x + (n * i - h * a), c = r.y + (n * a + h * i);
   let g = 0, d = 0;
   e === "top-left" ? (g = t.width, d = t.height) : e === "top-right" ? (g = 0, d = t.height) : e === "bottom-left" ? (g = t.width, d = 0) : e === "bottom-right" && (g = 0, d = 0);
-  const f = l - (g * s - d * a), u = c - (g * a + d * s);
+  const f = l - (g * i - d * a), u = c - (g * a + d * i);
   return { x: f, y: u };
 }
 function No(r, t, e, o = 1) {
-  const i = r.width / 2, s = r.height + le / o, a = r.x + i, n = r.y + s, h = D.toRadians(t), l = Math.cos(h), c = Math.sin(h), g = a - e.x, d = n - e.y, f = g * l - d * c, u = g * c + d * l;
+  const s = r.width / 2, i = r.height + le / o, a = r.x + s, n = r.y + i, h = D.toRadians(t), l = Math.cos(h), c = Math.sin(h), g = a - e.x, d = n - e.y, f = g * l - d * c, u = g * c + d * l;
   return {
     x: e.x + f,
     y: e.y + u
   };
 }
 function Uo(r, t, e) {
-  const o = D.toRadians(t), i = Math.cos(o), s = Math.sin(o), a = (c, g) => {
-    const d = r.x + c, f = r.y + g, u = d - e.x, m = f - e.y, p = u * i - m * s, y = u * s + m * i;
+  const o = D.toRadians(t), s = Math.cos(o), i = Math.sin(o), a = (c, g) => {
+    const d = r.x + c, f = r.y + g, u = d - e.x, m = f - e.y, p = u * s - m * i, y = u * i + m * s;
     return {
       x: e.x + p,
       y: e.y + y
@@ -4160,16 +4173,16 @@ function Uo(r, t, e) {
     l("edge", "middle-bottom", n / 2, h)
   ];
 }
-function Go(r, t, e, o, i) {
-  const s = r - e, a = t - o;
-  return s * s + a * a <= i * i;
+function Go(r, t, e, o, s) {
+  const i = r - e, a = t - o;
+  return i * i + a * a <= s * s;
 }
 function $o(r, t, e, o) {
-  const i = D.toRadiansInverse(o), s = Math.cos(i), a = Math.sin(i), n = r - e.x, h = t - e.y, l = n * s - h * a, c = n * a + h * s;
+  const s = D.toRadiansInverse(o), i = Math.cos(s), a = Math.sin(s), n = r - e.x, h = t - e.y, l = n * i - h * a, c = n * a + h * i;
   return l >= 0 && l <= e.width && c >= 0 && c <= e.height;
 }
-function tt(r, t, e = "Arial", o = !1, i = !1) {
-  const a = document.createElement("canvas").getContext("2d"), n = o ? "bold" : "normal", h = i ? "italic" : "normal";
+function tt(r, t, e = "Arial", o = !1, s = !1) {
+  const a = document.createElement("canvas").getContext("2d"), n = o ? "bold" : "normal", h = s ? "italic" : "normal";
   return a.font = `${h} ${n} ${t}px ${e}`, a.measureText(r).width;
 }
 function Vo(r) {
@@ -4184,11 +4197,11 @@ function Jo(r, t, e, o) {
 function qo(r, t, e) {
   return Math.abs(r - t) <= e;
 }
-function Ee(r, t, e, o, i, s = 0, a = "") {
+function Ee(r, t, e, o, s, i = 0, a = "") {
   const n = r - e, h = t - o;
   let l = Math.atan2(h, n) * (180 / Math.PI);
-  if (l = (l % 360 + 360) % 360, i === "corner") {
-    if (Math.abs(s) < 0.1) {
+  if (l = (l % 360 + 360) % 360, s === "corner") {
+    if (Math.abs(i) < 0.1) {
       if (a === "top-left" || a === "bottom-right")
         return "nwse-resize";
       if (a === "top-right" || a === "bottom-left")
@@ -4209,7 +4222,7 @@ function Oe(r) {
 }
 function jo(r, t, e = []) {
   const o = Oe(r);
-  r.lineWidth = o > 0 ? t / o : t, e.length > 0 && r.setLineDash(o > 0 ? e.map((i) => i / o) : e);
+  r.lineWidth = o > 0 ? t / o : t, e.length > 0 && r.setLineDash(o > 0 ? e.map((s) => s / o) : e);
 }
 class Be extends q {
   constructor(t = {}) {
@@ -4241,11 +4254,11 @@ class Be extends q {
    * For circular text, calculate the arc bounds where text actually appears
    */
   getVisualBoundingBox() {
-    const t = this.transformData.radius * this.transformData.scale, e = this.fontSize * this.transformData.scale, i = tt(this.text, e, this.fontFamily, this.bold, this.italic) / t, s = -Math.PI / 2 - i / 2, a = -Math.PI / 2 + i / 2, n = t > e / 2 ? t - e / 2 : t * 0.1, h = t + e / 2;
+    const t = this.transformData.radius * this.transformData.scale, e = this.fontSize * this.transformData.scale, s = tt(this.text, e, this.fontFamily, this.bold, this.italic) / t, i = -Math.PI / 2 - s / 2, a = -Math.PI / 2 + s / 2, n = t > e / 2 ? t - e / 2 : t * 0.1, h = t + e / 2;
     let l = 1 / 0, c = -1 / 0, g = 1 / 0, d = -1 / 0;
     const f = 10;
     for (let u = 0; u <= f; u++) {
-      const m = s + (a - s) * (u / f), p = this.x + Math.cos(m) * n, y = this.y + Math.sin(m) * n, x = this.x + Math.cos(m) * h, b = this.y + Math.sin(m) * h;
+      const m = i + (a - i) * (u / f), p = this.x + Math.cos(m) * n, y = this.y + Math.sin(m) * n, x = this.x + Math.cos(m) * h, b = this.y + Math.sin(m) * h;
       l = Math.min(l, p, x), c = Math.max(c, p, x), g = Math.min(g, y, b), d = Math.max(d, y, b);
     }
     return {
@@ -4264,15 +4277,15 @@ class Be extends q {
    * Handle resize
    * For circle, we maintain uniform scale and keep scale on the transform
    */
-  resize(t, e, o, i) {
-    const s = i.transformData, a = (e + o) / 2, n = (i.width + i.height) / 2, h = a / n, l = s.scale * h, c = Math.max(0.1, Math.min(10, l));
+  resize(t, e, o, s) {
+    const i = s.transformData, a = (e + o) / 2, n = (s.width + s.height) / 2, h = a / n, l = i.scale * h, c = Math.max(0.1, Math.min(10, l));
     this.transformData.scale = c;
     const g = this.getBoundingBox(), d = ke(
       {
-        x: i.x - s.radius * s.scale,
-        y: i.y - s.radius * s.scale,
-        width: s.radius * 2 * s.scale,
-        height: s.radius * 2 * s.scale
+        x: s.x - i.radius * i.scale,
+        y: s.y - i.radius * i.scale,
+        width: i.radius * 2 * i.scale,
+        height: i.radius * 2 * i.scale
       },
       { width: g.width, height: g.height },
       t,
@@ -4361,10 +4374,10 @@ class Re extends q {
     };
   }
   getVisualBoundingBox() {
-    const t = this.text.split(""), e = t.map((u) => tt(u, this.fontSize, this.fontFamily)), o = e.reduce((u, m) => u + m, 0), i = this.transformData.width / 2, s = 0.3, n = this.fontSize / 2;
+    const t = this.text.split(""), e = t.map((u) => tt(u, this.fontSize, this.fontFamily)), o = e.reduce((u, m) => u + m, 0), s = this.transformData.width / 2, i = 0.3, n = this.fontSize / 2;
     let h = 1 / 0, l = -1 / 0, c = 1 / 0, g = -1 / 0, d = -o / 2;
     t.forEach((u, m) => {
-      const p = e[m], y = d + p / 2, x = y / i, b = (Math.pow(x, 2) - 1) * this.transformData.archHeight * this.fontSize, S = 2 * x * this.transformData.archHeight;
+      const p = e[m], y = d + p / 2, x = y / s, b = (Math.pow(x, 2) - 1) * this.transformData.archHeight * this.fontSize, S = 2 * x * this.transformData.archHeight;
       [
         { x: -p / 2, y: -n },
         // top-left
@@ -4375,7 +4388,7 @@ class Re extends q {
         { x: p / 2, y: n }
         // bottom-right
       ].forEach((w) => {
-        const T = w.x, F = w.y + S * s * w.x, A = y + T, M = b + F;
+        const T = w.x, F = w.y + S * i * w.x, A = y + T, M = b + F;
         h = Math.min(h, A), l = Math.max(l, A), c = Math.min(c, M), g = Math.max(g, M);
       }), d += p;
     });
@@ -4387,22 +4400,22 @@ class Re extends q {
       height: g - c
     };
   }
-  resize(t, e, o, i) {
-    const s = t.includes("top") || t.includes("bottom"), a = t.includes("middle"), n = i.transformData;
-    if (s) {
-      const h = e / i.width, l = i.fontSize * h;
+  resize(t, e, o, s) {
+    const i = t.includes("top") || t.includes("bottom"), a = t.includes("middle"), n = s.transformData;
+    if (i) {
+      const h = e / s.width, l = s.fontSize * h;
       this.setFontSize(l);
       const c = n.width * h;
       this.transformData.width = Math.max(50, c);
     } else if (a && (t === "middle-left" || t === "middle-right")) {
-      this.fontSize = i.fontSize, this.transformData.width = Math.max(50, e);
-      const h = e - i.width, l = this.rotation * Math.PI / 180, c = Math.cos(l), g = Math.sin(l);
+      this.fontSize = s.fontSize, this.transformData.width = Math.max(50, e);
+      const h = e - s.width, l = this.rotation * Math.PI / 180, c = Math.cos(l), g = Math.sin(l);
       if (t === "middle-left") {
         const d = -h / 2;
-        this.x = i.x + d * c, this.y = i.y + d * g;
+        this.x = s.x + d * c, this.y = s.y + d * g;
       } else if (t === "middle-right") {
         const d = h / 2;
-        this.x = i.x + d * c, this.y = i.y + d * g;
+        this.x = s.x + d * c, this.y = s.y + d * g;
       }
     }
   }
@@ -4434,7 +4447,7 @@ class Re extends q {
     };
   }
 }
-const st = {
+const it = {
   amplitude: 0.2,
   // 20% - subtle wave effect
   frequency: 1.2,
@@ -4459,9 +4472,9 @@ class We extends q {
     const e = t.transformData;
     this.transformData = {
       type: "wave",
-      amplitude: (e == null ? void 0 : e.amplitude) ?? st.amplitude,
-      frequency: (e == null ? void 0 : e.frequency) ?? st.frequency,
-      width: (e == null ? void 0 : e.width) ?? st.width
+      amplitude: (e == null ? void 0 : e.amplitude) ?? it.amplitude,
+      frequency: (e == null ? void 0 : e.frequency) ?? it.frequency,
+      width: (e == null ? void 0 : e.width) ?? it.width
     };
   }
   getBoundingBox() {
@@ -4474,18 +4487,18 @@ class We extends q {
     };
   }
   getVisualBoundingBox() {
-    const t = this.text.split(""), e = t.map((d) => tt(d, this.fontSize, this.fontFamily)), o = e.reduce((d, f) => d + f, 0), s = this.fontSize / 2;
+    const t = this.text.split(""), e = t.map((d) => tt(d, this.fontSize, this.fontFamily)), o = e.reduce((d, f) => d + f, 0), i = this.fontSize / 2;
     let a = 1 / 0, n = -1 / 0, h = 1 / 0, l = -1 / 0, c = -o / 2;
     t.forEach((d, f) => {
       const u = e[f], m = c + u / 2, p = m / (this.transformData.width / 2), y = this.transformData.amplitude * this.fontSize * Math.sin(this.transformData.frequency * Math.PI * p), x = this.transformData.amplitude * this.transformData.frequency * Math.PI * Math.cos(this.transformData.frequency * Math.PI * p);
       [
-        { x: -u / 2, y: -s },
+        { x: -u / 2, y: -i },
         // top-left
-        { x: u / 2, y: -s },
+        { x: u / 2, y: -i },
         // top-right
-        { x: -u / 2, y: s },
+        { x: -u / 2, y: i },
         // bottom-left
-        { x: u / 2, y: s }
+        { x: u / 2, y: i }
         // bottom-right
       ].forEach((S) => {
         const v = S.x, w = S.y + x * pe * S.x, T = m + v, F = y + w;
@@ -4500,8 +4513,8 @@ class We extends q {
       height: l - h
     };
   }
-  resize(t, e, o, i) {
-    Gt(this, t, e, o, i);
+  resize(t, e, o, s) {
+    Gt(this, t, e, o, s);
   }
   getEnabledAnchors() {
     return ["top-left", "top-right", "bottom-left", "bottom-right"];
@@ -4543,7 +4556,7 @@ class ze extends q {
     };
   }
   getVisualBoundingBox() {
-    const t = this.text.split(""), e = t.map((f) => tt(f, this.fontSize, this.fontFamily)), o = e.reduce((f, u) => f + u, 0), i = 0.3, a = this.fontSize / 2;
+    const t = this.text.split(""), e = t.map((f) => tt(f, this.fontSize, this.fontFamily)), o = e.reduce((f, u) => f + u, 0), s = 0.3, a = this.fontSize / 2;
     let n = 1 / 0, h = -1 / 0, l = 1 / 0, c = -1 / 0, g = -o / 2;
     t.forEach((f, u) => {
       const m = e[u], p = g + m / 2, y = p / (this.transformData.width / 2), x = Math.abs(y), b = this.transformData.amplitude * x, S = b * this.fontSize * Math.sin(this.transformData.frequency * Math.PI * y), v = b * this.transformData.frequency * Math.PI * Math.cos(this.transformData.frequency * Math.PI * y), w = this.transformData.amplitude * Math.sign(y) * Math.sin(this.transformData.frequency * Math.PI * y), T = v + w;
@@ -4557,7 +4570,7 @@ class ze extends q {
         { x: m / 2, y: a }
         // bottom-right
       ].forEach((A) => {
-        const M = A.x, k = A.y + T * i * A.x, I = p + M, O = S + k;
+        const M = A.x, k = A.y + T * s * A.x, I = p + M, O = S + k;
         n = Math.min(n, I), h = Math.max(h, I), l = Math.min(l, O), c = Math.max(c, O);
       }), g += m;
     });
@@ -4569,22 +4582,22 @@ class ze extends q {
       height: c - l
     };
   }
-  resize(t, e, o, i) {
-    const s = t.includes("top") || t.includes("bottom"), a = t.includes("middle"), n = i.transformData;
-    if (s) {
-      const h = e / i.width, l = i.fontSize * h;
+  resize(t, e, o, s) {
+    const i = t.includes("top") || t.includes("bottom"), a = t.includes("middle"), n = s.transformData;
+    if (i) {
+      const h = e / s.width, l = s.fontSize * h;
       this.setFontSize(l);
       const c = n.width * h;
       this.transformData.width = Math.max(50, c);
     } else if (a && (t === "middle-left" || t === "middle-right")) {
-      this.fontSize = i.fontSize, this.transformData.width = Math.max(50, e);
-      const h = e - i.width, l = this.rotation * Math.PI / 180, c = Math.cos(l), g = Math.sin(l);
+      this.fontSize = s.fontSize, this.transformData.width = Math.max(50, e);
+      const h = e - s.width, l = this.rotation * Math.PI / 180, c = Math.cos(l), g = Math.sin(l);
       if (t === "middle-left") {
         const d = -h / 2;
-        this.x = i.x + d * c, this.y = i.y + d * g;
+        this.x = s.x + d * c, this.y = s.y + d * g;
       } else if (t === "middle-right") {
         const d = h / 2;
-        this.x = i.x + d * c, this.y = i.y + d * g;
+        this.x = s.x + d * c, this.y = s.y + d * g;
       }
     }
   }
@@ -4638,7 +4651,7 @@ class Xe extends q {
     };
   }
   getVisualBoundingBox() {
-    const e = tt(this.text, this.fontSize, this.fontFamily), o = this.fontSize * 1.2, i = -this.transformData.leanAmount * Math.PI / 4, s = Math.tan(i), a = [
+    const e = tt(this.text, this.fontSize, this.fontFamily), o = this.fontSize * 1.2, s = -this.transformData.leanAmount * Math.PI / 4, i = Math.tan(s), a = [
       { x: -e / 2, y: -o / 2 },
       // top-left
       { x: e / 2, y: -o / 2 },
@@ -4650,7 +4663,7 @@ class Xe extends q {
     ];
     let n = 1 / 0, h = -1 / 0, l = 1 / 0, c = -1 / 0;
     a.forEach((d) => {
-      const f = d.x + s * d.y, u = d.y;
+      const f = d.x + i * d.y, u = d.y;
       n = Math.min(n, f), h = Math.max(h, f), l = Math.min(l, u), c = Math.max(c, u);
     });
     const g = 2;
@@ -4661,22 +4674,22 @@ class Xe extends q {
       height: c - l
     };
   }
-  resize(t, e, o, i) {
-    const s = t.includes("top") || t.includes("bottom"), a = t.includes("middle"), n = i.transformData;
-    if (s) {
-      const h = e / i.width, l = i.fontSize * h;
+  resize(t, e, o, s) {
+    const i = t.includes("top") || t.includes("bottom"), a = t.includes("middle"), n = s.transformData;
+    if (i) {
+      const h = e / s.width, l = s.fontSize * h;
       this.setFontSize(l);
       const c = n.width * h;
       this.transformData.width = Math.max(50, c);
     } else if (a && (t === "middle-left" || t === "middle-right")) {
-      this.fontSize = i.fontSize, this.transformData.width = Math.max(50, e);
+      this.fontSize = s.fontSize, this.transformData.width = Math.max(50, e);
       const h = e - n.width, l = this.rotation * Math.PI / 180, c = Math.cos(l), g = Math.sin(l);
       if (t === "middle-left") {
         const d = -h / 2;
-        this.x = i.x + d * c, this.y = i.y + d * g;
+        this.x = s.x + d * c, this.y = s.y + d * g;
       } else if (t === "middle-right") {
         const d = h / 2;
-        this.x = i.x + d * c, this.y = i.y + d * g;
+        this.x = s.x + d * c, this.y = s.y + d * g;
       }
     }
   }
@@ -4719,19 +4732,19 @@ class Ye extends q {
     };
   }
   getBoundingBox() {
-    const t = this.transformData.ascendAngle * Math.PI / 180, e = this.transformData.width, o = e * Math.tan(t), i = Math.abs(o) + this.fontSize * 1.2, s = o > 0 ? -i : 0;
+    const t = this.transformData.ascendAngle * Math.PI / 180, e = this.transformData.width, o = e * Math.tan(t), s = Math.abs(o) + this.fontSize * 1.2, i = o > 0 ? -s : 0;
     return {
       x: this.x - e / 2,
-      y: this.y + s,
+      y: this.y + i,
       width: e,
-      height: i
+      height: s
     };
   }
   getVisualBoundingBox() {
-    const t = this.text.split(""), e = t.map((m) => tt(m, this.fontSize, this.fontFamily)), o = e.reduce((m, p) => m + p, 0), i = this.transformData.ascendAngle * Math.PI / 180, s = Math.tan(i), a = 1, h = this.fontSize / 2;
+    const t = this.text.split(""), e = t.map((m) => tt(m, this.fontSize, this.fontFamily)), o = e.reduce((m, p) => m + p, 0), s = this.transformData.ascendAngle * Math.PI / 180, i = Math.tan(s), a = 1, h = this.fontSize / 2;
     let l = 1 / 0, c = -1 / 0, g = 1 / 0, d = -1 / 0, f = -o / 2;
     t.forEach((m, p) => {
-      const y = e[p], x = f + y / 2, b = x * s;
+      const y = e[p], x = f + y / 2, b = x * i;
       [
         { x: -y / 2, y: -h },
         // top-left
@@ -4742,7 +4755,7 @@ class Ye extends q {
         { x: y / 2, y: h }
         // bottom-right
       ].forEach((v) => {
-        const w = v.x, T = v.y + s * a * v.x, F = x + w, A = b + T;
+        const w = v.x, T = v.y + i * a * v.x, F = x + w, A = b + T;
         l = Math.min(l, F), c = Math.max(c, F), g = Math.min(g, A), d = Math.max(d, A);
       }), f += y;
     });
@@ -4754,22 +4767,22 @@ class Ye extends q {
       height: d - g
     };
   }
-  resize(t, e, o, i) {
-    const s = t.includes("top") || t.includes("bottom"), a = t.includes("middle"), n = i.transformData;
-    if (s) {
-      const h = e / i.width, l = i.fontSize * h;
+  resize(t, e, o, s) {
+    const i = t.includes("top") || t.includes("bottom"), a = t.includes("middle"), n = s.transformData;
+    if (i) {
+      const h = e / s.width, l = s.fontSize * h;
       this.setFontSize(l);
       const c = n.width * h;
       this.transformData.width = Math.max(50, c);
     } else if (a && (t === "middle-left" || t === "middle-right")) {
-      this.fontSize = i.fontSize, this.transformData.width = Math.max(50, e);
-      const h = e - i.width, l = this.rotation * Math.PI / 180, c = Math.cos(l), g = Math.sin(l);
+      this.fontSize = s.fontSize, this.transformData.width = Math.max(50, e);
+      const h = e - s.width, l = this.rotation * Math.PI / 180, c = Math.cos(l), g = Math.sin(l);
       if (t === "middle-left") {
         const d = -h / 2;
-        this.x = i.x + d * c, this.y = i.y + d * g;
+        this.x = s.x + d * c, this.y = s.y + d * g;
       } else if (t === "middle-right") {
         const d = h / 2;
-        this.x = i.x + d * c, this.y = i.y + d * g;
+        this.x = s.x + d * c, this.y = s.y + d * g;
       }
     }
   }
@@ -4803,14 +4816,14 @@ class Ye extends q {
 }
 class Ft extends Q {
   constructor(t = {}) {
-    var o, i, s, a, n, h, l, c, g, d, f;
+    var o, s, i, a, n, h, l, c, g, d, f;
     super(t), this.transformType = "shape";
     const e = "rectangle";
     this.transformData = {
       type: "shape",
       shapeType: ((o = t.transformData) == null ? void 0 : o.shapeType) || e,
-      width: ((i = t.transformData) == null ? void 0 : i.width) || 200,
-      height: ((s = t.transformData) == null ? void 0 : s.height) || 200,
+      width: ((s = t.transformData) == null ? void 0 : s.width) || 200,
+      height: ((i = t.transformData) == null ? void 0 : i.height) || 200,
       borderRadius: ((a = t.transformData) == null ? void 0 : a.borderRadius) ?? 3,
       // Default 3% radius (~6px on 200x200 shape, matches hover border)
       radiusX: (n = t.transformData) == null ? void 0 : n.radiusX,
@@ -4853,34 +4866,34 @@ class Ft extends Q {
   getVisualBoundingBox() {
     const { shapeType: t, width: e, height: o } = this.transformData;
     if (t === "circle") {
-      const i = Math.min(e, o) / 2;
+      const s = Math.min(e, o) / 2;
       return {
-        x: this.x - i,
-        y: this.y - i,
-        width: i * 2,
-        height: i * 2
+        x: this.x - s,
+        y: this.y - s,
+        width: s * 2,
+        height: s * 2
       };
     }
     if (t === "polygon" || t === "star") {
-      const i = Math.min(e, o) / 2;
-      let s = 1 / 0, a = 1 / 0, n = -1 / 0, h = -1 / 0;
+      const s = Math.min(e, o) / 2;
+      let i = 1 / 0, a = 1 / 0, n = -1 / 0, h = -1 / 0;
       if (t === "polygon") {
         const l = this.transformData.sides || 5;
         for (let c = 0; c < l; c++) {
-          const g = c * 2 * Math.PI / l - Math.PI / 2, d = i * Math.cos(g), f = i * Math.sin(g);
-          d < s && (s = d), d > n && (n = d), f < a && (a = f), f > h && (h = f);
+          const g = c * 2 * Math.PI / l - Math.PI / 2, d = s * Math.cos(g), f = s * Math.sin(g);
+          d < i && (i = d), d > n && (n = d), f < a && (a = f), f > h && (h = f);
         }
       } else {
-        const l = this.transformData.points || 5, c = i, g = c * (this.transformData.innerRadius ?? 0.4);
+        const l = this.transformData.points || 5, c = s, g = c * (this.transformData.innerRadius ?? 0.4);
         for (let d = 0; d < l * 2; d++) {
           const f = d * Math.PI / l - Math.PI / 2, u = d % 2 === 0 ? c : g, m = u * Math.cos(f), p = u * Math.sin(f);
-          m < s && (s = m), m > n && (n = m), p < a && (a = p), p > h && (h = p);
+          m < i && (i = m), m > n && (n = m), p < a && (a = p), p > h && (h = p);
         }
       }
       return {
-        x: this.x + s,
+        x: this.x + i,
         y: this.y + a,
-        width: n - s,
+        width: n - i,
         height: h - a
       };
     }
@@ -4897,14 +4910,14 @@ class Ft extends Q {
    */
   render(t, e = !1, o = !1) {
     var n;
-    const i = this.opacity ?? 1, s = !!((n = this.stroke) != null && n.enabled);
-    if (i < 1 && s) {
-      this.renderWithOffscreen(t, i);
+    const s = this.opacity ?? 1, i = !!((n = this.stroke) != null && n.enabled);
+    if (s < 1 && i) {
+      this.renderWithOffscreen(t, s);
       return;
     }
     t.save(), t.translate(this.x, this.y), t.rotate(D.toRadians(this.rotation)), t.fillStyle = this.transformData.fillColor || "#3b82f6";
     const a = this.transformData.fillOpacity ?? 1;
-    t.globalAlpha = i * a, this.renderShape(t), t.restore(), s && this.renderStroke(t, i);
+    t.globalAlpha = s * a, this.renderShape(t), t.restore(), i && this.renderStroke(t, s);
   }
   /**
    * Render fill+stroke to a temporary canvas at full opacity, then composite
@@ -4912,7 +4925,7 @@ class Ft extends Q {
    */
   renderWithOffscreen(t, e) {
     var f;
-    const { width: o, height: i } = this.transformData, a = (((f = this.stroke) == null ? void 0 : f.width) || 2) + 2, n = Math.ceil(o + a * 2), h = Math.ceil(i + a * 2), l = document.createElement("canvas");
+    const { width: o, height: s } = this.transformData, a = (((f = this.stroke) == null ? void 0 : f.width) || 2) + 2, n = Math.ceil(o + a * 2), h = Math.ceil(s + a * 2), l = document.createElement("canvas");
     l.width = n, l.height = h;
     const c = l.getContext("2d");
     if (!c) {
@@ -4936,55 +4949,55 @@ class Ft extends Q {
    * Trace the shape path without filling or stroking — used by offscreen render
    */
   traceShapePath(t) {
-    const { shapeType: e, width: o, height: i } = this.transformData;
+    const { shapeType: e, width: o, height: s } = this.transformData;
     switch (e) {
       case "rectangle": {
-        const s = this.transformData.borderRadius || 0, a = -o / 2, n = -i / 2;
-        if (s > 0) {
-          const h = Math.min(s / 100 * Math.min(o, i), o / 2, i / 2);
-          t.roundRect(a, n, o, i, h);
+        const i = this.transformData.borderRadius || 0, a = -o / 2, n = -s / 2;
+        if (i > 0) {
+          const h = Math.min(i / 100 * Math.min(o, s), o / 2, s / 2);
+          t.roundRect(a, n, o, s, h);
         } else
-          t.rect(a, n, o, i);
+          t.rect(a, n, o, s);
         break;
       }
       case "circle": {
-        const s = Math.min(o, i) / 2;
-        t.arc(0, 0, s, 0, Math.PI * 2);
+        const i = Math.min(o, s) / 2;
+        t.arc(0, 0, i, 0, Math.PI * 2);
         break;
       }
       case "ellipse":
-        t.ellipse(0, 0, o / 2, i / 2, 0, 0, Math.PI * 2);
+        t.ellipse(0, 0, o / 2, s / 2, 0, 0, Math.PI * 2);
         break;
       case "triangle": {
-        const s = o / 2, a = i / 2;
-        t.moveTo(0, -a), t.lineTo(s, a), t.lineTo(-s, a), t.closePath();
+        const i = o / 2, a = s / 2;
+        t.moveTo(0, -a), t.lineTo(i, a), t.lineTo(-i, a), t.closePath();
         break;
       }
       case "polygon": {
-        const s = this.transformData.sides || 5, a = Math.min(o, i) / 2;
-        for (let n = 0; n < s; n++) {
-          const h = n * 2 * Math.PI / s - Math.PI / 2, l = a * Math.cos(h), c = a * Math.sin(h);
+        const i = this.transformData.sides || 5, a = Math.min(o, s) / 2;
+        for (let n = 0; n < i; n++) {
+          const h = n * 2 * Math.PI / i - Math.PI / 2, l = a * Math.cos(h), c = a * Math.sin(h);
           n === 0 ? t.moveTo(l, c) : t.lineTo(l, c);
         }
         t.closePath();
         break;
       }
       case "star": {
-        const s = this.transformData.points || 5, a = Math.min(o, i) / 2, n = a * (this.transformData.innerRadius || 0.4);
-        for (let h = 0; h < s * 2; h++) {
-          const l = h * Math.PI / s - Math.PI / 2, c = h % 2 === 0 ? a : n, g = c * Math.cos(l), d = c * Math.sin(l);
+        const i = this.transformData.points || 5, a = Math.min(o, s) / 2, n = a * (this.transformData.innerRadius || 0.4);
+        for (let h = 0; h < i * 2; h++) {
+          const l = h * Math.PI / i - Math.PI / 2, c = h % 2 === 0 ? a : n, g = c * Math.cos(l), d = c * Math.sin(l);
           h === 0 ? t.moveTo(g, d) : t.lineTo(g, d);
         }
         t.closePath();
         break;
       }
       case "line": {
-        const s = o / 2, a = i / 2;
-        t.rect(-s, -a, o, i);
+        const i = o / 2, a = s / 2;
+        t.rect(-i, -a, o, s);
         break;
       }
       default:
-        t.rect(-o / 2, -i / 2, o, i);
+        t.rect(-o / 2, -s / 2, o, s);
     }
   }
   /**
@@ -4994,32 +5007,32 @@ class Ft extends Q {
     t.save(), t.translate(this.x, this.y), t.rotate(D.toRadians(this.rotation));
     const o = this.stroke;
     t.strokeStyle = o.color || "#000000", t.lineWidth = o.width || 2, t.lineCap = o.lineCap || "round", t.lineJoin = o.lineJoin || "round", t.globalAlpha = e * (o.opacity ?? 1), o.dashArray && o.dashArray.length > 0 && t.setLineDash(o.dashArray);
-    const { shapeType: i, width: s, height: a } = this.transformData;
-    switch (t.beginPath(), i) {
+    const { shapeType: s, width: i, height: a } = this.transformData;
+    switch (t.beginPath(), s) {
       case "rectangle": {
-        const n = this.transformData.borderRadius || 0, h = -s / 2, l = -a / 2;
+        const n = this.transformData.borderRadius || 0, h = -i / 2, l = -a / 2;
         if (n > 0) {
-          const c = Math.min(n / 100 * Math.min(s, a), s / 2, a / 2);
-          t.roundRect(h, l, s, a, c);
+          const c = Math.min(n / 100 * Math.min(i, a), i / 2, a / 2);
+          t.roundRect(h, l, i, a, c);
         } else
-          t.rect(h, l, s, a);
+          t.rect(h, l, i, a);
         break;
       }
       case "circle": {
-        const n = Math.min(s, a) / 2;
+        const n = Math.min(i, a) / 2;
         t.arc(0, 0, n, 0, Math.PI * 2);
         break;
       }
       case "ellipse":
-        t.ellipse(0, 0, s / 2, a / 2, 0, 0, Math.PI * 2);
+        t.ellipse(0, 0, i / 2, a / 2, 0, 0, Math.PI * 2);
         break;
       case "triangle": {
-        const n = s / 2, h = a / 2;
+        const n = i / 2, h = a / 2;
         t.moveTo(0, -h), t.lineTo(n, h), t.lineTo(-n, h), t.closePath();
         break;
       }
       case "polygon": {
-        const n = this.transformData.sides || 5, h = Math.min(s, a) / 2;
+        const n = this.transformData.sides || 5, h = Math.min(i, a) / 2;
         for (let l = 0; l < n; l++) {
           const c = l * 2 * Math.PI / n - Math.PI / 2, g = h * Math.cos(c), d = h * Math.sin(c);
           l === 0 ? t.moveTo(g, d) : t.lineTo(g, d);
@@ -5028,7 +5041,7 @@ class Ft extends Q {
         break;
       }
       case "star": {
-        const n = this.transformData.points || 5, h = Math.min(s, a) / 2, l = h * (this.transformData.innerRadius || 0.4);
+        const n = this.transformData.points || 5, h = Math.min(i, a) / 2, l = h * (this.transformData.innerRadius || 0.4);
         for (let c = 0; c < n * 2; c++) {
           const g = c * Math.PI / n - Math.PI / 2, d = c % 2 === 0 ? h : l, f = d * Math.cos(g), u = d * Math.sin(g);
           c === 0 ? t.moveTo(f, u) : t.lineTo(f, u);
@@ -5037,12 +5050,12 @@ class Ft extends Q {
         break;
       }
       case "line": {
-        const n = s / 2, h = a / 2;
-        t.rect(-n, -h, s, a);
+        const n = i / 2, h = a / 2;
+        t.rect(-n, -h, i, a);
         break;
       }
       default:
-        t.rect(-s / 2, -a / 2, s, a);
+        t.rect(-i / 2, -a / 2, i, a);
     }
     t.stroke(), t.restore();
   }
@@ -5050,32 +5063,32 @@ class Ft extends Q {
    * Render the specific shape based on shapeType
    */
   renderShape(t) {
-    const { shapeType: e, width: o, height: i } = this.transformData;
+    const { shapeType: e, width: o, height: s } = this.transformData;
     switch (t.beginPath(), e) {
       case "rectangle":
-        this.renderRectangle(t, o, i);
+        this.renderRectangle(t, o, s);
         break;
       case "circle":
-        this.renderCircle(t, Math.min(o, i) / 2);
+        this.renderCircle(t, Math.min(o, s) / 2);
         break;
       case "ellipse":
-        this.renderEllipse(t, o / 2, i / 2);
+        this.renderEllipse(t, o / 2, s / 2);
         break;
       case "triangle":
-        this.renderTriangle(t, o, i);
+        this.renderTriangle(t, o, s);
         break;
       case "polygon":
-        this.renderPolygon(t, Math.min(o, i) / 2);
+        this.renderPolygon(t, Math.min(o, s) / 2);
         break;
       case "star":
-        this.renderStar(t, Math.min(o, i) / 2);
+        this.renderStar(t, Math.min(o, s) / 2);
         break;
       case "line":
-        this.renderLine(t, o, i);
+        this.renderLine(t, o, s);
         return;
       // Line uses stroke, not fill
       default:
-        this.renderRectangle(t, o, i);
+        this.renderRectangle(t, o, s);
     }
     t.fill();
   }
@@ -5083,12 +5096,12 @@ class Ft extends Q {
    * Render a rectangle (with optional border radius)
    */
   renderRectangle(t, e, o) {
-    const i = this.transformData.borderRadius || 0, s = -e / 2, a = -o / 2;
-    if (i > 0) {
-      const n = Math.min(i / 100 * Math.min(e, o), e / 2, o / 2);
-      t.roundRect(s, a, e, o, n);
+    const s = this.transformData.borderRadius || 0, i = -e / 2, a = -o / 2;
+    if (s > 0) {
+      const n = Math.min(s / 100 * Math.min(e, o), e / 2, o / 2);
+      t.roundRect(i, a, e, o, n);
     } else
-      t.rect(s, a, e, o);
+      t.rect(i, a, e, o);
   }
   /**
    * Render a circle
@@ -5106,16 +5119,16 @@ class Ft extends Q {
    * Render a triangle (isosceles, pointing up)
    */
   renderTriangle(t, e, o) {
-    const i = e / 2, s = o / 2;
-    t.moveTo(0, -s), t.lineTo(i, s), t.lineTo(-i, s), t.closePath();
+    const s = e / 2, i = o / 2;
+    t.moveTo(0, -i), t.lineTo(s, i), t.lineTo(-s, i), t.closePath();
   }
   /**
    * Render a regular polygon
    */
   renderPolygon(t, e) {
-    const o = Math.max(3, Math.min(20, this.transformData.sides || 5)), i = Math.PI * 2 / o, s = -Math.PI / 2;
+    const o = Math.max(3, Math.min(20, this.transformData.sides || 5)), s = Math.PI * 2 / o, i = -Math.PI / 2;
     for (let a = 0; a <= o; a++) {
-      const n = s + i * a, h = Math.cos(n) * e, l = Math.sin(n) * e;
+      const n = i + s * a, h = Math.cos(n) * e, l = Math.sin(n) * e;
       a === 0 ? t.moveTo(h, l) : t.lineTo(h, l);
     }
     t.closePath();
@@ -5124,9 +5137,9 @@ class Ft extends Q {
    * Render a star
    */
   renderStar(t, e) {
-    const o = Math.max(3, Math.min(20, this.transformData.points || 5)), i = Math.max(0.1, Math.min(0.9, this.transformData.innerRadius || 0.4)), s = e * i, a = Math.PI / o, n = -Math.PI / 2;
+    const o = Math.max(3, Math.min(20, this.transformData.points || 5)), s = Math.max(0.1, Math.min(0.9, this.transformData.innerRadius || 0.4)), i = e * s, a = Math.PI / o, n = -Math.PI / 2;
     for (let h = 0; h < o * 2; h++) {
-      const l = n + a * h, c = h % 2 === 0 ? e : s, g = Math.cos(l) * c, d = Math.sin(l) * c;
+      const l = n + a * h, c = h % 2 === 0 ? e : i, g = Math.cos(l) * c, d = Math.sin(l) * c;
       h === 0 ? t.moveTo(g, d) : t.lineTo(g, d);
     }
     t.closePath();
@@ -5135,20 +5148,20 @@ class Ft extends Q {
    * Render a line
    */
   renderLine(t, e, o) {
-    const i = e / 2, s = o;
-    t.moveTo(-i, 0), t.lineTo(i, 0), t.strokeStyle = this.transformData.fillColor || "#3b82f6", t.lineWidth = s, t.lineCap = "round", t.stroke();
+    const s = e / 2, i = o;
+    t.moveTo(-s, 0), t.lineTo(s, 0), t.strokeStyle = this.transformData.fillColor || "#3b82f6", t.lineWidth = i, t.lineCap = "round", t.stroke();
   }
   /**
    * Handle resize - maintain aspect ratio for circles, free resize for others
    */
-  resize(t, e, o, i) {
-    const { shapeType: s } = this.transformData;
-    if (s === "circle" || s === "polygon" || s === "star") {
-      const c = Math.max(e / i.transformData.width, o / i.transformData.height);
-      this.transformData.width = i.transformData.width * c, this.transformData.height = i.transformData.height * c;
-    } else s === "line" ? (this.transformData.width = e, this.transformData.height = i.transformData.height) : (this.transformData.width = e, this.transformData.height = o);
-    this.rotation = i.rotation;
-    const a = this.getFixedCorner(t, i), n = this.getOppositeAnchor(t), h = this.getBoundingBox(), l = this.getCornerOffset(n, h);
+  resize(t, e, o, s) {
+    const { shapeType: i } = this.transformData;
+    if (i === "circle" || i === "polygon" || i === "star") {
+      const c = Math.max(e / s.transformData.width, o / s.transformData.height);
+      this.transformData.width = s.transformData.width * c, this.transformData.height = s.transformData.height * c;
+    } else i === "line" ? (this.transformData.width = e, this.transformData.height = s.transformData.height) : (this.transformData.width = e, this.transformData.height = o);
+    this.rotation = s.rotation;
+    const a = this.getFixedCorner(t, s), n = this.getOppositeAnchor(t), h = this.getBoundingBox(), l = this.getCornerOffset(n, h);
     return this.x = a.x - l.x, this.y = a.y - l.y, !0;
   }
   /**
@@ -5180,71 +5193,71 @@ class Ft extends Q {
       width: e.transformData.width,
       height: e.transformData.height
     };
-    let i, s;
+    let s, i;
     switch (t) {
       case "top-left":
-        i = o.x + o.width, s = o.y + o.height;
+        s = o.x + o.width, i = o.y + o.height;
         break;
       case "top-right":
-        i = o.x, s = o.y + o.height;
+        s = o.x, i = o.y + o.height;
         break;
       case "bottom-left":
-        i = o.x + o.width, s = o.y;
+        s = o.x + o.width, i = o.y;
         break;
       case "bottom-right":
-        i = o.x, s = o.y;
+        s = o.x, i = o.y;
         break;
       case "middle-left":
-        i = o.x + o.width, s = o.y + o.height / 2;
+        s = o.x + o.width, i = o.y + o.height / 2;
         break;
       case "middle-right":
-        i = o.x, s = o.y + o.height / 2;
+        s = o.x, i = o.y + o.height / 2;
         break;
       case "middle-top":
-        i = o.x + o.width / 2, s = o.y + o.height;
+        s = o.x + o.width / 2, i = o.y + o.height;
         break;
       case "middle-bottom":
-        i = o.x + o.width / 2, s = o.y;
+        s = o.x + o.width / 2, i = o.y;
         break;
       default:
-        i = o.x + o.width / 2, s = o.y + o.height / 2;
+        s = o.x + o.width / 2, i = o.y + o.height / 2;
     }
-    return { x: i, y: s };
+    return { x: s, y: i };
   }
   /**
    * Get the offset of a corner from the center
    */
   getCornerOffset(t, e) {
-    let o, i;
+    let o, s;
     switch (t) {
       case "top-left":
-        o = -e.width / 2, i = -e.height / 2;
+        o = -e.width / 2, s = -e.height / 2;
         break;
       case "top-right":
-        o = e.width / 2, i = -e.height / 2;
+        o = e.width / 2, s = -e.height / 2;
         break;
       case "bottom-left":
-        o = -e.width / 2, i = e.height / 2;
+        o = -e.width / 2, s = e.height / 2;
         break;
       case "bottom-right":
-        o = e.width / 2, i = e.height / 2;
+        o = e.width / 2, s = e.height / 2;
         break;
       case "middle-left":
-        o = -e.width / 2, i = 0;
+        o = -e.width / 2, s = 0;
         break;
       case "middle-right":
-        o = e.width / 2, i = 0;
+        o = e.width / 2, s = 0;
         break;
       case "middle-top":
-        o = 0, i = -e.height / 2;
+        o = 0, s = -e.height / 2;
         break;
       case "middle-bottom":
-        o = 0, i = e.height / 2;
+        o = 0, s = e.height / 2;
         break;
       default:
-        o = 0, i = 0;
+        o = 0, s = 0;
     }
-    return { x: o, y: i };
+    return { x: o, y: s };
   }
   /**
    * Get enabled anchors - all 8 anchors for most shapes, only corners for circles/polygons
@@ -5290,13 +5303,13 @@ class Ft extends Q {
 }
 class Mt extends Q {
   constructor(t = {}) {
-    var e, o, i, s, a, n, h, l, c, g;
+    var e, o, s, i, a, n, h, l, c, g;
     super(t), this.transformType = "path", this.transformData = {
       type: "path",
       points: ((e = t.transformData) == null ? void 0 : e.points) || [],
       closed: ((o = t.transformData) == null ? void 0 : o.closed) ?? !1,
-      width: ((i = t.transformData) == null ? void 0 : i.width) || 200,
-      height: ((s = t.transformData) == null ? void 0 : s.height) || 200,
+      width: ((s = t.transformData) == null ? void 0 : s.width) || 200,
+      height: ((i = t.transformData) == null ? void 0 : i.height) || 200,
       fillEnabled: ((a = t.transformData) == null ? void 0 : a.fillEnabled) ?? !1,
       fillColor: ((n = t.transformData) == null ? void 0 : n.fillColor) || zt(),
       fillOpacity: ((h = t.transformData) == null ? void 0 : h.fillOpacity) ?? 1,
@@ -5344,11 +5357,11 @@ class Mt extends Q {
    * @param p3 End point
    * @param t Parameter from 0 to 1
    */
-  bezierPoint(t, e, o, i, s) {
-    const a = 1 - s, n = a * a, h = n * a, l = s * s, c = l * s;
+  bezierPoint(t, e, o, s, i) {
+    const a = 1 - i, n = a * a, h = n * a, l = i * i, c = l * i;
     return {
-      x: h * t.x + 3 * n * s * e.x + 3 * a * l * o.x + c * i.x,
-      y: h * t.y + 3 * n * s * e.y + 3 * a * l * o.y + c * i.y
+      x: h * t.x + 3 * n * i * e.x + 3 * a * l * o.x + c * s.x,
+      y: h * t.y + 3 * n * i * e.y + 3 * a * l * o.y + c * s.y
     };
   }
   /**
@@ -5360,14 +5373,14 @@ class Mt extends Q {
     const { points: t } = this.transformData;
     if (t.length === 0)
       return { x: 0, y: 0, width: 0, height: 0 };
-    let e = 1 / 0, o = 1 / 0, i = -1 / 0, s = -1 / 0;
+    let e = 1 / 0, o = 1 / 0, s = -1 / 0, i = -1 / 0;
     for (let d = 0; d < t.length; d++) {
       const f = t[d], u = t[(d + 1) % t.length];
       if (d === t.length - 1 && !this.transformData.closed) {
-        e = Math.min(e, f.x), o = Math.min(o, f.y), i = Math.max(i, f.x), s = Math.max(s, f.y);
+        e = Math.min(e, f.x), o = Math.min(o, f.y), s = Math.max(s, f.x), i = Math.max(i, f.y);
         break;
       }
-      if (e = Math.min(e, f.x), o = Math.min(o, f.y), i = Math.max(i, f.x), s = Math.max(s, f.y), f.handleOut || u.handleIn) {
+      if (e = Math.min(e, f.x), o = Math.min(o, f.y), s = Math.max(s, f.x), i = Math.max(i, f.y), f.handleOut || u.handleIn) {
         const p = { x: f.x, y: f.y }, y = {
           x: f.x + (((h = f.handleOut) == null ? void 0 : h.x) || 0),
           y: f.y + (((l = f.handleOut) == null ? void 0 : l.y) || 0)
@@ -5377,7 +5390,7 @@ class Mt extends Q {
         }, b = { x: u.x, y: u.y }, S = 20;
         for (let v = 0; v <= S; v++) {
           const w = v / S, T = this.bezierPoint(p, y, x, b, w);
-          e = Math.min(e, T.x), o = Math.min(o, T.y), i = Math.max(i, T.x), s = Math.max(s, T.y);
+          e = Math.min(e, T.x), o = Math.min(o, T.y), s = Math.max(s, T.x), i = Math.max(i, T.y);
         }
       }
     }
@@ -5385,8 +5398,8 @@ class Mt extends Q {
     return {
       x: e - n,
       y: o - n,
-      width: i - e + a,
-      height: s - o + a
+      width: s - e + a,
+      height: i - o + a
     };
   }
   /**
@@ -5400,28 +5413,28 @@ class Mt extends Q {
    * Render the path
    */
   render(t, e = !1, o = !1) {
-    const { points: i, closed: s, fillEnabled: a, fillColor: n, fillOpacity: h, strokeEnabled: l, strokeColor: c, strokeWidth: g } = this.transformData;
-    if (i.length === 0)
+    const { points: s, closed: i, fillEnabled: a, fillColor: n, fillOpacity: h, strokeEnabled: l, strokeColor: c, strokeWidth: g } = this.transformData;
+    if (s.length === 0)
       return;
     t.save(), t.translate(this.x, this.y), t.rotate(D.toRadians(this.rotation));
     const d = this.calculatePathBounds(), f = d.x + d.width / 2, u = d.y + d.height / 2;
-    t.translate(-f, -u), t.beginPath(), this.renderPath(t), a && s && n && (t.fillStyle = n, t.globalAlpha = h ?? 1, t.fill()), l && c && g && (t.strokeStyle = c, t.lineWidth = g, t.lineCap = "round", t.lineJoin = "round", t.globalAlpha = 1, t.stroke()), t.restore();
+    t.translate(-f, -u), t.beginPath(), this.renderPath(t), a && i && n && (t.fillStyle = n, t.globalAlpha = h ?? 1, t.fill()), l && c && g && (t.strokeStyle = c, t.lineWidth = g, t.lineCap = "round", t.lineJoin = "round", t.globalAlpha = 1, t.stroke()), t.restore();
   }
   /**
    * Render the path using Canvas API bezier curves
    */
   renderPath(t) {
-    var s, a, n, h;
+    var i, a, n, h;
     const { points: e, closed: o } = this.transformData;
     if (e.length === 0) return;
-    const i = e[0];
-    t.moveTo(i.x, i.y);
+    const s = e[0];
+    t.moveTo(s.x, s.y);
     for (let l = 0; l < e.length; l++) {
       const c = e[l], g = e[(l + 1) % e.length];
       if (l === e.length - 1 && !o)
         break;
       if (c.handleOut || g.handleIn) {
-        const f = c.x + (((s = c.handleOut) == null ? void 0 : s.x) || 0), u = c.y + (((a = c.handleOut) == null ? void 0 : a.y) || 0), m = g.x + (((n = g.handleIn) == null ? void 0 : n.x) || 0), p = g.y + (((h = g.handleIn) == null ? void 0 : h.y) || 0);
+        const f = c.x + (((i = c.handleOut) == null ? void 0 : i.x) || 0), u = c.y + (((a = c.handleOut) == null ? void 0 : a.y) || 0), m = g.x + (((n = g.handleIn) == null ? void 0 : n.x) || 0), p = g.y + (((h = g.handleIn) == null ? void 0 : h.y) || 0);
         t.bezierCurveTo(f, u, m, p, g.x, g.y);
       } else
         t.lineTo(g.x, g.y);
@@ -5431,11 +5444,11 @@ class Mt extends Q {
   /**
    * Handle resize - scale all points relative to center
    */
-  resize(t, e, o, i) {
-    const s = i.transformData.width, a = i.transformData.height;
-    if (s === 0 || a === 0)
+  resize(t, e, o, s) {
+    const i = s.transformData.width, a = s.transformData.height;
+    if (i === 0 || a === 0)
       return !1;
-    const n = e / s, h = o / a, l = i.transformData.points;
+    const n = e / i, h = o / a, l = s.transformData.points;
     let c = 1 / 0, g = 1 / 0, d = -1 / 0, f = -1 / 0;
     for (const S of l)
       c = Math.min(c, S.x), g = Math.min(g, S.y), d = Math.max(d, S.x), f = Math.max(f, S.y);
@@ -5446,8 +5459,8 @@ class Mt extends Q {
       y: m + (S.y - m) * h,
       handleIn: S.handleIn ? { x: S.handleIn.x * n, y: S.handleIn.y * h } : void 0,
       handleOut: S.handleOut ? { x: S.handleOut.x * n, y: S.handleOut.y * h } : void 0
-    })), this.transformData.width = e, this.transformData.height = o, this.rotation = i.rotation;
-    const p = this.getFixedCorner(t, i), y = this.getOppositeAnchor(t), x = this.getBoundingBox(), b = this.getCornerOffset(y, x);
+    })), this.transformData.width = e, this.transformData.height = o, this.rotation = s.rotation;
+    const p = this.getFixedCorner(t, s), y = this.getOppositeAnchor(t), x = this.getBoundingBox(), b = this.getCornerOffset(y, x);
     return this.x = p.x - b.x, this.y = p.y - b.y, !0;
   }
   /**
@@ -5479,71 +5492,71 @@ class Mt extends Q {
       width: e.transformData.width,
       height: e.transformData.height
     };
-    let i, s;
+    let s, i;
     switch (t) {
       case "top-left":
-        i = o.x + o.width, s = o.y + o.height;
+        s = o.x + o.width, i = o.y + o.height;
         break;
       case "top-right":
-        i = o.x, s = o.y + o.height;
+        s = o.x, i = o.y + o.height;
         break;
       case "bottom-left":
-        i = o.x + o.width, s = o.y;
+        s = o.x + o.width, i = o.y;
         break;
       case "bottom-right":
-        i = o.x, s = o.y;
+        s = o.x, i = o.y;
         break;
       case "middle-left":
-        i = o.x + o.width, s = o.y + o.height / 2;
+        s = o.x + o.width, i = o.y + o.height / 2;
         break;
       case "middle-right":
-        i = o.x, s = o.y + o.height / 2;
+        s = o.x, i = o.y + o.height / 2;
         break;
       case "middle-top":
-        i = o.x + o.width / 2, s = o.y + o.height;
+        s = o.x + o.width / 2, i = o.y + o.height;
         break;
       case "middle-bottom":
-        i = o.x + o.width / 2, s = o.y;
+        s = o.x + o.width / 2, i = o.y;
         break;
       default:
-        i = o.x + o.width / 2, s = o.y + o.height / 2;
+        s = o.x + o.width / 2, i = o.y + o.height / 2;
     }
-    return { x: i, y: s };
+    return { x: s, y: i };
   }
   /**
    * Get the offset of a corner from the center
    */
   getCornerOffset(t, e) {
-    let o, i;
+    let o, s;
     switch (t) {
       case "top-left":
-        o = -e.width / 2, i = -e.height / 2;
+        o = -e.width / 2, s = -e.height / 2;
         break;
       case "top-right":
-        o = e.width / 2, i = -e.height / 2;
+        o = e.width / 2, s = -e.height / 2;
         break;
       case "bottom-left":
-        o = -e.width / 2, i = e.height / 2;
+        o = -e.width / 2, s = e.height / 2;
         break;
       case "bottom-right":
-        o = e.width / 2, i = e.height / 2;
+        o = e.width / 2, s = e.height / 2;
         break;
       case "middle-left":
-        o = -e.width / 2, i = 0;
+        o = -e.width / 2, s = 0;
         break;
       case "middle-right":
-        o = e.width / 2, i = 0;
+        o = e.width / 2, s = 0;
         break;
       case "middle-top":
-        o = 0, i = -e.height / 2;
+        o = 0, s = -e.height / 2;
         break;
       case "middle-bottom":
-        o = 0, i = e.height / 2;
+        o = 0, s = e.height / 2;
         break;
       default:
-        o = 0, i = 0;
+        o = 0, s = 0;
     }
-    return { x: o, y: i };
+    return { x: o, y: s };
   }
   /**
    * Get enabled anchors - all 8 anchors for free resize
@@ -5618,7 +5631,7 @@ const _e = {
     {
       key: "amplitude",
       label: "Wave Amplitude",
-      defaultInternalValue: st.amplitude,
+      defaultInternalValue: it.amplitude,
       // Slider 0-100 maps to internal -0.5 to 0.5 (-50% to +50%)
       toSlider: (r) => (r + 0.5) * 100,
       fromSlider: (r) => r / 100 - 0.5,
@@ -5627,7 +5640,7 @@ const _e = {
     {
       key: "frequency",
       label: "Wave Frequency",
-      defaultInternalValue: st.frequency,
+      defaultInternalValue: it.frequency,
       step: 5,
       // 5% steps for smoother control
       // Slider 0-100 maps to internal 1 to 5
@@ -5821,17 +5834,17 @@ class ut extends Q {
   getBoundingBox() {
     if (this.children.length === 0)
       return { x: this.x - 50, y: this.y - 50, width: 100, height: 100 };
-    let t = 1 / 0, e = 1 / 0, o = -1 / 0, i = -1 / 0;
-    return this.children.forEach((s) => {
-      const a = s.getVisualBoundingBox();
-      this._getRotatedCorners(s, a).forEach((h) => {
-        t = Math.min(t, h.x), e = Math.min(e, h.y), o = Math.max(o, h.x), i = Math.max(i, h.y);
+    let t = 1 / 0, e = 1 / 0, o = -1 / 0, s = -1 / 0;
+    return this.children.forEach((i) => {
+      const a = i.getVisualBoundingBox();
+      this._getRotatedCorners(i, a).forEach((h) => {
+        t = Math.min(t, h.x), e = Math.min(e, h.y), o = Math.max(o, h.x), s = Math.max(s, h.y);
       });
     }), {
       x: t,
       y: e,
       width: o - t,
-      height: i - e
+      height: s - e
     };
   }
   /**
@@ -5855,7 +5868,7 @@ class ut extends Q {
    * Get the four corners of an element's bounding box in world space
    */
   _getRotatedCorners(t, e) {
-    const o = new R(t), i = e.x + e.width / 2, s = e.y + e.height / 2, a = i - t.x, n = s - t.y;
+    const o = new R(t), s = e.x + e.width / 2, i = e.y + e.height / 2, a = s - t.x, n = i - t.y;
     return [
       { localX: a - e.width / 2, localY: n - e.height / 2 },
       { localX: a + e.width / 2, localY: n - e.height / 2 },
@@ -5895,8 +5908,8 @@ class ut extends Q {
    * Elements with isClipping=true clip all elements below them in the group
    */
   render(t, e = !1, o = !1) {
-    const i = this.children.filter((a) => a.visible !== !1);
-    i.some((a) => a.isClipping) ? Te()(t, i) : i.forEach((a) => {
+    const s = this.children.filter((a) => a.visible !== !1);
+    s.some((a) => a.isClipping) ? Te()(t, s) : s.forEach((a) => {
       a.render(t, !1);
     }), e ? this._renderGroupOutline(t, 1) : o && this._renderGroupOutline(t, 0.3);
   }
@@ -5907,8 +5920,8 @@ class ut extends Q {
   _renderGroupOutline(t, e = 1) {
     const o = this.getOrientedBoundingBox();
     t.save(), t.globalAlpha = e, t.strokeStyle = Wt(), t.lineWidth = 2, t.setLineDash([5, 5]);
-    const i = this._rotationCenterX || this.x, s = this._rotationCenterY || this.y;
-    this.rotation !== 0 && (t.translate(i, s), t.rotate(-this.rotation * Math.PI / 180), t.translate(-i, -s)), t.strokeRect(o.x, o.y, o.width, o.height), t.setLineDash([]), t.restore();
+    const s = this._rotationCenterX || this.x, i = this._rotationCenterY || this.y;
+    this.rotation !== 0 && (t.translate(s, i), t.rotate(-this.rotation * Math.PI / 180), t.translate(-s, -i)), t.strokeRect(o.x, o.y, o.width, o.height), t.setLineDash([]), t.restore();
   }
   /**
    * Get oriented bounding box (uses cached base dimensions for stability during rotation)
@@ -5925,13 +5938,13 @@ class ut extends Q {
     if (this._baseBBoxWidth > 0 && this._baseBBoxHeight > 0)
       t = this._baseBBoxWidth, e = this._baseBBoxHeight;
     else {
-      const s = this.getBoundingBox();
-      t = s.width, e = s.height, this._baseBBoxWidth = t, this._baseBBoxHeight = e;
+      const i = this.getBoundingBox();
+      t = i.width, e = i.height, this._baseBBoxWidth = t, this._baseBBoxHeight = e;
     }
-    const o = this._rotationCenterX || this.x, i = this._rotationCenterY || this.y;
+    const o = this._rotationCenterX || this.x, s = this._rotationCenterY || this.y;
     return {
       x: o - t / 2,
-      y: i - e / 2,
+      y: s - e / 2,
       width: t,
       height: e
     };
@@ -5950,40 +5963,40 @@ class ut extends Q {
   setRotation(t) {
     const e = t - this.rotation;
     this.rotation = t;
-    const o = this._rotationCenterX || this.x, i = this._rotationCenterY || this.y;
-    this.children.forEach((s) => {
-      const a = R.rotatePointAroundAnchor(s.x, s.y, o, i, e);
-      s.x = a.x, s.y = a.y, s.setRotation(s.rotation + e);
-    }), this.x = o, this.y = i;
+    const o = this._rotationCenterX || this.x, s = this._rotationCenterY || this.y;
+    this.children.forEach((i) => {
+      const a = R.rotatePointAroundAnchor(i.x, i.y, o, s, e);
+      i.x = a.x, i.y = a.y, i.setRotation(i.rotation + e);
+    }), this.x = o, this.y = s;
   }
   /**
    * Resize the group (scales all children proportionally)
    * Uses the same fixed-corner approach as multi-selection resize
    */
-  resize(t, e, o, i) {
-    if (!i.childrenStartData || !i.width || !i.height)
+  resize(t, e, o, s) {
+    if (!s.childrenStartData || !s.width || !s.height)
       return;
-    const s = e / i.width, a = o / i.height, n = (s + a) / 2;
+    const i = e / s.width, a = o / s.height, n = (i + a) / 2;
     let h, l;
     switch (t) {
       case "top-left":
-        h = i.width / 2, l = i.height / 2;
+        h = s.width / 2, l = s.height / 2;
         break;
       case "top-right":
-        h = -i.width / 2, l = i.height / 2;
+        h = -s.width / 2, l = s.height / 2;
         break;
       case "bottom-left":
-        h = i.width / 2, l = -i.height / 2;
+        h = s.width / 2, l = -s.height / 2;
         break;
       case "bottom-right":
-        h = -i.width / 2, l = -i.height / 2;
+        h = -s.width / 2, l = -s.height / 2;
         break;
       default:
         h = 0, l = 0;
     }
-    const c = -i.rotation * Math.PI / 180, g = Math.cos(c), d = Math.sin(c), f = i.x + (h * g - l * d), u = i.y + (h * d + l * g);
+    const c = -s.rotation * Math.PI / 180, g = Math.cos(c), d = Math.sin(c), f = s.x + (h * g - l * d), u = s.y + (h * d + l * g);
     this.children.forEach((y, x) => {
-      const b = i.childrenStartData[x], S = b.x - f, v = b.y - u, w = f + S * n, T = u + v * n;
+      const b = s.childrenStartData[x], S = b.x - f, v = b.y - u, w = f + S * n, T = u + v * n;
       if (y.x = w, y.y = T, y instanceof pt) {
         const F = b.transformData, A = F.width * n, M = F.height * n;
         y.transformData.width = A, y.transformData.height = M;
@@ -5994,8 +6007,8 @@ class ut extends Q {
         const F = (b.width ?? 0) * n, A = (b.height ?? 0) * n;
         y.resize(t, F, A, b);
       }
-    }), this._baseBBoxWidth = i.width * n, this._baseBBoxHeight = i.height * n;
-    const m = i.x - f, p = i.y - u;
+    }), this._baseBBoxWidth = s.width * n, this._baseBBoxHeight = s.height * n;
+    const m = s.x - f, p = s.y - u;
     this.x = f + m * n, this.y = u + p * n, this._rotationCenterX = this.x, this._rotationCenterY = this.y;
   }
   /**
@@ -6003,16 +6016,16 @@ class ut extends Q {
    * Use cached base dimensions instead of axis-aligned bbox for consistency with visual border
    */
   getTransformStartData() {
-    const t = this._baseBBoxWidth > 0 ? this._baseBBoxWidth : this.getBoundingBox().width, e = this._baseBBoxHeight > 0 ? this._baseBBoxHeight : this.getBoundingBox().height, o = this._rotationCenterX || this.x, i = this._rotationCenterY || this.y;
+    const t = this._baseBBoxWidth > 0 ? this._baseBBoxWidth : this.getBoundingBox().width, e = this._baseBBoxHeight > 0 ? this._baseBBoxHeight : this.getBoundingBox().height, o = this._rotationCenterX || this.x, s = this._rotationCenterY || this.y;
     return {
       id: this.id,
       x: o,
-      y: i,
+      y: s,
       width: t,
       height: e,
       rotation: this.rotation,
       transformData: this.transformData,
-      childrenStartData: this.children.map((s) => s.getTransformStartData())
+      childrenStartData: this.children.map((i) => i.getTransformStartData())
     };
   }
   /**
@@ -6020,10 +6033,10 @@ class ut extends Q {
    * This allows clicking anywhere within the selection border to drag the group
    */
   hitTest(t, e) {
-    const o = this.getOrientedBoundingBox(), i = this._rotationCenterX || this.x, s = this._rotationCenterY || this.y;
+    const o = this.getOrientedBoundingBox(), s = this._rotationCenterX || this.x, i = this._rotationCenterY || this.y;
     if (this.rotation === 0)
       return t >= o.x && t <= o.x + o.width && e >= o.y && e <= o.y + o.height;
-    const a = this.rotation * Math.PI / 180, n = Math.cos(a), h = Math.sin(a), l = t - i, c = e - s, g = i + (l * n - c * h), d = s + (l * h + c * n);
+    const a = this.rotation * Math.PI / 180, n = Math.cos(a), h = Math.sin(a), l = t - s, c = e - i, g = s + (l * n - c * h), d = i + (l * h + c * n);
     return g >= o.x && g <= o.x + o.width && d >= o.y && d <= o.y + o.height;
   }
   /**
@@ -6057,7 +6070,13 @@ class ut extends Q {
       // Children are element instances here; the constructor handles both instances and configs
       children: t
     });
-    return e._baseBBoxWidth = this._baseBBoxWidth, e._baseBBoxHeight = this._baseBBoxHeight, e._rotationCenterX = this._rotationCenterX, e._rotationCenterY = this._rotationCenterY, e.opacity = this.opacity, e.name = this.name, e.visible = this.visible, e.locked = this.locked, this.blendMode && (e.blendMode = this.blendMode), this.knockoutParts && (e.knockoutParts = { ...this.knockoutParts }), this.stroke && (e.stroke = { ...this.stroke }), this.masks && (e.masks = this.masks.map((o) => ({ ...o }))), this.distressEffect && (e.distressEffect = { ...this.distressEffect }), e;
+    return e._baseBBoxWidth = this._baseBBoxWidth, e._baseBBoxHeight = this._baseBBoxHeight, e._rotationCenterX = this._rotationCenterX, e._rotationCenterY = this._rotationCenterY, e.opacity = this.opacity, e.name = this.name, e.visible = this.visible, e.locked = this.locked, this.blendMode && (e.blendMode = this.blendMode), this.knockoutParts && (e.knockoutParts = { ...this.knockoutParts }), this.stroke && (e.stroke = {
+      ...this.stroke,
+      ...this.stroke.dashArray && { dashArray: [...this.stroke.dashArray] }
+    }), this.masks && (e.masks = this.masks.map((o) => ({
+      ...o,
+      maskElement: structuredClone(o.maskElement)
+    }))), this.distressEffect && (e.distressEffect = { ...this.distressEffect }), e;
   }
   /**
    * Add a child to the group
@@ -6084,9 +6103,9 @@ class ut extends Q {
    */
   hitTestChild(t, e) {
     for (let o = this.children.length - 1; o >= 0; o--) {
-      const i = this.children[o];
-      if (i.hitTest(t, e))
-        return i;
+      const s = this.children[o];
+      if (s.hitTest(t, e))
+        return s;
     }
     return null;
   }
@@ -6131,8 +6150,8 @@ class Z {
   getAllByName(t) {
     const e = [];
     for (const o of this.order) {
-      const i = this.byId.get(o);
-      i && i.name === t && e.push(i);
+      const s = this.byId.get(o);
+      s && s.name === t && e.push(s);
     }
     return e;
   }
@@ -6153,8 +6172,8 @@ class Z {
     const o = this.clone();
     if (t !== e.id) {
       o.byId.delete(t);
-      const i = o.order.indexOf(t);
-      i !== -1 && (o.order[i] = e.id);
+      const s = o.order.indexOf(t);
+      s !== -1 && (o.order[s] = e.id);
     }
     return o.byId.set(e.id, e), o;
   }
@@ -6167,8 +6186,8 @@ class Z {
   insertAfter(t, e) {
     const o = this.clone();
     o.byId.set(t.id, t);
-    const i = o.order.indexOf(e);
-    return i !== -1 ? o.order.splice(i + 1, 0, t.id) : o.order.push(t.id), o;
+    const s = o.order.indexOf(e);
+    return s !== -1 ? o.order.splice(s + 1, 0, t.id) : o.order.push(t.id), o;
   }
   /** Remove an element by ID. */
   remove(t) {
@@ -6179,7 +6198,7 @@ class Z {
   /** Reorder element to a new index in the render order. */
   reorder(t, e) {
     const o = this.clone();
-    return o.order = o.order.filter((i) => i !== t), o.order.splice(e, 0, t), o;
+    return o.order = o.order.filter((s) => s !== t), o.order.splice(e, 0, t), o;
   }
   /**
    * Apply a batch update: replace elements whose IDs match.
@@ -6247,9 +6266,9 @@ class U {
     throw new Error("Command.undo() must be implemented");
   }
 }
-class ti extends U {
-  constructor(t, e, o, i) {
-    super(), this.elementId = t, this.oldElement = e ? e.clone() : null, this.newElement = o ? o.clone() : null, this.onUpdate = i;
+class ts extends U {
+  constructor(t, e, o, s) {
+    super(), this.elementId = t, this.oldElement = e ? e.clone() : null, this.newElement = o ? o.clone() : null, this.onUpdate = s;
   }
   execute() {
     this.newElement && this.onUpdate(this.newElement);
@@ -6258,7 +6277,7 @@ class ti extends U {
     this.oldElement && this.onUpdate(this.oldElement);
   }
 }
-class ei extends U {
+class es extends U {
   constructor(t, e, o) {
     super(), this.element = t.clone(), this.onAdd = e, this.onRemove = o;
   }
@@ -6269,7 +6288,7 @@ class ei extends U {
     this.onRemove(this.element.id);
   }
 }
-class oi extends U {
+class os extends U {
   constructor(t, e, o) {
     super(), this.element = t.clone(), this.onAdd = e, this.onRemove = o;
   }
@@ -6357,7 +6376,7 @@ class ct {
     };
   }
 }
-class ii extends U {
+class ss extends U {
   constructor(t, e) {
     super(), this.artboard = t.clone(), this.artboardManager = e;
   }
@@ -6377,7 +6396,7 @@ class ii extends U {
     this.artboardManager.deleteArtboard(this.artboard.id);
   }
 }
-class si extends U {
+class is extends U {
   constructor(t, e) {
     super(), this.artboard = t.clone(), this.artboardManager = e, this.elementsOnArtboard = t.getElementIds();
   }
@@ -6400,9 +6419,9 @@ class si extends U {
     });
   }
 }
-class ri extends U {
-  constructor(t, e, o, i) {
-    super(), this.artboardId = t, this.oldProperties = { ...e }, this.newProperties = { ...o }, this.artboardManager = i;
+class rs extends U {
+  constructor(t, e, o, s) {
+    super(), this.artboardId = t, this.oldProperties = { ...e }, this.newProperties = { ...o }, this.artboardManager = s;
   }
   execute() {
     this.artboardManager.updateArtboard(this.artboardId, this.newProperties);
@@ -6411,9 +6430,9 @@ class ri extends U {
     this.artboardManager.updateArtboard(this.artboardId, this.oldProperties);
   }
 }
-class ni extends U {
-  constructor(t, e, o, i, s) {
-    super(), this.draggedId = t, this.targetId = e, this.position = o, this.oldOrder = [...i], this.onReorder = s, this.newOrder = this.calculateNewOrder();
+class ns extends U {
+  constructor(t, e, o, s, i) {
+    super(), this.draggedId = t, this.targetId = e, this.position = o, this.oldOrder = [...s], this.onReorder = i, this.newOrder = this.calculateNewOrder();
   }
   calculateNewOrder() {
     const t = [...this.oldOrder], e = t.indexOf(this.draggedId);
@@ -6421,8 +6440,8 @@ class ni extends U {
     t.splice(e, 1);
     const o = t.indexOf(this.targetId);
     if (o === -1) return t;
-    const i = this.position === "before" ? o : o + 1;
-    return t.splice(i, 0, this.draggedId), t;
+    const s = this.position === "before" ? o : o + 1;
+    return t.splice(s, 0, this.draggedId), t;
   }
   execute() {
     this.onReorder(this.newOrder);
@@ -6432,7 +6451,7 @@ class ni extends U {
   }
 }
 const Ge = mt("HybridHistoryManager");
-class ai {
+class as {
   constructor(t, e = 50) {
     this.commandExecutedCallbacks = [], this.globalHistory = new ct(e), this.artboardHistories = /* @__PURE__ */ new Map(), this.lastOperation = null, this.artboardManager = t, this.maxHistorySize = e;
   }
@@ -6450,11 +6469,11 @@ class ai {
    * Notify all callbacks that a command was executed
    */
   notifyCommandExecuted(t, e, o) {
-    for (const i of this.commandExecutedCallbacks)
+    for (const s of this.commandExecutedCallbacks)
       try {
-        i(t, e, o);
-      } catch (s) {
-        Ge.error("Error in command executed callback:", s);
+        s(t, e, o);
+      } catch (i) {
+        Ge.error("Error in command executed callback:", i);
       }
   }
   /**
@@ -6493,8 +6512,8 @@ class ai {
       artboardId: t,
       timestamp: Date.now()
     };
-    const i = o.history[o.currentIndex];
-    this.notifyCommandExecuted(i, "artboard", t);
+    const s = o.history[o.currentIndex];
+    this.notifyCommandExecuted(s, "artboard", t);
   }
   /**
    * Execute a command on a specific artboard
@@ -6660,12 +6679,12 @@ class ai {
    */
   getState() {
     const t = this.globalHistory.getState(), e = /* @__PURE__ */ new Map();
-    return this.artboardHistories.forEach((o, i) => {
-      const s = o.getState();
-      e.set(i, {
-        canUndo: s.canUndo,
-        canRedo: s.canRedo,
-        historySize: s.historySize
+    return this.artboardHistories.forEach((o, s) => {
+      const i = o.getState();
+      e.set(s, {
+        canUndo: i.canUndo,
+        canRedo: i.canRedo,
+        historySize: i.historySize
       });
     }), {
       global: {
@@ -6743,8 +6762,8 @@ class Ve {
   evictOldestFont() {
     if (this.fontCache.size <= this.MAX_CACHE_SIZE) return;
     let t = null, e = Date.now();
-    this.fontCache.forEach((o, i) => {
-      o.timestamp < e && (e = o.timestamp, t = i);
+    this.fontCache.forEach((o, s) => {
+      o.timestamp < e && (e = o.timestamp, t = s);
     }), t && this.fontCache.delete(t);
   }
   /**
@@ -6764,7 +6783,7 @@ class Ve {
    */
   async extractFontFileUrl(t, e = 400) {
     try {
-      const o = this.getGoogleFontUrl(t, e), s = await (await fetch(o)).text(), a = /@font-face\s*{([^}]*)}/g, n = Array.from(s.matchAll(a));
+      const o = this.getGoogleFontUrl(t, e), i = await (await fetch(o)).text(), a = /@font-face\s*{([^}]*)}/g, n = Array.from(i.matchAll(a));
       if (n.length === 0)
         return N.warn("No @font-face found in CSS"), null;
       let h = null, l = -1;
@@ -6789,24 +6808,24 @@ class Ve {
     const o = `${t}-${e}`;
     if (this.failedFonts.has(o))
       return null;
-    const i = this.fontCache.get(o);
-    if (i && Date.now() - i.timestamp < this.CACHE_DURATION)
-      return i.timestamp = Date.now(), i.font;
+    const s = this.fontCache.get(o);
+    if (s && Date.now() - s.timestamp < this.CACHE_DURATION)
+      return s.timestamp = Date.now(), s.font;
     try {
-      const s = await this.extractFontFileUrl(t, e);
-      if (!s)
+      const i = await this.extractFontFileUrl(t, e);
+      if (!i)
         return this.failedFonts.add(o), null;
-      const a = await fetch(s);
+      const a = await fetch(i);
       if (!a.ok)
         return N.error(`Font fetch failed: ${a.status} ${a.statusText}`), this.failedFonts.add(o), null;
       const n = await a.arrayBuffer(), h = new Uint8Array(n), c = (await $e()).create(h), g = "fonts" in c ? c.fonts[0] : c;
       return this.fontCache.set(o, {
         font: g,
-        url: s,
+        url: i,
         timestamp: Date.now()
       }), this.evictOldestFont(), g;
-    } catch (s) {
-      return N.error(`Error loading font ${t}:`, s), this.failedFonts.add(o), null;
+    } catch (i) {
+      return N.error(`Error loading font ${t}:`, i), this.failedFonts.add(o), null;
     }
   }
   /**
@@ -6814,8 +6833,8 @@ class Ve {
    * Returns null if font is not cached - font should be pre-loaded before rendering
    */
   getFontSync(t, e = 400) {
-    const o = `${t}-${e}`, i = this.fontCache.get(o);
-    return i && Date.now() - i.timestamp < this.CACHE_DURATION ? (i.timestamp = Date.now(), i.font) : null;
+    const o = `${t}-${e}`, s = this.fontCache.get(o);
+    return s && Date.now() - s.timestamp < this.CACHE_DURATION ? (s.timestamp = Date.now(), s.font) : null;
   }
   /**
    * Clear font cache (useful for debugging or forcing reload)
@@ -6835,13 +6854,13 @@ class Ve {
     var n, h;
     if (this.isSystemFont(t))
       return [];
-    const i = await this.loadFont(t, e);
-    if (!i)
+    const s = await this.loadFont(t, e);
+    if (!s)
       return [];
-    const s = [], a = Math.min(i.numGlyphs, o);
+    const i = [], a = Math.min(s.numGlyphs, o);
     for (let l = 0; l < a; l++)
       try {
-        const c = i.getGlyph(l);
+        const c = s.getGlyph(l);
         if (!c || !c.name || c.name === ".notdef" || c.name.startsWith(".null"))
           continue;
         const g = c.codePoints || [];
@@ -6866,42 +6885,42 @@ class Ve {
         const m = c.name.toLowerCase();
         if (m.includes("swash") || m.includes("cswh") ? u = "swash" : c.name.match(/\.(alt|ss\d+|cv\d+|salt|ornament)/) || c.name.match(/_\d+$/) ? u = "stylistic" : m.match(/liga|dlig/) && (u = "ligature"), u === "default")
           continue;
-        d && d.length > 0 && s.push({
+        d && d.length > 0 && i.push({
           glyphIndex: c.id,
           unicode: d,
           name: f,
           category: u,
-          previewDataUrl: this.generateGlyphPreview(i, c.id, 80)
+          previewDataUrl: this.generateGlyphPreview(s, c.id, 80)
         });
       } catch {
       }
-    return s;
+    return i;
   }
   /**
    * Get glyph alternates for a specific character
    */
   async getGlyphAlternates(t, e, o = 400) {
     var l, c, g, d;
-    const i = await this.loadFont(t, o);
-    if (!i)
+    const s = await this.loadFont(t, o);
+    if (!s)
       return [];
-    const s = [], a = e.codePointAt(0);
+    const i = [], a = e.codePointAt(0);
     if (a === void 0)
       return [];
-    const n = i.glyphForCodePoint(a);
-    n && s.push({
+    const n = s.glyphForCodePoint(a);
+    n && i.push({
       glyphIndex: n.id,
       unicode: e,
       name: n.name || "Default",
       category: "default",
-      previewDataUrl: this.generateGlyphPreview(i, n.id, 80)
+      previewDataUrl: this.generateGlyphPreview(s, n.id, 80)
     });
     const h = n == null ? void 0 : n.name;
     if (h) {
       let f = 0;
-      for (let u = 0; u < i.numGlyphs; u++)
+      for (let u = 0; u < s.numGlyphs; u++)
         try {
-          const m = i.getGlyph(u);
+          const m = s.getGlyph(u);
           if (!m || !m.name) continue;
           if ([
             new RegExp(`^${h}\\.(swash|alt|ss\\d+|salt|ornament)`, "i"),
@@ -6919,19 +6938,19 @@ class Ve {
               const b = (c = m.name.match(/\.ss(\d+)/)) == null ? void 0 : c[1];
               x = `${e} Stylistic Set ${b}`;
             }
-            s.push({
+            i.push({
               glyphIndex: m.id,
               unicode: e,
               name: x,
               category: "stylistic",
-              previewDataUrl: this.generateGlyphPreview(i, m.id, 80)
+              previewDataUrl: this.generateGlyphPreview(s, m.id, 80)
             });
           }
         } catch {
         }
     }
-    if (i.GSUB) {
-      const f = i.GSUB;
+    if (s.GSUB) {
+      const f = s.GSUB;
       if (f.featureList)
         for (const u of f.featureList) {
           const m = u.tag;
@@ -6945,12 +6964,12 @@ class Ve {
                     if (!b) continue;
                     if (this.getCoverageIndex(b, n.id) !== -1) {
                       const v = this.getSubstituteGlyph(x, n.id);
-                      v !== null && s.push({
+                      v !== null && i.push({
                         glyphIndex: v,
                         unicode: e,
                         name: `${e} (${m})`,
                         category: this.categorizeFeature(m),
-                        previewDataUrl: this.generateGlyphPreview(i, v, 80)
+                        previewDataUrl: this.generateGlyphPreview(s, v, 80)
                       });
                     }
                   }
@@ -6963,12 +6982,12 @@ class Ve {
                       const w = v.alternateSets[S];
                       if (w)
                         for (const T of w)
-                          s.push({
+                          i.push({
                             glyphIndex: T,
                             unicode: e,
                             name: `${e} (${m} alt)`,
                             category: this.categorizeFeature(m),
-                            previewDataUrl: this.generateGlyphPreview(i, T, 80)
+                            previewDataUrl: this.generateGlyphPreview(s, T, 80)
                           });
                     }
                   }
@@ -6976,7 +6995,7 @@ class Ve {
             }
         }
     }
-    return s;
+    return i;
   }
   /**
    * Get available OpenType features for a font
@@ -6986,38 +7005,38 @@ class Ve {
     if (!o)
       return N.warn(`Font ${t} failed to load`), [];
     try {
-      const i = [];
+      const s = [];
       if (o.GSUB && o.GSUB.featureList) {
-        const s = /* @__PURE__ */ new Set();
+        const i = /* @__PURE__ */ new Set();
         for (const a of o.GSUB.featureList)
-          a.tag && s.add(a.tag);
-        i.push(...Array.from(s));
+          a.tag && i.add(a.tag);
+        s.push(...Array.from(i));
       }
       if (o.GPOS && o.GPOS.featureList) {
-        const s = /* @__PURE__ */ new Set();
+        const i = /* @__PURE__ */ new Set();
         for (const a of o.GPOS.featureList)
-          a.tag && s.add(a.tag);
-        i.push(...Array.from(s));
+          a.tag && i.add(a.tag);
+        s.push(...Array.from(i));
       }
-      return i;
-    } catch (i) {
-      return N.error(`Error getting features for ${t}:`, i), [];
+      return s;
+    } catch (s) {
+      return N.error(`Error getting features for ${t}:`, s), [];
     }
   }
   /**
    * Generate a preview image for a glyph
    */
   generateGlyphPreview(t, e, o = 80) {
-    const i = document.createElement("canvas");
-    i.width = o, i.height = o;
-    const s = i.getContext("2d");
-    if (!s)
+    const s = document.createElement("canvas");
+    s.width = o, s.height = o;
+    const i = s.getContext("2d");
+    if (!i)
       return "";
     try {
       const a = t.getGlyph(e);
       if (!a)
         return "";
-      s.clearRect(0, 0, o, o);
+      i.clearRect(0, 0, o, o);
       const n = a.bbox;
       if (!n)
         return "";
@@ -7028,7 +7047,7 @@ class Ve {
       if (!p)
         return "";
       const y = new Path2D(p);
-      return s.save(), s.translate(u, m), s.scale(g, -g), s.translate(-d, -f), s.fillStyle = "#000000", s.fill(y), s.restore(), i.toDataURL("image/png");
+      return i.save(), i.translate(u, m), i.scale(g, -g), i.translate(-d, -f), i.fillStyle = "#000000", i.fill(y), i.restore(), s.toDataURL("image/png");
     } catch (a) {
       return N.error("Error generating glyph preview:", a), "";
     }
@@ -7091,10 +7110,10 @@ class Ve {
       return t.glyphs.indexOf(e);
     if (t.format === 2 && t.ranges) {
       const o = t.ranges;
-      for (let i = 0; i < o.length; i++) {
-        const s = o[i];
-        if (e >= s.start && e <= s.end)
-          return s.index + (e - s.start);
+      for (let s = 0; s < o.length; s++) {
+        const i = o[s];
+        if (e >= i.start && e <= i.end)
+          return i.index + (e - i.start);
       }
     }
     return -1;
@@ -7107,9 +7126,9 @@ class Ve {
     if (t.substFormat === 1 && typeof t.deltaGlyphId == "number")
       return e + t.deltaGlyphId;
     if (t.substFormat === 2 && t.substitute) {
-      const o = this.getCoverageIndex(t.coverage, e), i = t.substitute;
-      if (o !== -1 && i[o] !== void 0)
-        return i[o];
+      const o = this.getCoverageIndex(t.coverage, e), s = t.substitute;
+      if (o !== -1 && s[o] !== void 0)
+        return s[o];
     }
     return null;
   }
@@ -7120,9 +7139,9 @@ class Ve {
     const o = await this.loadFont(t, e);
     if (!o)
       return 0;
-    let i = 0;
-    const s = Math.min(o.numGlyphs, 1500);
-    for (let a = 0; a < s; a++)
+    let s = 0;
+    const i = Math.min(o.numGlyphs, 1500);
+    for (let a = 0; a < i; a++)
       try {
         const n = o.getGlyph(a);
         if (!n || !n.name || n.name === ".notdef" || n.name.startsWith(".null"))
@@ -7135,10 +7154,10 @@ class Ve {
         }
         let c = "default";
         const g = n.name.toLowerCase();
-        g.includes("swash") || g.includes("cswh") ? c = "swash" : n.name.match(/\.(alt|ss\d+|cv\d+|salt|ornament)/) || n.name.match(/_\d+$/) ? c = "stylistic" : g.match(/liga|dlig/) && (c = "ligature"), c !== "default" && l && l.length > 0 && i++;
+        g.includes("swash") || g.includes("cswh") ? c = "swash" : n.name.match(/\.(alt|ss\d+|cv\d+|salt|ornament)/) || n.name.match(/_\d+$/) ? c = "stylistic" : g.match(/liga|dlig/) && (c = "ligature"), c !== "default" && l && l.length > 0 && s++;
       } catch {
       }
-    return i;
+    return s;
   }
   /**
    * Get cache statistics
@@ -7150,7 +7169,7 @@ class Ve {
     };
   }
 }
-const hi = new Ve();
+const hs = new Ve();
 export {
   be as $,
   nt as A,
@@ -7166,14 +7185,14 @@ export {
   Ie as K,
   Z as L,
   ze as M,
-  ai as N,
+  as as N,
   Xe as O,
   Mt as P,
   ye as Q,
   P as R,
   Ft as S,
   q as T,
-  ti as U,
+  ts as U,
   ke as V,
   We as W,
   Uo as X,
@@ -7198,8 +7217,8 @@ export {
   Ee as aE,
   qo as aF,
   uo as aG,
-  io as aH,
-  so as aI,
+  so as aH,
+  io as aI,
   oo as aJ,
   he as aK,
   eo as aL,
@@ -7219,17 +7238,17 @@ export {
   rt as aZ,
   Co as aa,
   J as ab,
-  ei as ac,
-  oi as ad,
-  ii as ae,
-  si as af,
-  ri as ag,
-  ni as ah,
+  es as ac,
+  os as ad,
+  ss as ae,
+  is as af,
+  rs as ag,
+  ns as ah,
   fe as ai,
   ue as aj,
   co as ak,
   He as al,
-  st as am,
+  it as am,
   bo as an,
   vt as ao,
   zt as ap,
@@ -7267,6 +7286,6 @@ export {
   ko as w,
   Mo as x,
   Dt as y,
-  hi as z
+  hs as z
 };
-//# sourceMappingURL=FontAnalyzer-EF3gLPr8.js.map
+//# sourceMappingURL=FontAnalyzer-PE6nysqE.js.map