@ssgoi/core 3.4.0 → 4.0.0

package/dist/view-transitions/index.js

@@ -1,26 +1,46 @@
-import { p as b, g as x } from "../jaemin-BWkrXq0V.js";
-import { a as Ht } from "../jaemin-BWkrXq0V.js";
-const F = (t) => new Promise((n) => setTimeout(n, t));
-function T() {
-  let t, n;
-  return { promise: new Promise((d, a) => {
-    t = d, n = a;
-  }), resolve: t, reject: n };
+const $ = (t, i) => {
+  var o;
+  t.style.position = "absolute", t.style.width = "100%", t.style.top = `${-1 * (((o = i == null ? void 0 : i.scrollOffset) == null ? void 0 : o.y) ?? 0)}px`, t.style.left = "0";
+}, V = (t) => new Promise((i) => setTimeout(i, t));
+function x(t, i) {
+  function o(s) {
+    let n = 0, e = 0;
+    const c = s.offsetWidth, y = s.offsetHeight;
+    let r = s;
+    for (; r; )
+      n += r.offsetTop, e += r.offsetLeft, r = r.offsetParent;
+    return n -= window.scrollY, e -= window.scrollX, { top: n, left: e, width: c, height: y };
+  }
+  const l = o(t), a = o(i);
+  return new DOMRect(
+    a.left - l.left,
+    a.top - l.top,
+    a.width,
+    a.height
+  );
+}
+function E() {
+  let t, i;
+  return { promise: new Promise((l, a) => {
+    t = l, i = a;
+  }), resolve: t, reject: i };
 }
-const N = { stiffness: 80, damping: 25 }, G = { stiffness: 75, damping: 25 }, q = 300, j = 10, K = "horizontal", Z = "#000000", It = (t = {}) => {
+const N = {
+  spring: { stiffness: 80, damping: 25 }
+}, j = {
+  spring: { stiffness: 75, damping: 25 }
+}, G = 300, Z = 10, J = "horizontal", K = "#000000", Nt = (t = {}) => {
   const {
-    inSpring: n = G,
-    outSpring: i = N,
-    transitionDelay: d = q,
-    blindCount: a = j,
-    direction: s = K,
-    blindColor: l = Z
-  } = t;
-  let r, o = null;
-  const c = (e, g, y = "left") => {
-    window.getComputedStyle(e).position === "static" && (e.style.position = "relative");
-    const p = document.createElement("div");
-    p.className = "blind-container", p.style.cssText = `
+    transitionDelay: i = G,
+    blindCount: o = Z,
+    direction: l = J,
+    blindColor: a = K
+  } = t, s = t.physics ?? j, n = t.physics ?? N;
+  let e, c = null;
+  const y = (r, d, h = "left") => {
+    window.getComputedStyle(r).position === "static" && (r.style.position = "relative");
+    const g = document.createElement("div");
+    g.className = "blind-container", g.style.cssText = `
       position: absolute;
       top: 0;
       left: 0;
@@ -30,341 +50,555 @@ const N = { stiffness: 80, damping: 25 }, G = { stiffness: 75, damping: 25 }, q
       z-index: 9999;
       overflow: hidden;
     `;
-    const u = [];
-    for (let m = 0; m < a; m++) {
+    const p = [];
+    for (let w = 0; w < o; w++) {
       const f = document.createElement("div");
-      if (s === "horizontal") {
-        const w = 100 / a, $ = `calc(${w}% + 1px)`;
+      if (l === "horizontal") {
+        const b = 100 / o, m = `calc(${b}% + 1px)`;
         f.style.cssText = `
           position: absolute;
-          top: ${w * m}%;
+          top: ${b * w}%;
           left: 0;
           width: 100%;
-          height: ${$};
-          background: ${l};
-          transform: scaleX(${g === "hidden" ? 0 : 1});
-          transform-origin: ${y} center;
+          height: ${m};
+          background: ${a};
+          transform: scaleX(${d === "hidden" ? 0 : 1});
+          transform-origin: ${h} center;
           will-change: transform;
         `;
       } else {
-        const w = 100 / a, $ = `calc(${w}% + 1px)`;
+        const b = 100 / o, m = `calc(${b}% + 1px)`;
         f.style.cssText = `
           position: absolute;
           top: 0;
-          left: ${w * m}%;
-          width: ${$};
+          left: ${b * w}%;
+          width: ${m};
           height: 100%;
-          background: ${l};
-          transform: scaleY(${g === "hidden" ? 0 : 1});
-          transform-origin: ${y === "left" ? "top" : "bottom"} center;
+          background: ${a};
+          transform: scaleY(${d === "hidden" ? 0 : 1});
+          transform-origin: ${h === "left" ? "top" : "bottom"} center;
           will-change: transform;
         `;
       }
-      u.push(f), p.appendChild(f);
+      p.push(f), g.appendChild(f);
     }
-    return e.appendChild(p), { container: p, blinds: u };
+    return r.appendChild(g), { container: g, blinds: p };
   };
   return {
     out: () => {
-      let e = null;
-      r = new Promise((h) => {
-        o = h;
+      let r = null;
+      e = new Promise((u) => {
+        c = u;
       });
-      const g = (h) => {
-        const p = 1 - h;
+      const d = (u) => {
+        const g = 1 - u;
         return {
-          transform: s === "horizontal" ? `scaleX(${p})` : `scaleY(${p})`
+          transform: l === "horizontal" ? `scaleX(${g})` : `scaleY(${g})`
         };
       };
       return {
-        springs: Array.from({ length: a }, (h, p) => ({
-          spring: i,
+        springs: Array.from({ length: o }, (u, g) => ({
+          physics: n,
           offset: 0.2,
           css: {
             // Use getter for lazy element access (evaluated after prepare)
             get element() {
-              return e == null ? void 0 : e.blinds[p];
+              return r == null ? void 0 : r.blinds[g];
             },
-            style: g
+            style: d
           }
         })),
         schedule: "stagger",
-        prepare: (h) => {
-          b(h), h.style.zIndex = "1000", e = c(h, "hidden", "left");
+        prepare: (u) => {
+          $(u), u.style.zIndex = "1000", r = y(u, "hidden", "left");
         },
         onStart: () => {
         },
         onEnd: () => {
-          o && o();
+          c && c();
         }
       };
     },
     in: () => {
-      let e = null;
-      const g = (h) => {
-        const p = 1 - h;
+      let r = null;
+      const d = (u) => {
+        const g = 1 - u;
         return {
-          transform: s === "horizontal" ? `scaleX(${p})` : `scaleY(${p})`
+          transform: l === "horizontal" ? `scaleX(${g})` : `scaleY(${g})`
         };
       };
       return {
-        springs: Array.from({ length: a }, (h, p) => ({
-          spring: n,
+        springs: Array.from({ length: o }, (u, g) => ({
+          physics: s,
           offset: 0.2,
           css: {
             // Use getter for lazy element access (evaluated after prepare)
             get element() {
-              return e == null ? void 0 : e.blinds[p];
+              return r == null ? void 0 : r.blinds[g];
             },
-            style: g
+            style: d
           }
         })),
         schedule: "stagger",
-        prepare: (h) => {
-          h.style.position = "relative", h.style.zIndex = "0", e = c(h, "closed", "right");
+        prepare: (u) => {
+          u.style.position = "relative", u.style.zIndex = "0", r = y(u, "closed", "right");
         },
         onStart: () => {
         },
         wait: async () => {
-          r && await r, await F(d);
+          e && await e, await V(i);
         },
         onEnd: () => {
-          e && e.container && e.container.remove();
+          r && r.container && r.container.remove();
         }
       };
     }
   };
-}, J = {
-  stiffness: 125,
-  damping: 20,
-  doubleSpring: 0.8
 }, Q = {
-  stiffness: 130,
-  damping: 20,
-  doubleSpring: 0.8
-}, Ot = (t = {}) => {
-  var s, l, r;
-  const { opacity: n = !1, direction: i = "enter" } = t, d = i === "enter" ? J : Q, a = {
-    stiffness: ((s = t.spring) == null ? void 0 : s.stiffness) ?? d.stiffness,
-    damping: ((l = t.spring) == null ? void 0 : l.damping) ?? d.damping,
-    doubleSpring: ((r = t.spring) == null ? void 0 : r.doubleSpring) ?? d.doubleSpring
+  spring: { stiffness: 1, damping: 1 }
+}, R = {
+  spring: { stiffness: 20, damping: 25 }
+}, tt = "#000000", st = "circle", v = "CURTAIN_REVEAL_OVERLAY_ID", nt = {
+  position: "fixed",
+  inset: "0",
+  width: "100vw",
+  height: "100%",
+  zIndex: "9999",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  overflow: "hidden"
+}, it = {
+  position: "relative",
+  display: "inline-block",
+  height: "5.5rem",
+  overflow: "hidden"
+}, et = {
+  display: "flex",
+  height: "100%",
+  willChange: "transform",
+  transition: "transform 0.3s ease"
+}, rt = {
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  whiteSpace: "nowrap",
+  fontSize: "5.5rem",
+  fontWeight: "900",
+  letterSpacing: "0.02em",
+  color: "#FFFFFF"
+}, at = 0.4, A = 0.5, ot = 0.2;
+function lt(t, i) {
+  switch (t) {
+    case "circle":
+      return `circle(${i * 100}% at 50% 50%)`;
+    case "square":
+      return `inset(${(1 - i) * 50}% round ${10 * i}%)`;
+    case "triangle": {
+      const o = i * 100;
+      return `polygon(50% ${50 - o}%, ${50 - o}% ${50 + o}%, ${50 + o}% ${50 + o}%)`;
+    }
+  }
+}
+const ct = (t) => t.reduce((i, o) => i + o, 0), jt = (t = {}) => {
+  const {
+    background: i = tt,
+    texts: o = [],
+    shape: l = st,
+    textStyle: a = {}
+  } = t, s = t.physics ?? R, n = t.physics ?? Q;
+  return {
+    out: (e, c) => {
+      const y = e.style.opacity;
+      return {
+        physics: n,
+        from: 1,
+        to: 0,
+        prepare: (r) => {
+          $(r, c), r.style.opacity = "1";
+        },
+        tick: (r) => {
+          const d = Math.max(0, r - at);
+          e.style.opacity = String(d);
+        },
+        onEnd: () => {
+          e.style.opacity = y;
+        }
+      };
+    },
+    in: (e) => {
+      let c = null, y = null, r = null;
+      const d = document.body.style.overflow, h = document.getElementById(
+        v
+      );
+      let u = [];
+      const g = () => {
+        c = document.createElement("div"), c.id = v, Object.assign(c.style, nt, { background: i }), document.body.appendChild(c), y = document.createElement("div"), Object.assign(y.style, it), c.appendChild(y), r = document.createElement("div"), Object.assign(r.style, et), y.appendChild(r), o.forEach((p) => {
+          const w = document.createElement("div");
+          w.textContent = p, Object.assign(w.style, rt, a), r.appendChild(w);
+        }), u = Array.from(r.children).map(
+          (p) => p.getBoundingClientRect().width
+        );
+      };
+      return {
+        physics: s,
+        from: 0,
+        to: 1,
+        prepare: () => {
+          document.body.style.overflow = "hidden", e.style.opacity = "1", h == null || h.remove(), g(), c && y && (c.style.clipPath = "none", y.style.transform = "scale(1)");
+        },
+        tick: (p) => {
+          if (!(!c || !y || !r)) {
+            if (p <= A && o.length > 0) {
+              const w = p / A, f = Math.min(
+                Math.floor(w * o.length),
+                o.length - 1
+              ), b = u[f] ?? 0, m = ct(u.slice(0, f));
+              y.style.width = `${b}px`, r.style.transform = `translateX(-${m}px)`;
+            }
+            if (p > A) {
+              const f = 1 - Math.max(
+                0,
+                Math.min(1, (p - A) / ot)
+              );
+              c.style.clipPath = lt(l, f), y.style.transform = `scale(${f})`;
+            }
+          }
+        },
+        onEnd: () => {
+          c == null || c.remove(), c = y = r = null, document.body.style.overflow = d;
+        }
+      };
+    }
+  };
+}, yt = {
+  inertia: {
+    acceleration: 50,
+    resistance: 1.5
+  }
+}, ht = {
+  inertia: {
+    acceleration: 50,
+    resistance: 1
+  }
+}, C = 0.05;
+function S(t) {
+  const i = x(document.body, t.positionedParent), o = t.scroll.y, l = window.innerHeight - i.top;
+  return {
+    top: o,
+    left: 0,
+    width: i.width,
+    height: l
   };
+}
+const Gt = (t = {}) => {
+  const { direction: i = "enter" } = t, o = t.physics ?? (i === "enter" ? yt : ht);
+  let { promise: l, resolve: a } = E();
   return i === "enter" ? {
-    in: (o) => ({
-      spring: a,
+    // Entering page: scales up from small (0.8 → 1) with fade in
+    in: (s, n) => {
+      const e = S(n), c = e.left + e.width / 2, y = e.top + e.height / 2;
+      return {
+        physics: o,
+        prepare: () => {
+          s.style.opacity = "0", s.style.willChange = "transform, opacity", s.style.backfaceVisibility = "hidden", s.style.contain = "layout paint", s.style.transformOrigin = `${c}px ${y}px`;
+        },
+        wait: async () => {
+          if (l) {
+            await l;
+            const r = E();
+            l = r.promise, a = r.resolve;
+          }
+        },
+        css: (r) => ({
+          transform: `scale(${1 - C + r * C})`,
+          opacity: r
+        }),
+        onEnd: () => {
+          s.style.opacity = "1", s.style.willChange = "auto", s.style.backfaceVisibility = "", s.style.contain = "", s.style.transformOrigin = "";
+        }
+      };
+    },
+    // Exiting page: scales up (1 → 1.2) with fade out, goes to back
+    out: (s, n) => {
+      const e = S(n), c = e.left + e.width / 2, y = e.top + e.height / 2 + n.scrollOffset.y;
+      return {
+        physics: o,
+        prepare: (r) => {
+          $(r, n), r.style.zIndex = "-1", r.style.willChange = "transform, opacity", r.style.backfaceVisibility = "hidden", r.style.contain = "layout paint", r.style.pointerEvents = "none", r.style.transformOrigin = `${c}px ${y}px`;
+        },
+        css: (r) => ({
+          transform: `scale(${1 + (1 - r) * C})`,
+          opacity: r
+        }),
+        onEnd: () => {
+          a && a();
+        }
+      };
+    }
+  } : {
+    // Entering page: scales down from large (1.2 → 1) with fade in
+    in: (s, n) => {
+      const e = S(n), c = e.left + e.width / 2, y = e.top + e.height / 2;
+      return {
+        physics: o,
+        prepare: () => {
+          s.style.opacity = "0", s.style.willChange = "transform, opacity", s.style.backfaceVisibility = "hidden", s.style.contain = "layout paint", s.style.transformOrigin = `${c}px ${y}px`;
+        },
+        wait: async () => {
+          if (l) {
+            await l;
+            const r = E();
+            l = r.promise, a = r.resolve;
+          }
+        },
+        css: (r) => ({
+          transform: `scale(${1 + C - r * C})`,
+          opacity: r
+        }),
+        onEnd: () => {
+          s.style.opacity = "1", s.style.willChange = "auto", s.style.backfaceVisibility = "", s.style.contain = "", s.style.transformOrigin = "";
+        }
+      };
+    },
+    // Exiting page: scales down to small (1 → 0.8) with fade out
+    out: (s, n) => {
+      const e = S(n), c = e.left + e.width / 2, y = e.top + e.height / 2 + n.scrollOffset.y;
+      return {
+        physics: o,
+        prepare: (r) => {
+          $(r, n), r.style.zIndex = "100", r.style.willChange = "transform, opacity", r.style.backfaceVisibility = "hidden", r.style.contain = "layout paint", r.style.pointerEvents = "none", r.style.transformOrigin = `${c}px ${y}px`;
+        },
+        css: (r) => ({
+          transform: `scale(${1 - (1 - r) * C})`,
+          opacity: r
+        }),
+        onEnd: () => {
+          a && a();
+        }
+      };
+    }
+  };
+}, pt = {
+  inertia: {
+    acceleration: 20,
+    resistance: 1.5
+  }
+}, dt = {
+  inertia: {
+    acceleration: 20,
+    resistance: 1
+  }
+}, Zt = (t = {}) => {
+  const { opacity: i = !1, direction: o = "enter" } = t, l = t.physics ?? (o === "enter" ? pt : dt);
+  return o === "enter" ? {
+    in: (a) => ({
+      physics: l,
       prepare: () => {
-        o.style.willChange = n ? "transform, opacity" : "transform", o.style.backfaceVisibility = "hidden", o.style.contain = "layout paint";
+        a.style.willChange = i ? "transform, opacity" : "transform", a.style.backfaceVisibility = "hidden", a.style.contain = "layout paint";
       },
-      css: (c) => {
-        const e = {
-          transform: `translate3d(${(1 - c) * 100}%, 0, 0)`
+      css: (s) => {
+        const n = {
+          transform: `translate3d(${(1 - s) * 100}%, 0, 0)`
         };
-        return n && (e.opacity = c), e;
+        return i && (n.opacity = s), n;
       },
       onEnd: () => {
-        o.style.willChange = "auto", o.style.backfaceVisibility = "", o.style.contain = "";
+        a.style.willChange = "auto", a.style.backfaceVisibility = "", a.style.contain = "";
       }
     }),
-    out: (o, c) => ({
-      spring: a,
-      prepare: (e) => {
-        b(e, c), e.style.zIndex = "-1", e.style.willChange = n ? "transform, opacity" : "transform", e.style.backfaceVisibility = "hidden", e.style.contain = "layout paint", e.style.pointerEvents = "none";
+    out: (a, s) => ({
+      physics: l,
+      prepare: (n) => {
+        $(n, s), n.style.zIndex = "-1", n.style.willChange = i ? "transform, opacity" : "transform", n.style.backfaceVisibility = "hidden", n.style.contain = "layout paint", n.style.pointerEvents = "none";
       },
-      css: (e) => {
-        const g = {
-          transform: `translate3d(${-(1 - e) * 20}%, 0, 0)`
+      css: (n) => {
+        const e = {
+          transform: `translate3d(${-(1 - n) * 20}%, 0, 0)`
         };
-        return n && (g.opacity = e), g;
+        return i && (e.opacity = n), e;
       }
     })
   } : {
-    in: (o) => ({
-      spring: a,
+    in: (a) => ({
+      physics: l,
       prepare: () => {
-        o.style.willChange = n ? "transform, opacity" : "transform", o.style.backfaceVisibility = "hidden", o.style.contain = "layout paint";
+        a.style.willChange = i ? "transform, opacity" : "transform", a.style.backfaceVisibility = "hidden", a.style.contain = "layout paint";
       },
-      css: (c) => {
-        const e = {
-          transform: `translate3d(${-(1 - c) * 20}%, 0, 0)`
+      css: (s) => {
+        const n = {
+          transform: `translate3d(${-(1 - s) * 20}%, 0, 0)`
         };
-        return n && (e.opacity = c), e;
+        return i && (n.opacity = s), n;
       },
       onEnd: () => {
-        o.style.willChange = "auto", o.style.backfaceVisibility = "", o.style.contain = "";
+        a.style.willChange = "auto", a.style.backfaceVisibility = "", a.style.contain = "";
       }
     }),
-    out: (o, c) => ({
-      spring: a,
-      prepare: (e) => {
-        b(e, c), e.style.zIndex = "100", e.style.willChange = n ? "transform, opacity" : "transform", e.style.backfaceVisibility = "hidden", e.style.contain = "layout paint", e.style.pointerEvents = "none";
+    out: (a, s) => ({
+      physics: l,
+      prepare: (n) => {
+        $(n, s), n.style.zIndex = "100", n.style.willChange = i ? "transform, opacity" : "transform", n.style.backfaceVisibility = "hidden", n.style.contain = "layout paint", n.style.pointerEvents = "none";
       },
-      css: (e) => {
-        const g = {
-          transform: `translate3d(${(1 - e) * 100}%, 0, 0)`
+      css: (n) => {
+        const e = {
+          transform: `translate3d(${(1 - n) * 100}%, 0, 0)`
         };
-        return n && (g.opacity = e), g;
+        return i && (e.opacity = n), e;
       }
     })
   };
-}, R = {
-  stiffness: 180,
-  damping: 20,
-  doubleSpring: !0
-}, tt = {
-  stiffness: 170,
-  damping: 20,
-  doubleSpring: !0
-}, nt = 0, Dt = (t = {}) => {
-  const {
-    inSpring: n = tt,
-    outSpring: i = R,
-    transitionDelay: d = nt
-  } = t;
-  let { promise: a, resolve: s } = T();
+}, ut = {
+  spring: { stiffness: 180, damping: 20, doubleSpring: !0 }
+}, gt = {
+  spring: { stiffness: 170, damping: 20, doubleSpring: !0 }
+}, ft = 0, Jt = (t = {}) => {
+  const { transitionDelay: i = ft } = t, o = t.physics ?? gt, l = t.physics ?? ut;
+  let { promise: a, resolve: s } = E();
   return {
-    in: (l) => ({
-      spring: n,
+    in: (n) => ({
+      physics: o,
       prepare: () => {
-        l.style.opacity = "0", l.style.willChange = "opacity";
+        n.style.opacity = "0", n.style.willChange = "opacity";
       },
       wait: async () => {
         if (a) {
           await a;
-          const r = T();
-          a = r.promise, s = r.resolve, await F(d);
+          const e = E();
+          a = e.promise, s = e.resolve, await V(i);
         }
       },
-      css: (r) => ({
-        opacity: r
+      css: (e) => ({
+        opacity: e
       }),
       onEnd: () => {
-        l.style.willChange = "auto", l.style.opacity = "1";
+        n.style.willChange = "auto", n.style.opacity = "1";
       }
     }),
-    out: (l, r) => ({
-      spring: i,
-      css: (o) => ({
-        opacity: o
+    out: (n, e) => ({
+      physics: l,
+      css: (c) => ({
+        opacity: c
       }),
       prepare: () => {
-        b(l, r), l.style.willChange = "opacity";
+        $(n, e), n.style.willChange = "opacity";
       },
       onEnd: () => {
-        s && s(), l.style.willChange = "auto";
+        s && s(), n.style.willChange = "auto";
       }
     })
   };
-}, et = {
+}, wt = {
   scaleDown: { stiffness: 20, damping: 7 },
   // Soft start for cinematic scale
   translate: { stiffness: 15, damping: 7 },
   // Medium for movement
   scaleUp: { stiffness: 20, damping: 7 }
   // Crisp return to full size
-}, E = {
+}, O = {
   scaleDown: 0,
   // Start immediately
   translate: 0.2,
   // Start when scaleDown is 25% complete
   scaleUp: 0.8
   // Start when translate is 70% complete
-}, it = 0.8, st = "white", Pt = (t) => {
+}, $t = 0.8, bt = "white", Kt = (t) => {
   var a;
-  const n = et, i = it, d = ((a = t == null ? void 0 : t.border) == null ? void 0 : a.color) ?? st;
+  const i = wt, o = $t, l = ((a = t == null ? void 0 : t.border) == null ? void 0 : a.color) ?? bt;
   return {
-    out: async (s, l) => {
-      const r = k(l), o = x(document.body, l.positionedParent), c = at(d, {
-        ...r,
-        top: o.top
-      }), e = {
+    out: async (s, n) => {
+      const e = _(n), c = x(document.body, n.positionedParent), y = Et(l, {
+        ...e,
+        top: c.top
+      }), r = {
         scale: 1,
-        translateY: -r.top
-      }, g = () => {
-        s.style.transform = `translateY(${e.translateY}px) scale(${e.scale})`;
-        const y = (r.width - r.width * e.scale) / 2, h = (r.height - r.height * e.scale) / 2;
-        rt(c, y, h);
+        translateY: -e.top
+      }, d = () => {
+        s.style.transform = `translateY(${r.translateY}px) scale(${r.scale})`;
+        const h = (e.width - e.width * r.scale) / 2, u = (e.height - e.height * r.scale) / 2;
+        xt(y, h, u);
       };
       return {
         springs: [
           // Spring 1: Scale Down (1 → scale)
           {
-            spring: n.scaleDown,
-            offset: E.scaleDown,
-            tick: (y) => {
-              const h = 1 - y;
-              e.scale = 1 - (1 - i) * h, g();
+            physics: (t == null ? void 0 : t.physics) ?? { spring: i.scaleDown },
+            offset: O.scaleDown,
+            tick: (h) => {
+              const u = 1 - h;
+              r.scale = 1 - (1 - o) * u, d();
             }
           },
           // Spring 2: Translate (vertical movement)
           {
-            spring: n.translate,
-            offset: E.translate,
-            tick: (y) => {
-              const h = 1 - y;
-              e.translateY = -r.top - r.height * h, g();
+            physics: (t == null ? void 0 : t.physics) ?? { spring: i.translate },
+            offset: O.translate,
+            tick: (h) => {
+              const u = 1 - h;
+              r.translateY = -e.top - e.height * u, d();
             }
           },
           // Spring 3: Scale Up (scale → 1)
           {
-            spring: n.scaleUp,
-            offset: E.scaleUp,
-            tick: (y) => {
-              const h = 1 - y;
-              e.scale = i + (1 - i) * h, g();
+            physics: (t == null ? void 0 : t.physics) ?? { spring: i.scaleUp },
+            offset: O.scaleUp,
+            tick: (h) => {
+              const u = 1 - h;
+              r.scale = o + (1 - o) * u, d();
             }
           }
         ],
         schedule: "stagger",
         prepare: () => {
-          b(s), _(s, r), I(s, r), lt(s, r);
-          for (const y of c)
-            l.positionedParent.appendChild(y);
+          $(s), I(s, e), Y(s, e), mt(s, e);
+          for (const h of y)
+            n.positionedParent.appendChild(h);
         },
         onEnd: () => {
           s.style.clipPath = "", s.style.transformOrigin = "", setTimeout(() => {
-            for (const y of c)
-              l.positionedParent.removeChild(y);
+            for (const h of y)
+              n.positionedParent.removeChild(h);
           }, 1e3);
         }
       };
     },
-    in: async (s, l) => {
-      const r = k(l), o = {
-        scale: i,
-        translateY: -r.top + r.height
-      }, c = () => {
-        s.style.transform = `translateY(${o.translateY}px) scale(${o.scale})`;
+    in: async (s, n) => {
+      const e = _(n), c = {
+        scale: o,
+        translateY: -e.top + e.height
+      }, y = () => {
+        s.style.transform = `translateY(${c.translateY}px) scale(${c.scale})`;
       };
       return {
         springs: [
           // Spring 1: Scale Down (1 → scale) - element starts scaled, shrinks further
           {
-            spring: n.scaleDown,
-            offset: E.scaleDown,
-            tick: (e) => {
-              o.scale = 1 - (1 - i) * e, c();
+            physics: (t == null ? void 0 : t.physics) ?? { spring: i.scaleDown },
+            offset: O.scaleDown,
+            tick: (r) => {
+              c.scale = 1 - (1 - o) * r, y();
             }
           },
           // Spring 2: Translate (vertical movement from bottom to top)
           {
-            spring: n.translate,
-            offset: E.translate,
-            tick: (e) => {
-              o.translateY = -r.top + r.height * (1 - e), c();
+            physics: (t == null ? void 0 : t.physics) ?? { spring: i.translate },
+            offset: O.translate,
+            tick: (r) => {
+              c.translateY = -e.top + e.height * (1 - r), y();
             }
           },
           // Spring 3: Scale Up (scale → 1) - element returns to full size
           {
-            spring: n.scaleUp,
-            offset: E.scaleUp,
-            tick: (e) => {
-              o.scale = i + (1 - i) * e, c();
+            physics: (t == null ? void 0 : t.physics) ?? { spring: i.scaleUp },
+            offset: O.scaleUp,
+            tick: (r) => {
+              c.scale = o + (1 - o) * r, y();
             }
           }
         ],
         schedule: "stagger",
         prepare: () => {
-          _(s, r), I(s, r), s.style.transform = `translateY(${-r.top + r.height}px) scale(${i})`;
+          I(s, e), Y(s, e), s.style.transform = `translateY(${-e.top + e.height}px) scale(${o})`;
         },
         onEnd: () => {
           s.style.clipPath = "", s.style.transformOrigin = "", s.style.transform = "";
@@ -373,746 +607,910 @@ const N = { stiffness: 80, damping: 25 }, G = { stiffness: 75, damping: 25 }, q
     }
   };
 };
-function rt(t, n, i) {
-  const d = n * 0.7, a = i * 0.7;
-  t.topLeft.style.transform = `translate(${d}px, ${a}px)`, t.topRight.style.transform = `translate(${-d}px, ${a}px)`, t.bottomLeft.style.transform = `translate(${d}px, ${-a}px)`, t.bottomRight.style.transform = `translate(${-d}px, ${-a}px)`;
+function xt(t, i, o) {
+  const l = i * 0.7, a = o * 0.7;
+  t.topLeft.style.transform = `translate(${l}px, ${a}px)`, t.topRight.style.transform = `translate(${-l}px, ${a}px)`, t.bottomLeft.style.transform = `translate(${l}px, ${-a}px)`, t.bottomRight.style.transform = `translate(${-l}px, ${-a}px)`;
 }
-function at(t = "white", n) {
+function Et(t = "white", i) {
   const a = document.createElement("div");
-  a.style.position = "fixed", a.style.pointerEvents = "none", a.style.zIndex = "9999", a.style.top = `${n.top - 1}px`, a.style.left = `${n.left - 1}px`, a.style.width = "15px", a.style.height = "15px";
+  a.style.position = "fixed", a.style.pointerEvents = "none", a.style.zIndex = "9999", a.style.top = `${i.top - 1}px`, a.style.left = `${i.left - 1}px`, a.style.width = "15px", a.style.height = "15px";
   const s = document.createElement("div");
   s.style.position = "absolute", s.style.width = "15px", s.style.height = "1px", s.style.backgroundColor = t, s.style.top = "0", s.style.left = "0";
-  const l = document.createElement("div");
-  l.style.position = "absolute", l.style.width = "1px", l.style.height = "15px", l.style.backgroundColor = t, l.style.top = "0", l.style.left = "0", a.appendChild(s), a.appendChild(l);
-  const r = document.createElement("div");
-  r.style.position = "fixed", r.style.pointerEvents = "none", r.style.zIndex = "9999", r.style.top = `${n.top - 1}px`, r.style.left = `${n.left + n.width - 15 + 1}px`, r.style.width = "15px", r.style.height = "15px";
-  const o = document.createElement("div");
-  o.style.position = "absolute", o.style.width = "15px", o.style.height = "1px", o.style.backgroundColor = t, o.style.top = "0", o.style.right = "0";
-  const c = document.createElement("div");
-  c.style.position = "absolute", c.style.width = "1px", c.style.height = "15px", c.style.backgroundColor = t, c.style.top = "0", c.style.right = "0", r.appendChild(o), r.appendChild(c);
+  const n = document.createElement("div");
+  n.style.position = "absolute", n.style.width = "1px", n.style.height = "15px", n.style.backgroundColor = t, n.style.top = "0", n.style.left = "0", a.appendChild(s), a.appendChild(n);
   const e = document.createElement("div");
-  e.style.position = "fixed", e.style.pointerEvents = "none", e.style.zIndex = "9999", e.style.top = `${n.top + n.height - 15 + 1}px`, e.style.left = `${n.left - 1}px`, e.style.width = "15px", e.style.height = "15px";
-  const g = document.createElement("div");
-  g.style.position = "absolute", g.style.width = "15px", g.style.height = "1px", g.style.backgroundColor = t, g.style.bottom = "0", g.style.left = "0";
+  e.style.position = "fixed", e.style.pointerEvents = "none", e.style.zIndex = "9999", e.style.top = `${i.top - 1}px`, e.style.left = `${i.left + i.width - 15 + 1}px`, e.style.width = "15px", e.style.height = "15px";
+  const c = document.createElement("div");
+  c.style.position = "absolute", c.style.width = "15px", c.style.height = "1px", c.style.backgroundColor = t, c.style.top = "0", c.style.right = "0";
   const y = document.createElement("div");
-  y.style.position = "absolute", y.style.width = "1px", y.style.height = "15px", y.style.backgroundColor = t, y.style.bottom = "0", y.style.left = "0", e.appendChild(g), e.appendChild(y);
+  y.style.position = "absolute", y.style.width = "1px", y.style.height = "15px", y.style.backgroundColor = t, y.style.top = "0", y.style.right = "0", e.appendChild(c), e.appendChild(y);
+  const r = document.createElement("div");
+  r.style.position = "fixed", r.style.pointerEvents = "none", r.style.zIndex = "9999", r.style.top = `${i.top + i.height - 15 + 1}px`, r.style.left = `${i.left - 1}px`, r.style.width = "15px", r.style.height = "15px";
+  const d = document.createElement("div");
+  d.style.position = "absolute", d.style.width = "15px", d.style.height = "1px", d.style.backgroundColor = t, d.style.bottom = "0", d.style.left = "0";
   const h = document.createElement("div");
-  h.style.position = "fixed", h.style.pointerEvents = "none", h.style.zIndex = "9999", h.style.top = `${n.top + n.height - 15 + 1}px`, h.style.left = `${n.left + n.width - 15 + 1}px`, h.style.width = "15px", h.style.height = "15px";
-  const p = document.createElement("div");
-  p.style.position = "absolute", p.style.width = "15px", p.style.height = "1px", p.style.backgroundColor = t, p.style.bottom = "0", p.style.right = "0";
+  h.style.position = "absolute", h.style.width = "1px", h.style.height = "15px", h.style.backgroundColor = t, h.style.bottom = "0", h.style.left = "0", r.appendChild(d), r.appendChild(h);
   const u = document.createElement("div");
-  return u.style.position = "absolute", u.style.width = "1px", u.style.height = "15px", u.style.backgroundColor = t, u.style.bottom = "0", u.style.right = "0", h.appendChild(p), h.appendChild(u), {
+  u.style.position = "fixed", u.style.pointerEvents = "none", u.style.zIndex = "9999", u.style.top = `${i.top + i.height - 15 + 1}px`, u.style.left = `${i.left + i.width - 15 + 1}px`, u.style.width = "15px", u.style.height = "15px";
+  const g = document.createElement("div");
+  g.style.position = "absolute", g.style.width = "15px", g.style.height = "1px", g.style.backgroundColor = t, g.style.bottom = "0", g.style.right = "0";
+  const p = document.createElement("div");
+  return p.style.position = "absolute", p.style.width = "1px", p.style.height = "15px", p.style.backgroundColor = t, p.style.bottom = "0", p.style.right = "0", u.appendChild(g), u.appendChild(p), {
     topLeft: a,
-    topRight: r,
-    bottomLeft: e,
-    bottomRight: h,
+    topRight: e,
+    bottomLeft: r,
+    bottomRight: u,
     *[Symbol.iterator]() {
-      yield a, yield r, yield e, yield h;
+      yield a, yield e, yield r, yield u;
     }
   };
 }
-function k(t) {
-  const n = x(document.body, t.positionedParent);
+function _(t) {
+  const i = x(document.body, t.positionedParent);
   return {
     top: t.scroll.y,
     left: 0,
-    width: n.width,
-    height: window.innerHeight - n.top
+    width: i.width,
+    height: window.innerHeight - i.top
   };
 }
-function _(t, n) {
-  const i = n.left + n.width / 2, d = n.top + n.height / 2;
-  t.style.transformOrigin = `${i}px ${d}px`;
+function I(t, i) {
+  const o = i.left + i.width / 2, l = i.top + i.height / 2;
+  t.style.transformOrigin = `${o}px ${l}px`;
 }
-function I(t, n) {
+function Y(t, i) {
   t.style.clipPath = `polygon(
-    ${n.left}px ${n.top}px,
-    ${n.left + n.width}px ${n.top}px,
-    ${n.left + n.width}px ${n.top + n.height}px,
-    ${n.left}px ${n.top + n.height}px
+    ${i.left}px ${i.top}px,
+    ${i.left + i.width}px ${i.top}px,
+    ${i.left + i.width}px ${i.top + i.height}px,
+    ${i.left}px ${i.top + i.height}px
   )`;
 }
-function lt(t, n) {
-  t.style.transform = `translateY(${-n.top}px)`;
+function mt(t, i) {
+  t.style.transform = `translateY(${-i.top}px)`;
 }
-function ot(t, n) {
-  return t.querySelector(`[data-hero-key="${n}"]`);
+const Ct = {
+  spring: { stiffness: 300, damping: 30 }
+};
+function Ot(t, i) {
+  return t.querySelector(`[data-hero-key="${i}"]`);
 }
-const vt = (t = {}) => {
-  var l, r;
-  const n = {
-    stiffness: ((l = t.spring) == null ? void 0 : l.stiffness) ?? 300,
-    damping: ((r = t.spring) == null ? void 0 : r.damping) ?? 30
-  }, i = t.timeout ?? 300, d = t.maxDistance ?? 700;
+const Qt = (t = {}) => {
+  const i = t.physics ?? Ct, o = t.timeout ?? 300, l = t.maxDistance ?? 700;
   let a = null, s = null;
   return {
-    in: async (o, c) => {
-      const e = o, g = Array.from(e.querySelectorAll("[data-hero-key]"));
-      if (g.length === 0)
+    in: async (n, e) => {
+      const c = n, y = Array.from(c.querySelectorAll("[data-hero-key]"));
+      if (y.length === 0)
         return {
-          spring: n,
+          physics: i,
           tick: () => {
           }
           // No hero elements, skip animation
         };
-      if (!await new Promise((p) => {
-        a ? p(!0) : (s = p, setTimeout(() => {
-          s = null, p(!1);
-        }, i));
+      if (!await new Promise((h) => {
+        a ? h(!0) : (s = h, setTimeout(() => {
+          s = null, h(!1);
+        }, o));
       }) || !a)
         return a = null, {
-          spring: n,
+          physics: i,
           tick: () => {
           }
           // No fromNode, skip animation
         };
-      const h = g.map((p) => {
-        const u = p.getAttribute("data-hero-key");
+      const d = y.map((h) => {
+        const u = h.getAttribute("data-hero-key");
         if (!u) return null;
-        const m = ot(a, u);
-        if (!m) return null;
-        const f = p, w = x(a, m), $ = x(e, f), Y = w.left - $.left - c.scrollOffset.x, U = w.top - $.top - c.scrollOffset.y, V = w.width / $.width, W = w.height / $.height, z = f.style.transform, X = f.style.position, M = f.style.transformOrigin, B = f.style.zIndex, H = f.style.willChange;
+        const g = Ot(a, u);
+        if (!g) return null;
+        const p = h, w = x(a, g), f = x(c, p), b = w.left - f.left - e.scrollOffset.x, m = w.top - f.top - e.scrollOffset.y, H = w.width / f.width, X = w.height / f.height, z = p.style.transform, M = p.style.position, W = p.style.transformOrigin, B = p.style.zIndex, q = p.style.willChange;
         return {
-          toEl: f,
-          dx: Y,
-          dy: U,
-          dw: V,
-          dh: W,
+          toEl: p,
+          dx: b,
+          dy: m,
+          dw: H,
+          dh: X,
           originalTransform: z,
-          originalPosition: X,
-          originalTransformOrigin: M,
+          originalPosition: M,
+          originalTransformOrigin: W,
           originalZIndex: B,
-          originalWillChange: H
+          originalWillChange: q
         };
       }).filter(
-        (p) => p !== null && Math.abs(p.dy) <= d
+        (h) => h !== null && Math.abs(h.dy) <= l
       );
-      return a = null, h.length === 0 ? {
-        spring: n,
+      return a = null, d.length === 0 ? {
+        physics: i,
         tick: () => {
         }
         // No matching hero elements
       } : {
-        springs: h.map(({ toEl: p, dx: u, dy: m, dw: f, dh: w }) => ({
-          spring: n,
-          tick: ($) => {
-            p.style.transform = `translate(${(1 - $) * u}px, ${(1 - $) * m}px) scale(${$ + (1 - $) * f}, ${$ + (1 - $) * w})`;
+        springs: d.map(({ toEl: h, dx: u, dy: g, dw: p, dh: w }) => ({
+          physics: i,
+          tick: (f) => {
+            h.style.transform = `translate(${(1 - f) * u}px, ${(1 - f) * g}px) scale(${f + (1 - f) * p}, ${f + (1 - f) * w})`;
           }
         })),
         schedule: "parallel",
         prepare: () => {
-          h.forEach(({ toEl: p }) => {
-            p.style.position = "relative", p.style.transformOrigin = "top left", p.style.zIndex = "1000", p.style.willChange = "transform";
+          d.forEach(({ toEl: h }) => {
+            h.style.position = "relative", h.style.transformOrigin = "top left", h.style.zIndex = "1000", h.style.willChange = "transform";
           });
         },
         onEnd: () => {
-          h.forEach(
+          d.forEach(
             ({
-              toEl: p,
+              toEl: h,
               originalTransform: u,
-              originalPosition: m,
-              originalTransformOrigin: f,
+              originalPosition: g,
+              originalTransformOrigin: p,
               originalZIndex: w,
-              originalWillChange: $
+              originalWillChange: f
             }) => {
-              p.style.transform = u, p.style.position = m, p.style.transformOrigin = f, p.style.zIndex = w, p.style.willChange = $;
+              h.style.transform = u, h.style.position = g, h.style.transformOrigin = p, h.style.zIndex = w, h.style.willChange = f;
             }
           );
         }
       };
     },
-    out: async (o) => ({
-      spring: n,
+    out: async (n) => ({
+      physics: i,
       onStart: () => {
-        a = o, s && (s(!0), s = null);
+        a = n, s && (s(!0), s = null);
       },
       tick: () => {
       },
-      prepare: (c) => {
-        b(c), c.style.opacity = "0";
+      prepare: (e) => {
+        $(e), e.style.opacity = "0";
       }
     })
   };
+}, At = {
+  spring: { stiffness: 140, damping: 19, doubleSpring: 0.8 }
 };
-function ct({
+function St({
   detailRect: t,
-  galleryRect: n,
-  pageRect: i,
-  scrollOffset: d
+  galleryRect: i,
+  pageRect: o,
+  scrollOffset: l
 }) {
-  const a = n.left - t.left + (n.width - t.width) / 2 - d.x, s = n.top - t.top + (n.height - t.height) / 2 - d.y, l = n.width / t.width, r = n.height / t.height, o = Math.max(l, r), c = t.top / i.height * 100, e = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, y = t.left / i.width * 100;
+  const a = i.left - t.left + (i.width - t.width) / 2 - l.x, s = i.top - t.top + (i.height - t.height) / 2 - l.y, n = i.width / t.width, e = i.height / t.height, c = Math.max(n, e), y = t.top / o.height * 100, r = (o.width - (t.left + t.width)) / o.width * 100, d = (o.height - (t.top + t.height)) / o.height * 100, h = t.left / o.width * 100;
   return {
     transformOrigin: `${t.left + t.width / 2}px ${t.top + t.height / 2}px`,
-    animate: (p) => {
-      const u = 1 - p;
+    animate: (g) => {
+      const p = 1 - g;
       return {
-        clipPath: `inset(${c * u}% ${e * u}% ${g * u}% ${y * u}%)`,
-        transform: `translate(${a * u}px, ${s * u}px) scale(${1 + (o - 1) * u})`
+        clipPath: `inset(${y * p}% ${r * p}% ${d * p}% ${h * p}%)`,
+        transform: `translate(${a * p}px, ${s * p}px) scale(${1 + (c - 1) * p})`
       };
     }
   };
 }
-function dt({
+function Tt({
   detailRect: t,
-  galleryRect: n,
-  pageRect: i,
-  scrollOffset: d
+  galleryRect: i,
+  pageRect: o,
+  scrollOffset: l
 }) {
-  const a = n.left - t.left + (n.width - t.width) / 2 + d.x, s = n.top - t.top + (n.height - t.height) / 2 + d.y, l = n.width / t.width, r = n.height / t.height, o = Math.min(l, r), c = t.top / i.height * 100, e = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, y = t.left / i.width * 100;
+  const a = i.left - t.left + (i.width - t.width) / 2 + l.x, s = i.top - t.top + (i.height - t.height) / 2 + l.y, n = i.width / t.width, e = i.height / t.height, c = Math.min(n, e), y = t.top / o.height * 100, r = (o.width - (t.left + t.width)) / o.width * 100, d = (o.height - (t.top + t.height)) / o.height * 100, h = t.left / o.width * 100;
   return {
     transformOrigin: `${t.left + t.width / 2}px ${t.top + t.height / 2}px`,
-    animate: (p) => {
-      const u = 1 - p;
+    animate: (g) => {
+      const p = 1 - g;
       return {
-        clipPath: `inset(${c * u}% ${e * u}% ${g * u}% ${y * u}%)`,
-        transform: `translate(${a * u - d.x}px, ${s * u - d.y}px) scale(${1 + (o - 1) * u})`
+        clipPath: `inset(${y * p}% ${r * p}% ${d * p}% ${h * p}%)`,
+        transform: `translate(${a * p - l.x}px, ${s * p - l.y}px) scale(${1 + (c - 1) * p})`
       };
     }
   };
 }
-function pt(t, n, i) {
-  const d = t.querySelector(
+function kt(t, i, o) {
+  const l = t.querySelector(
     "[data-instagram-detail-key]"
-  ), a = n.querySelector(
+  ), a = i.querySelector(
     "[data-instagram-detail-key]"
   );
-  if (t.querySelectorAll("[data-instagram-detail-key]").length > 1 || n.querySelectorAll("[data-instagram-detail-key]").length > 1)
+  if (t.querySelectorAll("[data-instagram-detail-key]").length > 1 || i.querySelectorAll("[data-instagram-detail-key]").length > 1)
     return null;
-  let s = null, l = null, r = !1;
-  if (!d && a) {
-    l = a;
-    const e = l.getAttribute("data-instagram-detail-key");
-    if (!e) return null;
+  let s = null, n = null, e = !1;
+  if (!l && a) {
+    n = a;
+    const r = n.getAttribute("data-instagram-detail-key");
+    if (!r) return null;
     s = t.querySelector(
-      `[data-instagram-gallery-key="${e}"]`
-    ), s && (r = !0);
-  } else if (d && !a) {
-    l = d;
-    const e = l.getAttribute("data-instagram-detail-key");
-    if (!e) return null;
-    s = n.querySelector(
-      `[data-instagram-gallery-key="${e}"]`
-    ), s && (r = !1);
+      `[data-instagram-gallery-key="${r}"]`
+    ), s && (e = !0);
+  } else if (l && !a) {
+    n = l;
+    const r = n.getAttribute("data-instagram-detail-key");
+    if (!r) return null;
+    s = i.querySelector(
+      `[data-instagram-gallery-key="${r}"]`
+    ), s && (e = !1);
   }
-  if (!s || !l)
+  if (!s || !n)
     return null;
-  const o = x(r ? t : n, s), c = x(r ? n : t, l);
-  if (r) {
-    const e = ct({
-      detailRect: c,
-      galleryRect: o,
-      pageRect: n.getBoundingClientRect(),
-      scrollOffset: i
+  const c = x(e ? t : i, s), y = x(e ? i : t, n);
+  if (e) {
+    const r = St({
+      detailRect: y,
+      galleryRect: c,
+      pageRect: i.getBoundingClientRect(),
+      scrollOffset: o
     });
-    return n.style.transformOrigin = e.transformOrigin, {
+    return i.style.transformOrigin = r.transformOrigin, {
       isEnterMode: !0,
-      inAnimation: e.animate
+      inAnimation: r.animate
       // No outAnimation - gallery stays visible
     };
   } else {
-    const e = dt({
-      detailRect: c,
-      galleryRect: o,
+    const r = Tt({
+      detailRect: y,
+      galleryRect: c,
       pageRect: t.getBoundingClientRect(),
-      scrollOffset: i
+      scrollOffset: o
     });
-    return t.style.transformOrigin = e.transformOrigin, {
+    return t.style.transformOrigin = r.transformOrigin, {
       isEnterMode: !1,
-      outAnimation: e.animate
+      outAnimation: r.animate
       // No inAnimation - gallery stays visible
     };
   }
 }
-const Ft = (t = {}) => {
-  var r, o, c;
-  const n = {
-    stiffness: ((r = t.spring) == null ? void 0 : r.stiffness) ?? 150,
-    damping: ((o = t.spring) == null ? void 0 : o.damping) ?? 20,
-    doubleSpring: ((c = t.spring) == null ? void 0 : c.doubleSpring) ?? !0
-  }, i = t.timeout ?? 300;
-  let d = null, a = null, s = null, l = null;
+const Rt = (t = {}) => {
+  const i = t.physics ?? At, o = t.timeout ?? 300;
+  let l = null, a = null, s = null, n = null;
   return {
-    in: async (e, { scrollOffset: g }) => {
+    in: async (e, { scrollOffset: c }) => {
       const y = e;
-      return !await new Promise((p) => {
-        d ? p(!0) : (a = p, setTimeout(() => {
-          a = null, p(!1);
-        }, i));
-      }) || !d ? (l == null || l(), l = null, d = null, {
-        spring: n,
+      return !await new Promise((d) => {
+        l ? d(!0) : (a = d, setTimeout(() => {
+          a = null, d(!1);
+        }, o));
+      }) || !l ? (n == null || n(), n = null, l = null, {
+        physics: i,
         css: () => ({})
-      }) : (s = pt(d, y, g), l == null || l(), l = null, s ? (d = null, {
-        spring: n,
-        css: (p) => s != null && s.inAnimation ? s.inAnimation(p) : {}
-      }) : (d = null, {
-        spring: n,
+      }) : (s = kt(l, y, c), n == null || n(), n = null, s ? (l = null, {
+        physics: i,
+        css: (d) => s != null && s.inAnimation ? s.inAnimation(d) : {}
+      }) : (l = null, {
+        physics: i,
         css: () => ({})
       }));
     },
-    out: async (e, g) => {
-      const y = new Promise((h) => {
-        l = h;
+    out: async (e, c) => {
+      const y = new Promise((r) => {
+        n = r;
       });
       return {
-        spring: n,
-        prepare: (h) => {
-          s != null && s.isEnterMode ? b(h) : (b(h, g), h.style.zIndex = "-1");
+        physics: i,
+        prepare: (r) => {
+          s != null && s.isEnterMode ? $(r) : ($(r, c), r.style.zIndex = "-1");
         },
         wait: async () => {
-          d = e, a && (a(!0), a = null), await y;
+          l = e, a && (a(!0), a = null), await y;
         },
-        css: (h) => s != null && s.outAnimation ? s.outAnimation(h) : {}
+        css: (r) => s != null && s.outAnimation ? s.outAnimation(r) : {}
       };
     }
   };
+}, Pt = {
+  spring: { stiffness: 50, damping: 30 }
 };
-function ht({
+function Lt(t) {
+  const i = x(document.body, t.positionedParent);
+  return {
+    top: t.scroll.y,
+    left: 0,
+    width: i.width,
+    height: window.innerHeight - i.top
+  };
+}
+const ts = (t = {}) => {
+  const i = t.physics ?? Pt, o = t.initialRotation ?? 45, l = t.initialScale ?? 0.01, a = t.rotationTriggerPoint ?? 0.8;
+  return {
+    out: async (s, n) => {
+      const e = s.style.opacity;
+      return {
+        physics: {
+          spring: {
+            stiffness: 80,
+            damping: 25
+          }
+        },
+        from: 1,
+        to: 0,
+        prepare: () => {
+          $(s, n), s.style.opacity = "1";
+        },
+        tick: (c) => {
+          s.style.opacity = String(c);
+        },
+        onEnd: () => {
+          s.style.opacity = e;
+        }
+      };
+    },
+    in: async (s, n) => {
+      const e = Lt(n), c = s.style.transform, y = s.style.transformOrigin, r = s.style.position, d = s.style.zIndex;
+      return {
+        physics: i,
+        from: 0,
+        to: 1,
+        prepare: () => {
+          const h = Math.min(e.width, e.height) * 0.4;
+          s.style.setProperty(
+            "--max-border-radius",
+            `${h}px`
+          ), s.style.setProperty("--border-radius-scale", "1"), s.style.willChange = "transform", s.style.backfaceVisibility = "hidden";
+          const u = e.left + e.width / 2, g = e.top + e.height / 2;
+          s.style.transformOrigin = `${u}px ${g}px`, s.style.position = "fixed", s.style.top = `${e.top}px`, s.style.left = `${e.left}px`, s.style.width = `${e.width}px`, s.style.height = `${e.height}px`, s.style.zIndex = "1000", s.style.overflow = "hidden", s.style.transform = `rotate(${o}deg) scale(${l}) translateZ(0)`, s.style.borderRadius = "calc(var(--max-border-radius) * var(--border-radius-scale))", s.style.opacity = "1";
+        },
+        tick: (h) => {
+          let u;
+          if (h <= 0.05)
+            u = l;
+          else if (h <= a) {
+            const f = (h - 0.05) / (a - 0.05), b = Math.pow(f, 9);
+            u = l + (0.8 - l) * b;
+          } else {
+            const f = (h - a) / (1 - a);
+            u = 0.8 + 0.2 * (1 - Math.pow(1 - f, 3));
+          }
+          let g;
+          const p = 0.7;
+          if (h <= p)
+            g = o;
+          else {
+            const f = (h - p) / (1 - p), b = 1 - Math.pow(1 - f, 2);
+            g = o * (1 - b);
+          }
+          let w;
+          if (h <= p)
+            w = 1;
+          else {
+            const f = (h - p) / (1 - p);
+            w = 1 - Math.pow(f, 0.5);
+          }
+          s.style.transform = `rotate(${g.toFixed(2)}deg) scale(${u.toFixed(4)}) translateZ(0)`, s.style.setProperty(
+            "--border-radius-scale",
+            w.toFixed(4)
+          );
+        },
+        onEnd: () => {
+          s.style.willChange = "", s.style.backfaceVisibility = "", s.style.removeProperty("--max-border-radius"), s.style.removeProperty("--border-radius-scale"), s.style.transform = c, s.style.transformOrigin = y, s.style.position = r, s.style.zIndex = d, s.style.top = "", s.style.left = "", s.style.width = "", s.style.height = "", s.style.overflow = "", s.style.borderRadius = "";
+        }
+      };
+    }
+  };
+}, vt = {
+  spring: { stiffness: 140, damping: 19, doubleSpring: 0.7 }
+};
+function _t({
   detailRect: t,
-  galleryRect: n,
-  pageRect: i,
-  scrollOffset: d
+  galleryRect: i,
+  pageRect: o,
+  scrollOffset: l
 }) {
-  const a = n.left - t.left + (n.width - t.width) / 2 - d.x, s = n.top - t.top + (n.height - t.height) / 2 - d.y, l = n.width / t.width, r = n.height / t.height, o = Math.max(l, r), c = t.top / i.height * 100, e = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, y = t.left / i.width * 100;
+  const a = i.left - t.left + (i.width - t.width) / 2 - l.x, s = i.top - t.top + (i.height - t.height) / 2 - l.y, n = i.width / t.width, e = i.height / t.height, c = Math.max(n, e), y = t.top / o.height * 100, r = (o.width - (t.left + t.width)) / o.width * 100, d = (o.height - (t.top + t.height)) / o.height * 100, h = t.left / o.width * 100;
   return {
     transformOrigin: `${t.left + t.width / 2}px ${t.top + t.height / 2}px`,
-    animate: (p) => {
-      const u = 1 - p;
+    animate: (g) => {
+      const p = 1 - g;
       return {
-        clipPath: `inset(${c * u}% ${e * u}% ${g * u}% ${y * u}%)`,
-        transform: `translate(${a * u}px, ${s * u}px) scale(${1 + (o - 1) * u})`
+        clipPath: `inset(${y * p}% ${r * p}% ${d * p}% ${h * p}%)`,
+        transform: `translate(${a * p}px, ${s * p}px) scale(${1 + (c - 1) * p})`
       };
     }
   };
 }
-function yt({
+function It({
   galleryRect: t,
-  detailRect: n,
-  scrollOffset: i
+  detailRect: i,
+  scrollOffset: o
 }) {
-  const d = n.left - t.left + (n.width - t.width) / 2 + i.x, a = n.top - t.top + (n.height - t.height) / 2 + i.y, s = n.width / t.width, l = n.height / t.height, r = Math.max(s, l);
+  const l = i.left - t.left + (i.width - t.width) / 2 + o.x, a = i.top - t.top + (i.height - t.height) / 2 + o.y, s = i.width / t.width, n = i.height / t.height, e = Math.max(s, n);
   return {
     transformOrigin: `${t.left + t.width / 2}px ${t.top + t.height / 2}px`,
-    animate: (c) => {
-      const e = 1 - c;
+    animate: (y) => {
+      const r = 1 - y;
       return {
-        transform: `translate(${d * e - i.x}px, ${a * e - i.y}px) scale(${1 + (r - 1) * e})`,
-        opacity: `${1 - e}`
+        transform: `translate(${l * r - o.x}px, ${a * r - o.y}px) scale(${1 + (e - 1) * r})`,
+        opacity: `${1 - r}`
       };
     }
   };
 }
-function gt({
+function Yt({
   galleryRect: t,
-  detailRect: n,
-  scrollOffset: i
+  detailRect: i,
+  scrollOffset: o
 }) {
-  const d = n.left - t.left + (n.width - t.width) / 2 - i.x, a = n.top - t.top + (n.height - t.height) / 2 - i.y, s = n.width / t.width, l = n.height / t.height, r = Math.max(s, l);
+  const l = i.left - t.left + (i.width - t.width) / 2 - o.x, a = i.top - t.top + (i.height - t.height) / 2 - o.y, s = i.width / t.width, n = i.height / t.height, e = Math.max(s, n);
   return {
     transformOrigin: `${t.left + t.width / 2}px ${t.top + t.height / 2}px`,
-    animate: (c) => {
-      const e = 1 - c, g = c;
+    animate: (y) => {
+      const r = 1 - y, d = y;
       return {
-        transform: `translate(${d * e}px, ${a * e}px) scale(${1 + (r - 1) * e})`,
-        opacity: `${g}`
+        transform: `translate(${l * r}px, ${a * r}px) scale(${1 + (e - 1) * r})`,
+        opacity: `${d}`
       };
     }
   };
 }
-function ut({
+function Ft({
   detailRect: t,
-  galleryRect: n,
-  pageRect: i,
-  scrollOffset: d
+  galleryRect: i,
+  pageRect: o,
+  scrollOffset: l
 }) {
-  const a = n.left - t.left + (n.width - t.width) / 2 + d.x, s = n.top - t.top + (n.height - t.height) / 2 + d.y, l = n.width / t.width, r = n.height / t.height, o = Math.min(l, r), c = t.top / i.height * 100, e = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, y = t.left / i.width * 100;
+  const a = i.left - t.left + (i.width - t.width) / 2 + l.x, s = i.top - t.top + (i.height - t.height) / 2 + l.y, n = i.width / t.width, e = i.height / t.height, c = Math.min(n, e), y = t.top / o.height * 100, r = (o.width - (t.left + t.width)) / o.width * 100, d = (o.height - (t.top + t.height)) / o.height * 100, h = t.left / o.width * 100;
   return {
     transformOrigin: `${t.left + t.width / 2}px ${t.top + t.height / 2}px`,
-    animate: (p) => {
-      const u = 1 - p;
+    animate: (g) => {
+      const p = 1 - g;
       return {
-        clipPath: `inset(${c * u}% ${e * u}% ${g * u}% ${y * u}%)`,
-        transform: `translate(${a * u - d.x}px, ${s * u - d.y}px) scale(${1 + (o - 1) * u})`
+        clipPath: `inset(${y * p}% ${r * p}% ${d * p}% ${h * p}%)`,
+        transform: `translate(${a * p - l.x}px, ${s * p - l.y}px) scale(${1 + (c - 1) * p})`
       };
     }
   };
 }
-function ft(t, n, i) {
-  const d = t.querySelector(
+function Dt(t, i, o) {
+  const l = t.querySelector(
     "[data-pinterest-detail-key]"
-  ), a = n.querySelector(
+  ), a = i.querySelector(
     "[data-pinterest-detail-key]"
   );
-  if (t.querySelectorAll("[data-pinterest-detail-key]").length > 1 || n.querySelectorAll("[data-pinterest-detail-key]").length > 1)
+  if (t.querySelectorAll("[data-pinterest-detail-key]").length > 1 || i.querySelectorAll("[data-pinterest-detail-key]").length > 1)
     return null;
-  let s = null, l = null, r = !1;
-  if (!d && a) {
-    l = a;
-    const e = l.getAttribute("data-pinterest-detail-key");
-    if (!e) return null;
+  let s = null, n = null, e = !1;
+  if (!l && a) {
+    n = a;
+    const r = n.getAttribute("data-pinterest-detail-key");
+    if (!r) return null;
     s = t.querySelector(
-      `[data-pinterest-gallery-key="${e}"]`
-    ), s && (r = !0);
-  } else if (d && !a) {
-    l = d;
-    const e = l.getAttribute("data-pinterest-detail-key");
-    if (!e) return null;
-    s = n.querySelector(
-      `[data-pinterest-gallery-key="${e}"]`
-    ), s && (r = !1);
+      `[data-pinterest-gallery-key="${r}"]`
+    ), s && (e = !0);
+  } else if (l && !a) {
+    n = l;
+    const r = n.getAttribute("data-pinterest-detail-key");
+    if (!r) return null;
+    s = i.querySelector(
+      `[data-pinterest-gallery-key="${r}"]`
+    ), s && (e = !1);
   }
-  if (!s || !l)
+  if (!s || !n)
     return null;
-  const o = x(r ? t : n, s), c = x(r ? n : t, l);
-  if (r) {
-    const e = ht({
-      detailRect: c,
-      galleryRect: o,
-      pageRect: n.getBoundingClientRect(),
-      scrollOffset: i
-    }), g = yt({
-      galleryRect: o,
-      detailRect: c,
-      scrollOffset: i
+  const c = x(e ? t : i, s), y = x(e ? i : t, n);
+  if (e) {
+    const r = _t({
+      detailRect: y,
+      galleryRect: c,
+      pageRect: i.getBoundingClientRect(),
+      scrollOffset: o
+    }), d = It({
+      galleryRect: c,
+      detailRect: y,
+      scrollOffset: o
     });
-    return n.style.transformOrigin = e.transformOrigin, t.style.transformOrigin = g.transformOrigin, {
-      inAnimation: e.animate,
-      outAnimation: g.animate
+    return i.style.transformOrigin = r.transformOrigin, t.style.transformOrigin = d.transformOrigin, {
+      inAnimation: r.animate,
+      outAnimation: d.animate
     };
   } else {
-    const e = gt({
-      galleryRect: o,
-      detailRect: c,
-      scrollOffset: i
-    }), g = ut({
-      detailRect: c,
-      galleryRect: o,
+    const r = Yt({
+      galleryRect: c,
+      detailRect: y,
+      scrollOffset: o
+    }), d = Ft({
+      detailRect: y,
+      galleryRect: c,
       pageRect: t.getBoundingClientRect(),
-      scrollOffset: i
+      scrollOffset: o
     });
-    return n.style.transformOrigin = e.transformOrigin, t.style.transformOrigin = g.transformOrigin, {
-      inAnimation: e.animate,
-      outAnimation: g.animate
+    return i.style.transformOrigin = r.transformOrigin, t.style.transformOrigin = d.transformOrigin, {
+      inAnimation: r.animate,
+      outAnimation: d.animate
     };
   }
 }
-const Yt = (t = {}) => {
-  var r, o, c;
-  const n = {
-    stiffness: ((r = t.spring) == null ? void 0 : r.stiffness) ?? 30,
-    damping: ((o = t.spring) == null ? void 0 : o.damping) ?? 10,
-    doubleSpring: ((c = t.spring) == null ? void 0 : c.doubleSpring) ?? !0
-  }, i = t.timeout ?? 300;
-  let d = null, a = null, s = null, l = null;
+const ss = (t = {}) => {
+  const i = t.physics ?? vt, o = t.timeout ?? 300;
+  let l = null, a = null, s = null, n = null;
   return {
-    in: async (e, { scrollOffset: g }) => {
+    in: async (e, { scrollOffset: c }) => {
       const y = e;
-      return !await new Promise((p) => {
-        d ? p(!0) : (a = p, setTimeout(() => {
-          a = null, p(!1);
-        }, i));
-      }) || !d ? (l == null || l(), l = null, d = null, {
-        spring: n,
+      return !await new Promise((d) => {
+        l ? d(!0) : (a = d, setTimeout(() => {
+          a = null, d(!1);
+        }, o));
+      }) || !l ? (n == null || n(), n = null, l = null, {
+        physics: i,
         css: () => ({})
-      }) : (s = ft(d, y, g), l == null || l(), l = null, s ? (d = null, {
-        spring: n,
-        css: (p) => s ? s.inAnimation(p) : {}
-      }) : (d = null, {
-        spring: n,
+      }) : (s = Dt(l, y, c), n == null || n(), n = null, s ? (l = null, {
+        physics: i,
+        css: (d) => s ? s.inAnimation(d) : {}
+      }) : (l = null, {
+        physics: i,
         css: () => ({})
       }));
     },
     out: async (e) => {
-      const g = new Promise((y) => {
-        l = y;
+      const c = new Promise((y) => {
+        n = y;
       });
       return {
-        spring: n,
+        physics: i,
         prepare: (y) => {
-          b(y), y.style.zIndex = "-1";
+          $(y), y.style.zIndex = "-1";
         },
         wait: async () => {
-          d = e, a && (a(!0), a = null), await g;
+          l = e, a && (a(!0), a = null), await c;
         },
         css: (y) => s ? s.outAnimation(y) : {}
       };
     }
   };
-}, O = { stiffness: 100, damping: 30 }, Ut = () => ({
-  in: (t) => ({
-    spring: O,
-    prepare: () => {
-      t.style.opacity = "0", t.style.transform = "rotate(-180deg)", t.style.transformOrigin = "center center", t.style.willChange = "transform, opacity";
-    },
-    css: (n) => ({
-      // -180deg → 0deg, show after 90deg (progress > 0.5)
-      transform: `rotate(${(n - 1) * 180}deg)`,
-      opacity: n > 0.5 ? 1 : 0
-    }),
-    onEnd: () => {
-      t.style.willChange = "auto", t.style.transform = "", t.style.transformOrigin = "", t.style.opacity = "";
-    }
-  }),
-  out: (t, n) => ({
-    spring: O,
-    prepare: () => {
-      b(t, n), t.style.transformOrigin = "center center", t.style.willChange = "transform, opacity";
-    },
-    css: (i) => ({
-      // 0deg → 180deg, hide after 90deg (progress < 0.5)
-      transform: `rotate(${(1 - i) * 180}deg)`,
-      opacity: i > 0.5 ? 1 : 0
+}, Ut = {
+  spring: { stiffness: 100, damping: 30 }
+}, ns = (t = {}) => {
+  const i = t.physics ?? Ut;
+  return {
+    in: (o) => ({
+      physics: i,
+      prepare: () => {
+        o.style.opacity = "0", o.style.transform = "rotate(-180deg)", o.style.transformOrigin = "center center", o.style.willChange = "transform, opacity";
+      },
+      css: (l) => ({
+        // -180deg → 0deg, show after 90deg (progress > 0.5)
+        transform: `rotate(${(l - 1) * 180}deg)`,
+        opacity: l > 0.5 ? 1 : 0
+      }),
+      onEnd: () => {
+        o.style.willChange = "auto", o.style.transform = "", o.style.transformOrigin = "", o.style.opacity = "";
+      }
     }),
-    onEnd: () => {
-      t.style.willChange = "auto";
-    }
-  })
-}), D = {
-  stiffness: 5,
-  damping: 4
-}, Vt = (t = {}) => {
-  var o, c;
-  const n = t.direction ?? "up", i = {
-    stiffness: ((o = t.spring) == null ? void 0 : o.stiffness) ?? D.stiffness,
-    damping: ((c = t.spring) == null ? void 0 : c.damping) ?? D.damping
-  }, d = n === "up";
-  let a = null, s = null, l = null;
-  const r = () => {
+    out: (o, l) => ({
+      physics: i,
+      prepare: () => {
+        $(o, l), o.style.transformOrigin = "center center", o.style.willChange = "transform, opacity";
+      },
+      css: (a) => ({
+        // 0deg → 180deg, hide after 90deg (progress < 0.5)
+        transform: `rotate(${(1 - a) * 180}deg)`,
+        opacity: a > 0.5 ? 1 : 0
+      }),
+      onEnd: () => {
+        o.style.willChange = "auto";
+      }
+    })
+  };
+}, Vt = {
+  spring: { stiffness: 5, damping: 4 }
+}, is = (t = {}) => {
+  const i = t.direction ?? "up", o = t.physics ?? Vt, l = i === "up";
+  let a = null, s = null, n = null;
+  const e = () => {
     if (a === null || s === null)
       return null;
-    const e = Math.min(a, s), g = window.innerHeight;
-    return Math.max(e, g);
+    const c = Math.min(a, s), y = window.innerHeight;
+    return Math.max(c, y);
   };
   return {
-    in: (e) => (s = e.offsetHeight, a !== null && (l = r()), {
-      spring: i,
+    in: (c) => (s = c.offsetHeight, a !== null && (n = e()), {
+      physics: o,
       prepare: () => {
-        e.style.willChange = "transform", e.style.backfaceVisibility = "hidden", e.style.contain = "layout paint";
+        c.style.willChange = "transform", c.style.backfaceVisibility = "hidden", c.style.contain = "layout paint";
       },
-      tick: (g) => {
-        l === null && (l = r());
-        const y = l ?? window.innerHeight, h = d ? (1 - g) * y : (1 - g) * -y;
-        e.style.transform = `translate3d(0, ${h}px, 0)`;
+      tick: (y) => {
+        n === null && (n = e());
+        const r = n ?? window.innerHeight, d = l ? (1 - y) * r : (1 - y) * -r;
+        c.style.transform = `translate3d(0, ${d}px, 0)`;
       },
       onEnd: () => {
-        e.style.willChange = "auto", e.style.backfaceVisibility = "", e.style.contain = "";
+        c.style.willChange = "auto", c.style.backfaceVisibility = "", c.style.contain = "";
       }
     }),
-    out: (e, g) => ({
-      spring: i,
+    out: (c, y) => ({
+      physics: o,
       onStart: () => {
-        a = e.offsetHeight, s !== null && (l = r());
+        a = c.offsetHeight, s !== null && (n = e());
       },
-      tick: (y) => {
-        l === null && (l = r());
-        const h = l ?? window.innerHeight, p = d ? (1 - y) * -h : (1 - y) * h;
-        e.style.transform = `translate3d(0, ${p}px, 0)`;
+      tick: (r) => {
+        n === null && (n = e());
+        const d = n ?? window.innerHeight, h = l ? (1 - r) * -d : (1 - r) * d;
+        c.style.transform = `translate3d(0, ${h}px, 0)`;
       },
-      prepare: (y) => {
-        b(y, g), y.style.zIndex = d ? "-1" : "1", y.style.willChange = "transform", y.style.backfaceVisibility = "hidden", y.style.contain = "layout paint", y.style.pointerEvents = "none";
+      prepare: (r) => {
+        $(r, y), r.style.zIndex = l ? "-1" : "1", r.style.willChange = "transform", r.style.backfaceVisibility = "hidden", r.style.contain = "layout paint", r.style.pointerEvents = "none";
       }
     })
   };
-}, S = {
-  stiffness: 15,
-  damping: 7,
-  doubleSpring: !0
-}, Wt = (t = {}) => {
-  var a, s, l;
-  const n = t.direction ?? "left", i = {
-    stiffness: ((a = t.spring) == null ? void 0 : a.stiffness) ?? S.stiffness,
-    damping: ((s = t.spring) == null ? void 0 : s.damping) ?? S.damping,
-    doubleSpring: ((l = t.spring) == null ? void 0 : l.doubleSpring) ?? S.doubleSpring
-  }, d = n === "left";
+}, Ht = {
+  inertia: {
+    acceleration: 20,
+    resistance: 1.5
+  }
+}, Xt = {
+  inertia: {
+    acceleration: 20,
+    resistance: 1
+  }
+};
+function T(t) {
+  const i = x(document.body, t.positionedParent), o = t.scroll.y, l = window.innerHeight - i.top;
   return {
-    in: (r) => ({
-      spring: i,
+    top: o,
+    left: 0,
+    width: i.width,
+    height: l
+  };
+}
+const es = (t = {}) => {
+  const { direction: i = "enter" } = t, o = t.physics ?? (i === "enter" ? Ht : Xt);
+  return i === "enter" ? {
+    // Entering sheet: slides up from bottom
+    in: (l, a) => {
+      const n = T(a).height;
+      return {
+        physics: o,
+        prepare: () => {
+          l.style.willChange = "transform", l.style.backfaceVisibility = "hidden", l.style.contain = "layout paint";
+        },
+        css: (e) => ({
+          transform: `translate3d(0, ${(1 - e) * n}px, 0)`
+        }),
+        onEnd: () => {
+          l.style.willChange = "auto", l.style.backfaceVisibility = "", l.style.contain = "";
+        }
+      };
+    },
+    // Exiting background: scales down with fade
+    out: (l, a) => {
+      const s = T(a), n = s.left + s.width / 2, e = s.top + s.height / 2 + a.scrollOffset.y;
+      return {
+        physics: o,
+        prepare: (c) => {
+          $(c, a), c.style.zIndex = "-1", c.style.willChange = "transform, opacity", c.style.backfaceVisibility = "hidden", c.style.contain = "layout paint", c.style.pointerEvents = "none", c.style.transformOrigin = `${n}px ${e}px`;
+        },
+        css: (c) => ({
+          transform: `scale(${0.8 + c * 0.2})`,
+          opacity: c
+        })
+      };
+    }
+  } : {
+    // Entering background: scales up with fade
+    in: (l, a) => {
+      const s = T(a), n = s.left + s.width / 2, e = s.top + s.height / 2;
+      return {
+        physics: o,
+        prepare: () => {
+          l.style.willChange = "transform, opacity", l.style.backfaceVisibility = "hidden", l.style.contain = "layout paint", l.style.transformOrigin = `${n}px ${e}px`;
+        },
+        css: (c) => ({
+          transform: `scale(${0.8 + c * 0.2})`,
+          opacity: c
+        }),
+        onEnd: () => {
+          l.style.willChange = "auto", l.style.backfaceVisibility = "", l.style.contain = "", l.style.transformOrigin = "";
+        }
+      };
+    },
+    // Exiting sheet: slides down with high z-index
+    out: (l, a) => {
+      const n = T(a).height;
+      return {
+        physics: o,
+        prepare: (e) => {
+          $(e, a), e.style.zIndex = "100", e.style.willChange = "transform", e.style.backfaceVisibility = "hidden", e.style.contain = "layout paint", e.style.pointerEvents = "none";
+        },
+        css: (e) => ({
+          transform: `translate3d(0, ${(1 - e) * n}px, 0)`
+        })
+      };
+    }
+  };
+}, zt = {
+  spring: {
+    stiffness: 140,
+    damping: 19,
+    doubleSpring: 0.8
+  }
+}, rs = (t = {}) => {
+  const i = t.direction ?? "left", o = t.physics ?? zt, l = i === "left";
+  return {
+    in: (a) => ({
+      physics: o,
       prepare: () => {
-        r.style.willChange = "transform", r.style.backfaceVisibility = "hidden", r.style.contain = "layout paint";
+        a.style.willChange = "transform", a.style.backfaceVisibility = "hidden", a.style.contain = "layout paint";
       },
-      css: (o) => ({
-        transform: `translate3d(${d ? (1 - o) * 100 : (1 - o) * -100}%, 0, 0)`
+      css: (s) => ({
+        transform: `translate3d(${l ? (1 - s) * 100 : (1 - s) * -100}%, 0, 0)`
       }),
       onEnd: () => {
-        r.style.willChange = "auto", r.style.backfaceVisibility = "", r.style.contain = "";
+        a.style.willChange = "auto", a.style.backfaceVisibility = "", a.style.contain = "";
       }
     }),
-    out: (r, o) => ({
-      spring: i,
-      css: (c) => ({
-        transform: `translate3d(${d ? (1 - c) * -100 : (1 - c) * 100}%, 0, 0)`
+    out: (a, s) => ({
+      physics: o,
+      css: (n) => ({
+        transform: `translate3d(${l ? (1 - n) * -100 : (1 - n) * 100}%, 0, 0)`
       }),
-      prepare: (c) => {
-        b(c, o), c.style.willChange = "transform", c.style.backfaceVisibility = "hidden", c.style.contain = "layout paint", c.style.pointerEvents = "none";
+      prepare: (n) => {
+        $(n, s), n.style.willChange = "transform", n.style.backfaceVisibility = "hidden", n.style.contain = "layout paint", n.style.pointerEvents = "none";
+      }
+    })
+  };
+}, k = 6, F = 0, D = 1, Mt = {
+  inertia: {
+    acceleration: 50,
+    resistance: 1.5
+  }
+}, as = (t = {}) => {
+  const i = t.direction ?? "left", o = t.physics ?? Mt, l = i === "left";
+  let { promise: a, resolve: s } = E();
+  return {
+    // Entering page: fades in + slides from opposite direction
+    in: (n) => ({
+      physics: o,
+      prepare: () => {
+        n.style.opacity = "0", n.style.willChange = "transform, opacity", n.style.backfaceVisibility = "hidden", n.style.contain = "layout paint";
+      },
+      wait: async () => {
+        if (a) {
+          await a;
+          const e = E();
+          a = e.promise, s = e.resolve;
+        }
+      },
+      css: (e) => {
+        const c = l ? (1 - e) * k : (1 - e) * -k, y = D + e * (1 - D);
+        return {
+          transform: `translate3d(${c}px, 0, 0)`,
+          opacity: y
+        };
+      },
+      onEnd: () => {
+        n.style.opacity = "1", n.style.willChange = "auto", n.style.backfaceVisibility = "", n.style.contain = "";
+      }
+    }),
+    // Exiting page: fade out + slide in same direction as navigation
+    out: (n, e) => ({
+      physics: o,
+      prepare: () => {
+        $(n, e), n.style.willChange = "transform, opacity", n.style.backfaceVisibility = "hidden", n.style.contain = "layout paint", n.style.pointerEvents = "none";
+      },
+      css: (c) => {
+        const y = l ? (1 - c) * -k : (1 - c) * k, r = F + c * (1 - F);
+        return {
+          transform: `translate3d(${y}px, 0, 0)`,
+          opacity: r
+        };
+      },
+      onEnd: () => {
+        s && s(), n.style.willChange = "auto", n.style.backfaceVisibility = "", n.style.contain = "";
       }
     })
   };
-}, P = { stiffness: 17, damping: 6 }, L = 20, C = 800, zt = () => {
-  let t, n = null;
+}, Wt = {
+  spring: { stiffness: 17, damping: 6 }
+}, L = 20, P = 800, os = (t = {}) => {
+  const i = t.physics ?? Wt;
+  let o, l = null;
   return {
-    in: (i) => ({
-      spring: P,
+    in: (a) => ({
+      physics: i,
       prepare: () => {
-        i.style.willChange = "transform", i.style.backfaceVisibility = "hidden", i.style.contain = "layout paint", i.style.transform = `perspective(${C}px) rotateY(${L}deg) translate3d(-100%, 0, 0)`;
+        a.style.willChange = "transform", a.style.backfaceVisibility = "hidden", a.style.contain = "layout paint", a.style.transform = `perspective(${P}px) rotateY(${L}deg) translate3d(-100%, 0, 0)`;
       },
       wait: async () => {
-        t && await t;
+        o && await o;
       },
-      css: (d) => {
-        const a = (1 - d) * L, s = -(1 - d) * 100;
+      css: (s) => {
+        const n = (1 - s) * L, e = -(1 - s) * 100;
         return {
-          transform: `perspective(${C}px) rotateY(${a}deg) translate3d(${s}%, 0, 0)`
+          transform: `perspective(${P}px) rotateY(${n}deg) translate3d(${e}%, 0, 0)`
         };
       },
       onEnd: () => {
-        i.style.transform = "", i.style.willChange = "auto", i.style.backfaceVisibility = "", i.style.contain = "";
+        a.style.transform = "", a.style.willChange = "auto", a.style.backfaceVisibility = "", a.style.contain = "";
       }
     }),
-    out: (i, d) => (t = new Promise((a) => {
-      n = a;
+    out: (a, s) => (o = new Promise((n) => {
+      l = n;
     }), {
-      spring: P,
-      prepare: (a) => {
-        b(a, d), a.style.willChange = "transform", a.style.backfaceVisibility = "hidden", a.style.contain = "layout paint", a.style.pointerEvents = "none", a.style.transform = `perspective(${C}px) rotateY(0deg) translate3d(0%, 0, 0)`;
+      physics: i,
+      prepare: (n) => {
+        $(n, s), n.style.willChange = "transform", n.style.backfaceVisibility = "hidden", n.style.contain = "layout paint", n.style.pointerEvents = "none", n.style.transform = `perspective(${P}px) rotateY(0deg) translate3d(0%, 0, 0)`;
       },
-      css: (a) => {
-        const s = 1 - a, l = s * L, r = s * 100;
+      css: (n) => {
+        const e = 1 - n, c = e * L, y = e * 100;
         return {
-          transform: `perspective(${C}px) rotateY(${-l}deg) translate3d(${r}%, 0, 0)`
+          transform: `perspective(${P}px) rotateY(${-c}deg) translate3d(${y}%, 0, 0)`
         };
       },
       onEnd: () => {
-        n && n(), i.style.transform = "";
+        l && l(), a.style.transform = "";
       }
     })
   };
-}, $t = { stiffness: 1, damping: 1 }, mt = { stiffness: 20, damping: 25 }, wt = "#000000", bt = "circle", v = "CURTAIN_REVEAL_OVERLAY_ID", xt = {
-  position: "fixed",
-  inset: "0",
-  width: "100vw",
-  height: "100%",
-  zIndex: "9999",
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  overflow: "hidden"
-}, Et = {
-  position: "relative",
-  display: "inline-block",
-  height: "5.5rem",
-  overflow: "hidden"
-}, Ct = {
-  display: "flex",
-  height: "100%",
-  willChange: "transform",
-  transition: "transform 0.3s ease"
-}, At = {
-  display: "inline-flex",
-  alignItems: "center",
-  justifyContent: "center",
-  whiteSpace: "nowrap",
-  fontSize: "5.5rem",
-  fontWeight: "900",
-  letterSpacing: "0.02em",
-  color: "#FFFFFF"
-}, St = 0.4, A = 0.5, Lt = 0.2;
-function Tt(t, n) {
-  switch (t) {
-    case "circle":
-      return `circle(${n * 100}% at 50% 50%)`;
-    case "square":
-      return `inset(${(1 - n) * 50}% round ${10 * n}%)`;
-    case "triangle": {
-      const i = n * 100;
-      return `polygon(50% ${50 - i}%, ${50 - i}% ${50 + i}%, ${50 + i}% ${50 + i}%)`;
-    }
+}, Bt = {
+  inertia: {
+    acceleration: 50,
+    resistance: 1.5
   }
+}, U = 0.05;
+function qt(t) {
+  const i = x(document.body, t.positionedParent), o = t.scroll.y, l = window.innerHeight - i.top;
+  return {
+    top: o,
+    left: 0,
+    width: i.width,
+    height: l
+  };
 }
-const kt = (t) => t.reduce((n, i) => n + i, 0), Xt = (t = {}) => {
-  const {
-    background: n = wt,
-    texts: i = [],
-    shape: d = bt,
-    inSpring: a = mt,
-    outSpring: s = $t,
-    textStyle: l = {}
-  } = t;
+const ls = (t = {}) => {
+  const i = t.physics ?? Bt;
+  let { promise: o, resolve: l } = E();
   return {
-    out: (r, o) => {
-      const c = r.style.opacity;
+    // Entering page: scales up from small (0.95 → 1) with fade in
+    in: (a, s) => {
+      const n = qt(s), e = n.left + n.width / 2, c = n.top + n.height / 2;
       return {
-        spring: s,
-        from: 1,
-        to: 0,
-        prepare: (e) => {
-          b(e, o), e.style.opacity = "1";
-        },
-        tick: (e) => {
-          const g = Math.max(0, e - St);
-          r.style.opacity = String(g);
-        },
-        onEnd: () => {
-          r.style.opacity = c;
-        }
-      };
-    },
-    in: (r) => {
-      let o = null, c = null, e = null;
-      const g = document.body.style.overflow, y = document.getElementById(
-        v
-      );
-      let h = [];
-      const p = () => {
-        o = document.createElement("div"), o.id = v, Object.assign(o.style, xt, { background: n }), document.body.appendChild(o), c = document.createElement("div"), Object.assign(c.style, Et), o.appendChild(c), e = document.createElement("div"), Object.assign(e.style, Ct), c.appendChild(e), i.forEach((u) => {
-          const m = document.createElement("div");
-          m.textContent = u, Object.assign(m.style, At, l), e.appendChild(m);
-        }), h = Array.from(e.children).map(
-          (u) => u.getBoundingClientRect().width
-        );
-      };
-      return {
-        spring: a,
-        from: 0,
-        to: 1,
+        physics: i,
         prepare: () => {
-          document.body.style.overflow = "hidden", r.style.opacity = "1", y == null || y.remove(), p(), o && c && (o.style.clipPath = "none", c.style.transform = "scale(1)");
+          a.style.opacity = "0", a.style.willChange = "transform, opacity", a.style.backfaceVisibility = "hidden", a.style.contain = "layout paint", a.style.transformOrigin = `${e}px ${c}px`;
         },
-        tick: (u) => {
-          if (!(!o || !c || !e)) {
-            if (u <= A && i.length > 0) {
-              const m = u / A, f = Math.min(
-                Math.floor(m * i.length),
-                i.length - 1
-              ), w = h[f] ?? 0, $ = kt(h.slice(0, f));
-              c.style.width = `${w}px`, e.style.transform = `translateX(-${$}px)`;
-            }
-            if (u > A) {
-              const f = 1 - Math.max(
-                0,
-                Math.min(1, (u - A) / Lt)
-              );
-              o.style.clipPath = Tt(d, f), c.style.transform = `scale(${f})`;
-            }
+        wait: async () => {
+          if (o) {
+            await o;
+            const y = E();
+            o = y.promise, l = y.resolve;
           }
         },
+        css: (y) => ({
+          transform: `scale(${1 - U + y * U})`,
+          opacity: y
+        }),
         onEnd: () => {
-          o == null || o.remove(), o = c = e = null, document.body.style.overflow = g;
+          a.style.opacity = "1", a.style.willChange = "auto", a.style.backfaceVisibility = "", a.style.contain = "", a.style.transformOrigin = "";
         }
       };
-    }
+    },
+    // Exiting page: fade out only (no scale)
+    out: (a, s) => ({
+      physics: i,
+      prepare: (n) => {
+        $(n, s), n.style.willChange = "opacity", n.style.backfaceVisibility = "hidden", n.style.contain = "layout paint", n.style.pointerEvents = "none";
+      },
+      css: (n) => ({
+        opacity: n
+      }),
+      onEnd: () => {
+        l && l();
+      }
+    })
   };
 };
 export {
-  It as blind,
-  Xt as curtainReveal,
-  Ot as drill,
-  Dt as fade,
-  Pt as film,
-  vt as hero,
-  Ft as instagram,
-  Ht as jaemin,
-  Yt as pinterest,
-  Ut as rotate,
-  Vt as scroll,
-  Wt as slide,
-  zt as strip
+  Nt as blind,
+  jt as curtainReveal,
+  Gt as depth,
+  Zt as drill,
+  Jt as fade,
+  Kt as film,
+  Qt as hero,
+  Rt as instagram,
+  ts as jaemin,
+  ss as pinterest,
+  ns as rotate,
+  is as scroll,
+  es as sheet,
+  rs as slide,
+  as as snap,
+  os as strip,
+  ls as swap
 };