@car-cutter/react-webplayer 0.6.0 → 0.6.1

package/dist/index.js

@@ -1,4 +1,4 @@
-import ye, { createContext as _e, useContext as ze, useRef as Z, useState as W, useCallback as M, useEffect as F, useMemo as re, Fragment as Rt } from "react";
+import be, { createContext as _e, useContext as ze, useRef as Y, useState as F, useCallback as M, useEffect as Z, useMemo as re, Fragment as Rt } from "react";
 import { createRoot as Pt } from "react-dom/client";
 var Qe = { exports: {} }, fe = {};
 /**
@@ -10,23 +10,23 @@ var Qe = { exports: {} }, fe = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var $e;
-function Ft() {
-  if ($e) return fe;
-  $e = 1;
-  var e = ye, r = Symbol.for("react.element"), n = Symbol.for("react.fragment"), o = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, u = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function l(i, s, y) {
+var We;
+function Zt() {
+  if (We) return fe;
+  We = 1;
+  var e = be, r = Symbol.for("react.element"), n = Symbol.for("react.fragment"), o = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, u = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function l(i, s, b) {
     var c, m = {}, g = null, _ = null;
-    y !== void 0 && (g = "" + y), s.key !== void 0 && (g = "" + s.key), s.ref !== void 0 && (_ = s.ref);
+    b !== void 0 && (g = "" + b), s.key !== void 0 && (g = "" + s.key), s.ref !== void 0 && (_ = s.ref);
     for (c in s) o.call(s, c) && !u.hasOwnProperty(c) && (m[c] = s[c]);
     if (i && i.defaultProps) for (c in s = i.defaultProps, s) m[c] === void 0 && (m[c] = s[c]);
     return { $$typeof: r, type: i, key: g, ref: _, props: m, _owner: a.current };
   }
   return fe.Fragment = n, fe.jsx = l, fe.jsxs = l, fe;
 }
-Qe.exports = Ft();
+Qe.exports = Zt();
 var et = Qe.exports;
-const Fe = "cc-webplayer", Ae = "cc-webplayer-icon", tt = "composition-loading", rt = "composition-loaded", nt = "composition-load-error", ot = "extend-mode-on", st = "extend-mode-off", at = "hotspots-on", it = "hotspots-off", lt = "gallery-open", ct = "gallery-close", At = !1, Dt = !1, Wt = !1, Zt = "quality", Yt = !1, dt = "cc-webplayer:", $t = !1;
+const Ze = "cc-webplayer", Ae = "cc-webplayer-icon", tt = "composition-loading", rt = "composition-loaded", nt = "composition-load-error", ot = "extend-mode-on", st = "extend-mode-off", at = "hotspots-on", it = "hotspots-off", lt = "gallery-open", ct = "gallery-close", At = !1, Dt = !1, Ft = !1, Yt = "quality", $t = !1, dt = "cc-webplayer:", Wt = !1;
 function wn(e, r) {
   return `https://cdn.car-cutter.com/gallery/${e}/${r}/composition_v3.json`;
 }
@@ -48,10 +48,10 @@ var Ue;
 function Xt() {
   if (Ue) return xe;
   Ue = 1;
-  var e = ye, r = Symbol.for("react.element"), n = Symbol.for("react.fragment"), o = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, u = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function l(i, s, y) {
+  var e = be, r = Symbol.for("react.element"), n = Symbol.for("react.fragment"), o = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, u = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function l(i, s, b) {
     var c, m = {}, g = null, _ = null;
-    y !== void 0 && (g = "" + y), s.key !== void 0 && (g = "" + s.key), s.ref !== void 0 && (_ = s.ref);
+    b !== void 0 && (g = "" + b), s.key !== void 0 && (g = "" + s.key), s.ref !== void 0 && (_ = s.ref);
     for (c in s) o.call(s, c) && !u.hasOwnProperty(c) && (m[c] = s[c]);
     if (i && i.defaultProps) for (c in s = i.defaultProps, s) m[c] === void 0 && (m[c] = s[c]);
     return { $$typeof: r, type: i, key: g, ref: _, props: m, _owner: a.current };
@@ -67,11 +67,11 @@ async function Bt(e) {
   return await r.json();
 }
 const Oe = /* @__PURE__ */ new Map(), Gt = (e) => {
-  const [r, n] = W({
+  const [r, n] = F({
     status: "pending",
     isSuccess: !1
   });
-  return F(() => {
+  return Z(() => {
     const o = (u) => n({ status: "success", data: u, isSuccess: !0 }), a = Oe.get(e);
     if (a && !(a instanceof Promise)) {
       o(a);
@@ -106,7 +106,7 @@ const Oe = /* @__PURE__ */ new Map(), Gt = (e) => {
       "useCompositionContext must be used within a CompositionContextProvider"
     );
   return e;
-}, Kt = ({ composition: e, children: r }) => {
+}, qt = ({ composition: e, children: r }) => {
   const { aspectRatio: n, categories: o } = e, a = re(
     () => o.flatMap(({ items: l }) => l),
     [o]
@@ -128,14 +128,14 @@ const Oe = /* @__PURE__ */ new Map(), Gt = (e) => {
 function ae(e, r, n) {
   return Math.min(Math.max(e, r), n);
 }
-const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e(null), J = () => {
+const Ee = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e(null), J = () => {
   const e = ze(ht);
   if (!e)
     throw new Error(
       "useGlobalContext must be used within a GlobalContextProvider"
     );
   return e;
-}, qt = ({ children: e, ...r }) => /* @__PURE__ */ t.jsx(ht.Provider, { value: r, children: e }), gt = _e(null), q = () => {
+}, Kt = ({ children: e, ...r }) => /* @__PURE__ */ t.jsx(ht.Provider, { value: r, children: e }), gt = _e(null), K = () => {
   const e = ze(gt);
   if (!e)
     throw new Error(
@@ -152,16 +152,16 @@ const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e
     isFullScreen: a,
     requestFullscreen: u,
     exitFullscreen: l
-  } = J(), { categories: i, items: s } = ne(), [y, c] = W(s.map(() => null)), m = M(
+  } = J(), { categories: i, items: s } = ne(), [b, c] = F(s.map(() => null)), m = M(
     (P, ee) => {
       c(
         (ge) => ge.map((oe, Ot) => Ot === P ? ee : oe)
       );
     },
     []
-  ), [g, _] = W(0), [w, x] = W(null), E = w ?? g, C = s[E], z = y[E], [f, p] = W(
+  ), [g, _] = F(0), [w, x] = F(null), N = w ?? g, C = s[N], z = b[N], [f, p] = F(
     null
-  ), v = !!f, j = M(() => p(null), []), T = M(() => {
+  ), v = !!f, j = M(() => p(null), []), S = M(() => {
     if (v || w !== null)
       return;
     const P = g - 1;
@@ -183,13 +183,13 @@ const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e
     g,
     s.length,
     r
-  ]), S = M(
+  ]), V = M(
     (P) => {
       const ee = Math.min(g, P), ge = Math.max(g, P);
-      y.slice(ee, ge + 1).filter((oe) => oe === null).length > 2 && p("instant"), x(P);
+      b.slice(ee, ge + 1).filter((oe) => oe === null).length > 2 && p("instant"), x(P);
     },
-    [g, y]
-  ), N = re(() => {
+    [g, b]
+  ), E = re(() => {
     for (const P of i)
       if (P.items.includes(C))
         return P.id;
@@ -200,9 +200,9 @@ const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e
       if (ee === void 0)
         throw new Error("Failed to find target category");
       const ge = s.findIndex((oe) => oe === ee);
-      S(ge);
+      V(ge);
     },
-    [i, s, S]
+    [i, s, V]
   ), I = re(() => {
     switch (C.type) {
       case "image":
@@ -212,7 +212,7 @@ const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e
       case "video":
         return !1;
     }
-  }, [C, z]), [H, h] = W(!0), V = M(() => {
+  }, [C, z]), [H, h] = F(!0), T = M(() => {
     const P = !H;
     h(P), o(P ? at : it);
   }, [o, H]), d = re(() => {
@@ -223,10 +223,10 @@ const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e
       case "video":
         return z !== "running";
     }
-  }, [C, z]), [b, k] = W(!1), A = M(() => {
-    const P = !b;
+  }, [C, z]), [y, k] = F(!1), A = M(() => {
+    const P = !y;
     k(P), o(P ? lt : ct);
-  }, [o, b]), [D, Y] = W(null), $ = M(() => Y(null), []), X = !!D, B = re(() => {
+  }, [o, y]), [D, $] = F(null), W = M(() => $(null), []), X = !!D, B = re(() => {
     switch (C.type) {
       case "image":
         return !0;
@@ -235,25 +235,25 @@ const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e
       case "video":
         return !1;
     }
-  }, [C.type, z]), [G, Q] = W(1), pe = G !== 1, be = G < Le, Ie = G > 1, ie = M((P) => {
+  }, [C.type, z]), [G, Q] = F(1), pe = G !== 1, ye = G < Le, Ie = G > 1, ie = M((P) => {
     Q((ee) => ae(ee + P, 1, Le));
-  }, []), he = M(() => Q(1), []), Tt = M(() => ie(Pe), [ie]), St = M(() => ie(-Pe), [ie]), Me = M(() => {
-    he(), $();
-  }, [he, $]), [le, Vt] = W(!1), [Te, Ze] = W(), [Se, Ye] = W(!1), ce = M(
+  }, []), he = M(() => Q(1), []), St = M(() => ie(Pe), [ie]), Vt = M(() => ie(-Pe), [ie]), Me = M(() => {
+    he(), W();
+  }, [he, W]), [le, Tt] = F(!1), [Se, Ye] = F(), [Ve, $e] = F(!1), ce = M(
     async (P) => {
-      Me(), Vt(P), o(P ? ot : st);
+      Me(), Tt(P), o(P ? ot : st);
     },
     [o, Me]
   ), de = M(() => {
-    clearTimeout(Te);
+    clearTimeout(Se);
     const P = setTimeout(() => {
-      Ze(void 0);
+      Ye(void 0);
     }, pt);
-    Ze(P);
-  }, [Te]), Ve = M(async () => {
+    Ye(P);
+  }, [Se]), Te = M(async () => {
     if (de(), !n) {
       const P = await u();
-      if (Ye(!P), P)
+      if ($e(!P), P)
         return;
     }
     ce(!0);
@@ -263,22 +263,22 @@ const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e
     u,
     de
   ]), He = M(async () => {
-    de(), !(!n && (Ye(!1), await l())) && ce(!1);
+    de(), !(!n && ($e(!1), await l())) && ce(!1);
   }, [
     n,
     ce,
     l,
     de
   ]), Ht = M(() => {
-    le ? He() : Ve();
-  }, [He, Ve, le]);
-  return F(() => {
-    n || Se && le || a !== le && (de(), ce(a));
+    le ? He() : Te();
+  }, [He, Te, le]);
+  return Z(() => {
+    n || Ve && le || a !== le && (de(), ce(a));
   }, [
     n,
     ce,
     le,
-    Se,
+    Ve,
     a,
     de
   ]), /* @__PURE__ */ t.jsx(
@@ -291,41 +291,41 @@ const Ne = (e, r, n) => e + (r - e) * n, Xe = (e, r) => (e % r + r) % r, ht = _e
         setCarrouselItemIndex: _,
         itemIndexCommand: w,
         setItemIndexCommand: x,
-        masterItemIndex: E,
+        masterItemIndex: N,
         specialCommand: f,
         isRunningSpecialCommand: v,
         finishSpecialCommand: j,
-        prevItem: T,
+        prevItem: S,
         nextItem: R,
-        scrollToItemIndex: S,
-        displayedCategoryId: N,
+        scrollToItemIndex: V,
+        displayedCategoryId: E,
         changeCategory: L,
         enableHotspotsControl: I,
         showHotspots: H,
-        toggleHotspots: V,
+        toggleHotspots: T,
         showGalleryControls: d,
-        showGallery: b,
+        showGallery: y,
         toggleGallery: A,
         shownDetails: D,
         isShowingDetails: X,
-        setShownDetails: Y,
-        resetShownDetails: $,
+        setShownDetails: $,
+        resetShownDetails: W,
         showZoomControls: B,
         zoom: G,
         isZooming: pe,
         setZoom: Q,
         resetZoom: he,
-        canZoomIn: be,
-        zoomIn: Tt,
+        canZoomIn: ye,
+        zoomIn: St,
         canZoomOut: Ie,
-        zoomOut: St,
+        zoomOut: Vt,
         resetView: Me,
         extendMode: le,
-        enableExtendMode: Ve,
+        enableExtendMode: Te,
         disableExtendMode: He,
         toggleExtendMode: Ht,
-        extendTransition: !!Te,
-        fakeFullScreen: Se
+        extendTransition: !!Se,
+        fakeFullScreen: Ve
       },
       children: e
     }
@@ -402,15 +402,15 @@ function ue(e) {
   const [r, n] = nr(e);
   return sr({ positionX: n, positionY: r });
 }
-const wt = _e(null), yt = () => ze(wt), De = () => {
-  const e = yt();
+const wt = _e(null), bt = () => ze(wt), De = () => {
+  const e = bt();
   if (!e)
     throw new Error(
       "useCustomizationContext must be used within a CustomizationContextProvider"
     );
   return e;
 }, ar = ({ children: e }) => {
-  const [r, n] = W(
+  const [r, n] = F(
     /* @__PURE__ */ new Map()
   ), o = M(
     (l) => {
@@ -422,15 +422,15 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       );
       if (!s)
         return;
-      const y = s.getAttribute("color") ?? void 0, c = s.innerHTML, m = c ? /* @__PURE__ */ t.jsx(
+      const b = s.getAttribute("color") ?? void 0, c = s.innerHTML, m = c ? /* @__PURE__ */ t.jsx(
         "div",
         {
           className: "size-full",
           dangerouslySetInnerHTML: { __html: c }
         }
       ) : void 0;
-      if (!(!y && !m))
-        return { Icon: m, color: y };
+      if (!(!b && !m))
+        return { Icon: m, color: b };
     },
     [r]
   ), a = M(
@@ -495,7 +495,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
 }, cr = {
   button: "h-8 px-2",
   icon: "size-8 p-2"
-}, K = ({
+}, q = ({
   variant: e = "fill",
   shape: r = "button",
   color: n = "primary",
@@ -517,31 +517,45 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       children: a
     }
   );
-}, bt = (e) => /* @__PURE__ */ t.jsx(K, { color: "neutral", shape: "icon", ...e, children: /* @__PURE__ */ t.jsx(ir, { className: "size-full" }) }), jt = ({
-  title: e,
-  error: r,
-  children: n
-}) => (F(() => {
-  console.error(e, r);
-}, [r, e]), /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
-  /* @__PURE__ */ t.jsx("div", { className: "text-xl", children: e }),
-  n
-] })), dr = {
+}, yt = (e) => /* @__PURE__ */ t.jsx(q, { color: "neutral", shape: "icon", ...e, children: /* @__PURE__ */ t.jsx(ir, { className: "size-full" }) }), jt = ({ text: e, className: r }) => /* @__PURE__ */ t.jsxs(
+  "div",
+  {
+    className: O(
+      "flex size-full flex-col items-center justify-center gap-y-4",
+      r
+    ),
+    children: [
+      /* @__PURE__ */ t.jsx(
+        "img",
+        {
+          className: "h-20 small:h-28",
+          src: "https://cdn.car-cutter.com/libs/web-player/v3/assets/car_placeholder.png"
+        }
+      ),
+      /* @__PURE__ */ t.jsx("div", { className: "text-2xl font-bold", children: e })
+    ]
+  }
+), dr = {
   primary: "border-primary",
-  neutral: "border-background"
+  foreground: "border-foreground",
+  background: "border-background"
 }, ur = {
   sm: "size-4 border",
   md: "size-8 border-2",
   lg: "size-12 border-4"
 }, Ct = ({
-  color: e = "neutral",
+  color: e = "foreground",
   size: r = "md"
 }) => {
   const n = dr[e], o = ur[r];
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      className: `inline-block ${o} animate-rotation rounded-full ${n} border-b-transparent`
+      className: O(
+        "inline-block animate-rotation rounded-full border-b-transparent",
+        o,
+        n
+      )
     }
   );
 }, me = ({
@@ -556,7 +570,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
   const {
     minImageWidth: i,
     maxImageWidth: s,
-    imageLoadStrategy: y,
+    imageLoadStrategy: b,
     playerInViewportWidthRatio: c
   } = J(), { imageHdWidth: m, imageSubWidths: g } = ne(), [_, w] = re(() => {
     const C = g.concat(m).sort((p, v) => p - v).filter((p) => !(i && p < i || s && p > s));
@@ -568,7 +582,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       f = [`${C.shift()}px`];
     else {
       const p = 1 / (o * c);
-      if (y === "quality") {
+      if (b === "quality") {
         const v = C.pop();
         f = C.map(
           (j) => `(max-width: ${p * j}px) ${j}px`
@@ -583,7 +597,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
     return [z.join(", "), f.join(", ")];
   }, [
     m,
-    y,
+    b,
     g,
     o,
     s,
@@ -591,12 +605,12 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
     a,
     c,
     e
-  ]), [x, E] = W();
-  return F(() => {
+  ]), [x, N] = F();
+  return Z(() => {
     if (x === !0)
       return;
     const C = setTimeout(() => {
-      E((z) => z ?? !1);
+      N((z) => z ?? !1);
     }, 30);
     return () => clearTimeout(C);
   }, [x]), /* @__PURE__ */ t.jsx(
@@ -614,12 +628,12 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
         )
       ),
       onLoad: (C) => {
-        E(!0), n?.(C);
+        N(!0), n?.(C);
       },
       ...l
     }
   );
-}, We = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_PLAY", children: /* @__PURE__ */ t.jsx(
+}, Fe = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_PLAY", children: /* @__PURE__ */ t.jsx(
   "svg",
   {
     className: e,
@@ -689,7 +703,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
 ) }), Be = ({
   children: e
 }) => {
-  const { extendMode: r } = q();
+  const { extendMode: r } = K();
   return /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -729,7 +743,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       l = /* @__PURE__ */ t.jsx(Be, { children: /* @__PURE__ */ t.jsx(kt, { className: "size-full text-primary-light" }) });
       break;
     case "video":
-      l = /* @__PURE__ */ t.jsx(Be, { children: /* @__PURE__ */ t.jsx(We, { className: "size-full p-0.5 text-background" }) });
+      l = /* @__PURE__ */ t.jsx(Be, { children: /* @__PURE__ */ t.jsx(Fe, { className: "size-full p-0.5 text-background" }) });
       break;
   }
   return /* @__PURE__ */ t.jsxs("div", { className: "relative bg-foreground/30", style: n, children: [
@@ -741,93 +755,93 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
   neutral: "bg-neutral/50",
   background: "bg-background/50",
   foreground: "bg-foreground/50"
-}, Et = ({
+}, Nt = ({
   color: e = "neutral",
   orientation: r = "horizontal"
 }) => {
   const n = pr[e], o = r === "horizontal" ? "h-px w-full" : "w-px h-full";
   return /* @__PURE__ */ t.jsx("div", { className: O(n, o) });
-}, Nt = ({
+}, Et = ({
   className: e = "",
   containerClassName: r = ""
 }) => {
   const { hideCategories: n, infiniteCarrousel: o, permanentGallery: a, isFullScreen: u } = J(), { categories: l, items: i, aspectRatioStyle: s } = ne(), {
-    extendMode: y,
+    extendMode: b,
     extendTransition: c,
     masterItemIndex: m,
     prevItem: g,
     nextItem: _,
     scrollToItemIndex: w,
     resetView: x
-  } = q(), E = re(() => {
+  } = K(), N = re(() => {
     if (n)
       return [];
-    const N = new Array();
+    const E = new Array();
     let L = 0;
     for (let I = 0; I < l.length - 1; I++) {
       const H = l[I].items.length;
-      N.push(L + H), L += H;
+      E.push(L + H), L += H;
     }
-    return N;
-  }, [l, n]), C = Z(null), z = M(() => {
+    return E;
+  }, [l, n]), C = Y(null), z = M(() => {
     if (!C.current)
       throw new Error("slider.current is null");
     return C.current;
-  }, []), f = Z(!1), p = Z(
+  }, []), f = Y(!1), p = Y(
     null
-  ), [v, j] = W(!1), T = M(
-    (N, L) => {
-      const I = z(), H = I.clientWidth, h = I.scrollWidth / i.length, V = (N + 1 / 2) * h - H / 2, d = I.scrollWidth - I.clientWidth;
+  ), [v, j] = F(!1), S = M(
+    (E, L) => {
+      const I = z(), H = I.clientWidth, h = I.scrollWidth / i.length, T = (E + 1 / 2) * h - H / 2, d = I.scrollWidth - I.clientWidth;
       I.scrollTo({
-        left: ae(V, 0, d),
+        left: ae(T, 0, d),
         behavior: L
       });
     },
     [i.length, z]
   );
-  F(() => {
-    const N = C.current;
-    if (!N)
+  Z(() => {
+    const E = C.current;
+    if (!E)
       return;
     const L = (h) => {
       h.preventDefault(), f.current = !0, p.current = {
-        x: h.pageX - N.offsetLeft,
-        scrollLeft: N.scrollLeft
+        x: h.pageX - E.offsetLeft,
+        scrollLeft: E.scrollLeft
       };
     }, I = (h) => {
       if (!f.current)
         return;
       if (p.current === null)
         throw new Error("[onMouseMove] scrollStart is null");
-      const V = h.pageX - N.offsetLeft - p.current.x;
-      if (!v && Math.abs(V) < 5)
+      const T = h.pageX - E.offsetLeft - p.current.x;
+      if (!v && Math.abs(T) < 5)
         return;
-      const d = p.current.scrollLeft - V;
+      const d = p.current.scrollLeft - T;
       j(!0), requestAnimationFrame(() => {
-        N.scrollLeft = d;
+        E.scrollLeft = d;
       });
     }, H = () => {
       f.current && (f.current = !1, requestAnimationFrame(() => {
         j(!1);
       }));
     };
-    return N.addEventListener("mousedown", L), document.addEventListener("mousemove", I), document.addEventListener("mouseleave", H), document.addEventListener("mouseup", H), document.addEventListener("contextmenu", H), () => {
-      N.removeEventListener("mousedown", L), document.removeEventListener("mousemove", I), document.removeEventListener("mouseleave", H), document.removeEventListener("mouseup", H), document.removeEventListener("contextmenu", H);
+    return E.addEventListener("mousedown", L), document.addEventListener("mousemove", I), document.addEventListener("mouseleave", H), document.addEventListener("mouseup", H), document.addEventListener("contextmenu", H), () => {
+      E.removeEventListener("mousedown", L), document.removeEventListener("mousemove", I), document.removeEventListener("mouseleave", H), document.removeEventListener("mouseup", H), document.removeEventListener("contextmenu", H);
     };
   }, [v]);
-  const R = Z(m);
-  F(() => {
-    C.current && (T(m, "smooth"), R.current = m);
-  }, [m, T]), F(() => {
-    C.current && T(R.current, "instant");
+  const R = Y(m);
+  Z(() => {
+    C.current && (S(m, "smooth"), R.current = m);
+  }, [m, S]), Z(() => {
+    C.current && S(R.current, "instant");
   }, [
-    T,
+    S,
     // - Run the effect when those values change
     u,
-    y,
+    b,
     c
   ]);
-  const S = (N, L) => {
+  const V = (E, L) => {
     v || (o && L === i.length - 1 && m === 0 ? g() : o && L === 0 && m === i.length - 1 ? _() : w(L), x());
   };
   return /* @__PURE__ */ t.jsx(
@@ -844,12 +858,12 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
         {
           className: O(
             "flex h-10 w-fit gap-1 small:h-12 small:gap-2",
-            y && "large:h-20 large:gap-4",
+            b && "large:h-20 large:gap-4",
             r
           ),
-          children: i.map((N, L) => /* @__PURE__ */ t.jsxs(Rt, { children: [
-            E.includes(L) && /* @__PURE__ */ t.jsx("div", { className: "my-2", children: /* @__PURE__ */ t.jsx(
-              Et,
+          children: i.map((E, L) => /* @__PURE__ */ t.jsxs(Rt, { children: [
+            N.includes(L) && /* @__PURE__ */ t.jsx("div", { className: "my-2", children: /* @__PURE__ */ t.jsx(
+              Nt,
               {
                 color: a && !u ? "neutral" : "background",
                 orientation: "vertical"
@@ -865,8 +879,8 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
                   L === m ? "after:opacity-100" : "after:opacity-0 hover:after:opacity-70"
                 ),
                 style: s,
-                onClick: () => S(N, L),
-                children: /* @__PURE__ */ t.jsx(mr, { item: N })
+                onClick: () => V(E, L),
+                children: /* @__PURE__ */ t.jsx(mr, { item: E })
               }
             )
           ] }, L))
@@ -880,22 +894,22 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
   onlyPreload: e,
   ...r
 }) => {
-  const { zoom: n, isZooming: o, setZoom: a } = q(), u = Z(null), l = Z(null), i = M((f) => {
+  const { zoom: n, isZooming: o, setZoom: a } = K(), u = Y(null), l = Y(null), i = M((f) => {
     if (!l.current)
       throw new Error(
         `[${f ?? "getTransformElementOrThrow"}] transformElementRef.current is null`
       );
     return l.current;
-  }, []), s = Z(!1), y = Z(null), c = Z(/* @__PURE__ */ new Map()), m = Z({ x: 0, y: 0, scale: 1 }), g = Z(null), _ = M(
+  }, []), s = Y(!1), b = Y(null), c = Y(/* @__PURE__ */ new Map()), m = Y({ x: 0, y: 0, scale: 1 }), g = Y(null), _ = M(
     (f) => {
       const p = i("setTransformStyle"), {
         x: v,
         y: j,
-        scale: T
+        scale: S
       } = {
         ...m.current,
         ...f
-      }, R = ae(T, 1, Le), S = p.clientWidth, N = p.clientHeight, L = S * R, I = N * R, H = ae(v, -(L - S), 0), h = ae(j, -(I - N), 0);
+      }, R = ae(S, 1, Le), V = p.clientWidth, E = p.clientHeight, L = V * R, I = E * R, H = ae(v, -(L - V), 0), h = ae(j, -(I - E), 0);
       m.current = { x: H, y: h, scale: R }, p.style.transform = `translate(${H}px, ${h}px) scale(${R})`;
     },
     [i]
@@ -904,34 +918,34 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       const {
         x: v,
         y: j,
-        scale: T
+        scale: S
       } = m.current, {
         x: R,
-        y: S,
-        scale: N
+        y: V,
+        scale: E
       } = {
         ...m.current,
         ...f
       };
       g.current && (cancelAnimationFrame(g.current), g.current = null);
       const L = () => {
-        _({ x: R, y: S, scale: N }), a(N);
-      }, I = Math.abs(R - v) < 1 && Math.abs(S - j) < 1 && Math.abs(N - T) < 5e-3;
+        _({ x: R, y: V, scale: E }), a(E);
+      }, I = Math.abs(R - v) < 1 && Math.abs(V - j) < 1 && Math.abs(E - S) < 5e-3;
       if (!p || I) {
         L();
         return;
       }
       const H = (/* @__PURE__ */ new Date()).getTime(), h = () => {
-        const V = () => {
+        const T = () => {
           const d = (/* @__PURE__ */ new Date()).getTime() - H;
           if (d >= p) {
             L(), g.current = null;
             return;
           }
-          const b = Math.min(d / p, 1), k = Lt(b), A = Ne(v, R, k), D = Ne(j, S, k), Y = Ne(T, N, k);
-          _({ x: A, y: D, scale: Y }), h();
+          const y = Math.min(d / p, 1), k = Lt(y), A = Ee(v, R, k), D = Ee(j, V, k), $ = Ee(S, E, k);
+          _({ x: A, y: D, scale: $ }), h();
         };
-        g.current = requestAnimationFrame(V);
+        g.current = requestAnimationFrame(T);
       };
       h();
     },
@@ -948,14 +962,14 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       );
     },
     [w]
-  ), E = M(
+  ), N = M(
     (f, p, v) => {
-      const j = m.current.scale, T = ae(f, 1, Le), R = T / j, { x: S, y: N } = m.current, { x: L, y: I } = p, H = -S + L, h = -N + I, V = H * R, d = h * R, b = V - L, k = d - I, A = -b, D = -k;
+      const j = m.current.scale, S = ae(f, 1, Le), R = S / j, { x: V, y: E } = m.current, { x: L, y: I } = p, H = -V + L, h = -E + I, T = H * R, d = h * R, y = T - L, k = d - I, A = -y, D = -k;
       w(
         {
           x: A,
           y: D,
-          scale: T
+          scale: S
         },
         v
       );
@@ -966,7 +980,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       const p = i(
         "shiftZoomFromButton"
       ), v = p.clientWidth, j = p.clientHeight;
-      E(
+      N(
         f,
         {
           x: v / 2,
@@ -975,44 +989,44 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
         200
       );
     },
-    [i, E]
+    [i, N]
   ), z = M(
     (f, p, v) => {
       const { scale: j } = m.current;
-      E(
+      N(
         j + f,
         p,
         v
       );
     },
-    [E]
+    [N]
   );
-  return F(() => {
+  return Z(() => {
     e || l.current && C(n);
-  }, [e, C, n]), F(() => {
+  }, [e, C, n]), Z(() => {
     if (e || !o)
       return;
     const f = l.current;
     if (!f)
       return;
-    const p = (T) => {
-      T.preventDefault(), T.stopPropagation(), s.current = !0, y.current = {
-        x: T.clientX,
-        y: T.clientY
+    const p = (S) => {
+      S.preventDefault(), S.stopPropagation(), s.current = !0, b.current = {
+        x: S.clientX,
+        y: S.clientY
       };
-    }, v = (T) => {
+    }, v = (S) => {
       if (!s.current)
         return;
-      if (!y.current)
+      if (!b.current)
         throw new Error("mouseStartXY.current is null");
-      T.stopPropagation();
-      const R = T.clientX - y.current.x, S = T.clientY - y.current.y;
+      S.stopPropagation();
+      const R = S.clientX - b.current.x, V = S.clientY - b.current.y;
       x({
         x: R,
-        y: S
-      }), y.current = {
-        x: T.clientX,
-        y: T.clientY
+        y: V
+      }), b.current = {
+        x: S.clientX,
+        y: S.clientY
       };
     }, j = () => {
       s.current = !1;
@@ -1020,19 +1034,19 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
     return f.addEventListener("mousedown", p), document.addEventListener("mousemove", v), document.addEventListener("mouseleave", j), document.addEventListener("mouseup", j), document.addEventListener("contextmenu", j), () => {
       f.removeEventListener("mousedown", p), document.removeEventListener("mousemove", v), document.removeEventListener("mouseleave", j), document.removeEventListener("mouseup", j), document.removeEventListener("contextmenu", j);
     };
-  }, [o, x, e]), F(() => {
+  }, [o, x, e]), Z(() => {
     if (e)
       return;
     const f = u.current;
     if (!f)
       return;
     const p = (v) => {
-      const { ctrlKey: j, clientX: T, clientY: R, deltaX: S, deltaY: N } = v;
+      const { ctrlKey: j, clientX: S, clientY: R, deltaX: V, deltaY: E } = v;
       if (j) {
-        if (!o && N >= 0)
+        if (!o && E >= 0)
           return;
-        const { left: L, top: I } = f.getBoundingClientRect(), H = T - L, h = R - I;
-        z(-0.01 * N, {
+        const { left: L, top: I } = f.getBoundingClientRect(), H = S - L, h = R - I;
+        z(-0.01 * E, {
           x: H,
           y: h
         });
@@ -1040,8 +1054,8 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
         if (!o)
           return;
         x({
-          x: -2 * S,
-          y: -2 * N
+          x: -2 * V,
+          y: -2 * E
         });
       }
       v.preventDefault();
@@ -1049,27 +1063,27 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
     return f.addEventListener("wheel", p), () => {
       f.removeEventListener("wheel", p);
     };
-  }, [o, x, z, e]), F(() => {
+  }, [o, x, z, e]), Z(() => {
     const f = u.current, p = l.current;
     if (!f || !p)
       return;
-    const v = c.current, j = (S) => {
-      for (let N = 0; N < S.changedTouches.length; N++) {
-        const L = S.changedTouches[N];
+    const v = c.current, j = (V) => {
+      for (let E = 0; E < V.changedTouches.length; E++) {
+        const L = V.changedTouches[E];
         v.set(L.identifier, L);
       }
-    }, T = (S) => {
-      for (let N = 0; N < S.changedTouches.length; N++) {
-        const L = S.changedTouches[N];
+    }, S = (V) => {
+      for (let E = 0; E < V.changedTouches.length; E++) {
+        const L = V.changedTouches[E];
         v.delete(L.identifier);
       }
-    }, R = (S) => {
-      const N = S.touches.length;
-      if (N === 1) {
+    }, R = (V) => {
+      const E = V.touches.length;
+      if (E === 1) {
         if (!o)
           return;
-        S.preventDefault();
-        const L = S.touches[0], I = v.get(L.identifier);
+        V.preventDefault();
+        const L = V.touches[0], I = v.get(L.identifier);
         if (!I)
           throw new Error("touchStart is null");
         const H = L.clientX - I.clientX, h = L.clientY - I.clientY;
@@ -1077,23 +1091,23 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
           x: H,
           y: h
         }), v.set(L.identifier, L);
-      } else if (N === 2) {
-        S.preventDefault();
-        const [L, I] = S.touches, H = v.get(L.identifier), h = v.get(I.identifier);
+      } else if (E === 2) {
+        V.preventDefault();
+        const [L, I] = V.touches, H = v.get(L.identifier), h = v.get(I.identifier);
         if (!H || !h)
           throw new Error("intialTouch1 or intialTouch2 is null");
-        const V = Ge(
+        const T = Ge(
           H,
           h
-        ), d = Ge(L, I) / V, { left: b, top: k } = f.getBoundingClientRect();
+        ), d = Ge(L, I) / T, { left: y, top: k } = f.getBoundingClientRect();
         z(d - 1, {
-          x: (L.clientX + I.clientX) / 2 - b,
+          x: (L.clientX + I.clientX) / 2 - y,
           y: (L.clientY + I.clientY) / 2 - k
         }), v.set(L.identifier, L), v.set(I.identifier, I);
       }
     };
-    return p.addEventListener("touchstart", j), p.addEventListener("touchmove", R), p.addEventListener("touchend", T), p.addEventListener("touchcancel", T), () => {
-      p.removeEventListener("touchstart", j), p.removeEventListener("touchmove", R), p.removeEventListener("touchend", T), p.removeEventListener("touchcancel", T);
+    return p.addEventListener("touchstart", j), p.addEventListener("touchmove", R), p.addEventListener("touchend", S), p.addEventListener("touchcancel", S), () => {
+      p.removeEventListener("touchstart", j), p.removeEventListener("touchmove", R), p.removeEventListener("touchend", S), p.removeEventListener("touchcancel", S);
     };
   }, [o, x, z]), /* @__PURE__ */ t.jsx(
     "div",
@@ -1123,8 +1137,8 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
     fill: "currentColor"
   }
 ) }) }), fr = ({ hotspot: e }) => {
-  const { title: r, icon: n, description: o, position: a, detail: u } = e, { getIconConfig: l } = De(), i = n ? l(n) : void 0, { extendMode: s, setShownDetails: y } = q(), c = !!u, m = u?.type === "image", g = !!r || !!o, _ = m ? /* @__PURE__ */ t.jsx(gr, { className: "size-4" }) : /* @__PURE__ */ t.jsx("div", { className: "size-1" }), w = () => {
-    m && y({
+  const { title: r, icon: n, description: o, position: a, detail: u } = e, { getIconConfig: l } = De(), i = n ? l(n) : void 0, { extendMode: s, setShownDetails: b } = K(), c = !!u, m = u?.type === "image", g = !!r || !!o, _ = m ? /* @__PURE__ */ t.jsx(gr, { className: "size-4" }) : /* @__PURE__ */ t.jsx("div", { className: "size-1" }), w = () => {
+    m && b({
       src: u.src,
       title: r,
       text: o
@@ -1220,7 +1234,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
   onLoad: o,
   ...a
 }) => {
-  const { isShowingDetails: u, showHotspots: l, setItemInteraction: i } = q();
+  const { isShowingDetails: u, showHotspots: l, setItemInteraction: i } = K();
   return /* @__PURE__ */ t.jsx("div", { className: O("relative size-full overflow-hidden", n), children: /* @__PURE__ */ t.jsxs(
     "div",
     {
@@ -1239,7 +1253,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
             ...a
           }
         ),
-        l && e?.map((s, y) => /* @__PURE__ */ t.jsx(xr, { hotspot: s }, y))
+        l && e?.map((s, b) => /* @__PURE__ */ t.jsx(xr, { hotspot: s }, b))
       ]
     }
   ) });
@@ -1247,39 +1261,39 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
   images: e,
   onlyPreload: r
 }) => {
-  const { reverse360: n } = J(), { isShowingDetails: o, isZooming: a } = q(), u = a || o, l = Z(null), i = Z(null), [s, y] = W(0), c = e.length, m = M(() => {
-    y((_) => (_ - 1 + c) % c);
+  const { reverse360: n } = J(), { isShowingDetails: o, isZooming: a } = K(), u = a || o, l = Y(null), i = Y(null), [s, b] = F(0), c = e.length, m = M(() => {
+    b((_) => (_ - 1 + c) % c);
   }, [c]), g = M(() => {
-    y((_) => (_ + 1) % c);
+    b((_) => (_ + 1) % c);
   }, [c]);
-  return F(() => {
+  return Z(() => {
     if (u)
       return;
     const _ = l.current, w = i.current;
     if (!_ || !w)
       return;
-    let x = null, E = [], C = null;
+    let x = null, N = [], C = null;
     const z = (d) => {
-      E.push(d), E.length > 20 && E.shift();
+      N.push(d), N.length > 20 && N.shift();
     }, f = () => {
-      const d = Date.now(), b = (() => {
-        const Y = Date.now(), $ = E.filter(
-          (G) => Y - G.timestamp < 50
+      const d = Date.now(), y = (() => {
+        const $ = Date.now(), W = N.filter(
+          (G) => $ - G.timestamp < 50
         );
-        if ($.length < 2)
+        if (W.length < 2)
           return 0;
-        const X = $[0], B = $[$.length - 1];
+        const X = W[0], B = W[W.length - 1];
         return (B.value - X.value) / (1e-3 * Math.max(B.timestamp - X.timestamp, 1));
       })();
       let k = 0, A = d;
       const D = () => {
         C = requestAnimationFrame(() => {
-          const Y = Date.now(), $ = (Y - d) / 1e3, X = Math.pow(0.05, $), B = b * X, G = (Y - A) / 1e3;
+          const $ = Date.now(), W = ($ - d) / 1e3, X = Math.pow(0.05, W), B = y * X, G = ($ - A) / 1e3;
           if (k += B * G, Math.abs(B) < 5 * ve && Math.abs(k) < ve) {
             C = null;
             return;
           }
-          Math.abs(k) >= ve && (k > 0 !== n ? g() : m(), k = 0), A = Y, D();
+          Math.abs(k) >= ve && (k > 0 !== n ? g() : m(), k = 0), A = $, D();
         });
       };
       D();
@@ -1289,28 +1303,28 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       if (d.button !== 0)
         return;
       d.preventDefault(), d.stopPropagation(), p();
-      const b = d.clientX;
-      x = b, E = [{ timestamp: Date.now(), value: b }];
+      const y = d.clientX;
+      x = y, N = [{ timestamp: Date.now(), value: y }];
     }, j = (d) => {
       if (x === null)
         return;
       d.stopPropagation();
-      const { clientX: b } = d;
-      z({ timestamp: Date.now(), value: b });
-      const k = b - x;
-      Math.abs(k) < ve || (k > 0 !== n ? g() : m(), x = b);
-    }, T = () => {
+      const { clientX: y } = d;
+      z({ timestamp: Date.now(), value: y });
+      const k = y - x;
+      Math.abs(k) < ve || (k > 0 !== n ? g() : m(), x = y);
+    }, S = () => {
       x !== null && (x = null, f());
     };
-    _.addEventListener("mousedown", v), document.addEventListener("mousemove", j), document.addEventListener("mouseleave", T), document.addEventListener("mouseup", T), document.addEventListener("contextmenu", T);
-    const R = () => w.getBoundingClientRect().width, S = () => w.scrollWidth / 2 - R() / 2, N = () => {
-      const d = S();
+    _.addEventListener("mousedown", v), document.addEventListener("mousemove", j), document.addEventListener("mouseleave", S), document.addEventListener("mouseup", S), document.addEventListener("contextmenu", S);
+    const R = () => w.getBoundingClientRect().width, V = () => w.scrollWidth / 2 - R() / 2, E = () => {
+      const d = V();
       w.scrollLeft = d;
     };
-    N();
+    E();
     const L = () => {
-      const d = w.scrollLeft - S();
-      Math.abs(d) < vr || (d < 0 !== n ? g() : m(), N());
+      const d = w.scrollLeft - V();
+      Math.abs(d) < vr || (d < 0 !== n ? g() : m(), E());
     };
     w.addEventListener("scroll", L);
     let I = null;
@@ -1318,28 +1332,28 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       if (I !== null || d.changedTouches.length !== 1)
         return;
       p();
-      const { identifier: b, clientX: k } = d.changedTouches[0];
-      I = b, x = k, E = [{ timestamp: Date.now(), value: k }];
+      const { identifier: y, clientX: k } = d.changedTouches[0];
+      I = y, x = k, N = [{ timestamp: Date.now(), value: k }];
     }, h = (d) => {
       if (!x)
         return;
-      const b = Array.from(d.changedTouches).find(
+      const y = Array.from(d.changedTouches).find(
         ({ identifier: D }) => D === I
       );
-      if (!b)
+      if (!y)
         return;
       d.preventDefault();
-      const { clientX: k } = b;
+      const { clientX: k } = y;
       z({ timestamp: Date.now(), value: k });
       const A = k - x;
       Math.abs(A) < ve || (A > 0 !== n ? g() : m(), x = k);
-    }, V = (d) => {
+    }, T = (d) => {
       !x || !Array.from(d.changedTouches).some(
-        ({ identifier: b }) => b === I
+        ({ identifier: y }) => y === I
       ) || (I = null, x = null, f());
     };
-    return w.addEventListener("touchstart", H), w.addEventListener("touchmove", h), w.addEventListener("touchend", V), w.addEventListener("touchcancel", V), () => {
-      _.removeEventListener("mousedown", v), document.removeEventListener("mousemove", j), document.removeEventListener("mouseleave", T), document.removeEventListener("mouseup", T), document.removeEventListener("contextmenu", T), w.removeEventListener("scroll", L), w.removeEventListener("touchstart", H), w.removeEventListener("touchmove", h), w.removeEventListener("touchend", V), w.removeEventListener("touchcancel", V);
+    return w.addEventListener("touchstart", H), w.addEventListener("touchmove", h), w.addEventListener("touchend", T), w.addEventListener("touchcancel", T), () => {
+      _.removeEventListener("mousedown", v), document.removeEventListener("mousemove", j), document.removeEventListener("mouseleave", S), document.removeEventListener("mouseup", S), document.removeEventListener("contextmenu", S), w.removeEventListener("scroll", L), w.removeEventListener("touchstart", H), w.removeEventListener("touchmove", h), w.removeEventListener("touchend", T), w.removeEventListener("touchcancel", T);
     };
   }, [g, m, u, n]), /* @__PURE__ */ t.jsx("div", { ref: l, className: "cursor-ew-resize", children: /* @__PURE__ */ t.jsxs("div", { ref: i, className: "overflow-x-scroll no-scrollbar", children: [
     /* @__PURE__ */ t.jsxs("div", { className: "sticky left-0 top-0", children: [
@@ -1355,16 +1369,16 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
     ] }),
     /* @__PURE__ */ t.jsx("div", { className: "pointer-events-none -mt-px h-px w-[calc(100%+1024px)]" })
   ] }) });
-}, yr = ({ images: e, onPlaceholderImageLoaded: r, onSpinImagesLoaded: n, onError: o }) => {
-  const a = re(() => e.map(({ src: c }) => c), [e]), [u, l] = W(null), i = u ? [...u.values()].filter((c) => c).length / e.length * 100 : null, s = M(() => {
+}, br = ({ images: e, onPlaceholderImageLoaded: r, onSpinImagesLoaded: n, onError: o }) => {
+  const a = re(() => e.map(({ src: c }) => c), [e]), [u, l] = F(null), i = u ? [...u.values()].filter((c) => c).length / e.length * 100 : null, s = M(() => {
     i === null && l(new Map(a.map((c) => [c, !1])));
-  }, [a, i]), y = M((c) => {
+  }, [a, i]), b = M((c) => {
     l((m) => {
       const g = new Map(m);
       return g.set(c, !0), g;
     });
   }, []);
-  return F(() => {
+  return Z(() => {
     i === 100 && n();
   }, [i, n]), /* @__PURE__ */ t.jsxs("div", { className: "relative size-full", children: [
     i !== null && i !== 100 && // Add images to DOM to preload them
@@ -1372,7 +1386,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       me,
       {
         src: c,
-        onLoad: () => y(c),
+        onLoad: () => b(c),
         onError: o
       },
       c
@@ -1387,7 +1401,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
     ),
     /* @__PURE__ */ t.jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center gap-y-4 bg-foreground/35", children: [
       /* @__PURE__ */ t.jsx(kt, { className: "size-20 text-primary-light" }),
-      /* @__PURE__ */ t.jsx(K, { color: "neutral", shape: "icon", onClick: s, children: /* @__PURE__ */ t.jsx(We, { className: "size-full" }) }),
+      /* @__PURE__ */ t.jsx(q, { color: "neutral", shape: "icon", onClick: s, children: /* @__PURE__ */ t.jsx(Fe, { className: "size-full" }) }),
       /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -1406,12 +1420,18 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       )
     ] })
   ] });
-}, br = (e) => {
-  const { itemIndex: r } = e, { setItemInteraction: n } = q(), [o, a] = W();
-  return F(() => {
+}, yr = (e) => {
+  const { itemIndex: r } = e, { setItemInteraction: n } = K(), [o, a] = F();
+  return Z(() => {
     o === null || o === "error" || n(r, o === "spin" ? "running" : "ready");
-  }, [r, n, o]), o === "error" ? /* @__PURE__ */ t.jsx(jt, { title: "Failed to fetch 360" }) : o !== "spin" ? /* @__PURE__ */ t.jsx(
-    yr,
+  }, [r, n, o]), o === "error" ? /* @__PURE__ */ t.jsx(
+    jt,
+    {
+      className: "text-background",
+      text: "Spin could not be loaded"
+    }
+  ) : o !== "spin" ? /* @__PURE__ */ t.jsx(
+    br,
     {
       ...e,
       onPlaceholderImageLoaded: () => a("placeholder"),
@@ -1419,7 +1439,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       onError: () => a("error")
     }
   ) : /* @__PURE__ */ t.jsx(wr, { ...e });
-}, jr = (e) => /* @__PURE__ */ t.jsx(K, { color: "neutral", shape: "icon", ...e, children: /* @__PURE__ */ t.jsx(We, { className: "size-full" }) }), Cr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_PAUSE", children: /* @__PURE__ */ t.jsx(
+}, jr = (e) => /* @__PURE__ */ t.jsx(q, { color: "neutral", shape: "icon", ...e, children: /* @__PURE__ */ t.jsx(Fe, { className: "size-full" }) }), Cr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_PAUSE", children: /* @__PURE__ */ t.jsx(
   "svg",
   {
     className: e,
@@ -1453,7 +1473,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       }
     )
   }
-) }), Er = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_VOLUME_OFF", children: /* @__PURE__ */ t.jsx(
+) }), Nr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_VOLUME_OFF", children: /* @__PURE__ */ t.jsx(
   "svg",
   {
     className: e,
@@ -1470,110 +1490,110 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
       }
     )
   }
-) }), Ke = ({ progress: e }) => /* @__PURE__ */ t.jsx("div", { className: "h-1 w-full overflow-hidden rounded-ui-sm bg-background/25", children: /* @__PURE__ */ t.jsx(
+) }), qe = ({ progress: e }) => /* @__PURE__ */ t.jsx("div", { className: "h-1 w-full overflow-hidden rounded-ui-sm bg-background/25", children: /* @__PURE__ */ t.jsx(
   "div",
   {
     className: "size-full rounded-ui-sm bg-background transition-transform",
     style: { transform: `translateX(-${100 * (1 - e)}%)` }
   }
-) }), Nr = 3e3, Lr = ({ src: e, poster: r, itemIndex: n }) => {
-  const { carrouselItemIndex: o, setItemInteraction: a } = q(), u = Z(null), l = Z(null), i = M(() => {
+) }), Er = 3e3, Lr = ({ src: e, poster: r, itemIndex: n }) => {
+  const { carrouselItemIndex: o, setItemInteraction: a } = K(), u = Y(null), l = Y(null), i = M(() => {
     if (!l.current)
       throw new Error("videoRef.current is null");
     return l.current;
   }, []);
-  F(() => {
+  Z(() => {
     a(n, "ready");
   }, [n, a]);
   const s = M(() => {
     i().play();
-  }, [i]), y = M(() => {
+  }, [i]), b = M(() => {
     i().pause();
   }, [i]);
-  F(() => {
-    o === n || y();
-  }, [o, n, y]);
-  const [c, m] = W(!1), [g, _] = W(!0), w = () => {
+  Z(() => {
+    o === n || b();
+  }, [o, n, b]);
+  const [c, m] = F(!1), [g, _] = F(!0), w = () => {
     m(!0), a(n, "running");
   }, x = () => {
     m(!1), a(n, "ready");
-  }, E = () => {
+  }, N = () => {
     _(!1);
   }, C = () => {
     _(!0);
-  }, [z, f] = W(null), p = (d) => {
-    const b = i(), k = d.currentTarget.getBoundingClientRect(), A = (d.clientX - k.left) / k.width, D = Math.min(1, Math.max(0, A));
-    b.volume = D, b.muted = !1;
+  }, [z, f] = F(null), p = (d) => {
+    const y = i(), k = d.currentTarget.getBoundingClientRect(), A = (d.clientX - k.left) / k.width, D = Math.min(1, Math.max(0, A));
+    y.volume = D, y.muted = !1;
   }, v = (d) => {
-    const b = i();
-    b.muted = d;
+    const y = i();
+    y.muted = d;
   };
-  F(() => {
+  Z(() => {
     const d = l.current;
     if (!d)
       return;
-    const b = () => {
+    const y = () => {
       f({
         volume: d.volume,
         isMuted: d.muted
       });
     };
-    return b(), d.addEventListener("volumechange", b), () => {
-      d.removeEventListener("volumechange", b);
+    return y(), d.addEventListener("volumechange", y), () => {
+      d.removeEventListener("volumechange", y);
     };
   }, []);
-  const [j, T] = W(null), R = j ? j.currentTime / j.duration : 0;
-  F(() => {
+  const [j, S] = F(null), R = j ? j.currentTime / j.duration : 0;
+  Z(() => {
     const d = l.current;
     if (!d) return;
-    const b = () => {
+    const y = () => {
       const k = d.currentTime, A = d.duration;
-      isNaN(k) || isNaN(A) || T({
+      isNaN(k) || isNaN(A) || S({
         currentTime: k,
         duration: A
       });
     };
-    return b(), d.addEventListener("timeupdate", b), () => {
-      d.removeEventListener("timeupdate", b);
+    return y(), d.addEventListener("timeupdate", y), () => {
+      d.removeEventListener("timeupdate", y);
     };
   }, []);
-  const S = (d) => {
-    const b = i(), k = d.currentTarget.getBoundingClientRect(), A = (d.clientX - k.left) / k.width, D = b.duration * A;
-    b.currentTime = D;
-  }, N = (d) => {
-    const b = Math.floor(d % 3600 / 60), k = Math.floor(d % 60);
-    return `${b}:${k.toString().padStart(2, "0")}`;
-  }, [L, I] = W(!1), H = Z(void 0), h = M(
+  const V = (d) => {
+    const y = i(), k = d.currentTarget.getBoundingClientRect(), A = (d.clientX - k.left) / k.width, D = y.duration * A;
+    y.currentTime = D;
+  }, E = (d) => {
+    const y = Math.floor(d % 3600 / 60), k = Math.floor(d % 60);
+    return `${y}:${k.toString().padStart(2, "0")}`;
+  }, [L, I] = F(!1), H = Y(void 0), h = M(
     () => clearTimeout(H.current),
     []
-  ), V = M(() => {
+  ), T = M(() => {
     h(), H.current = setTimeout(() => {
       I(!1);
-    }, Nr);
+    }, Er);
   }, [h]);
-  return F(() => {
-    const d = u.current, b = l.current;
-    if (!d || !b)
+  return Z(() => {
+    const d = u.current, y = l.current;
+    if (!d || !y)
       return;
     const k = () => {
-      V(), I(!0);
+      T(), I(!0);
     }, A = () => {
       h(), I(!1);
     };
     let D = !1;
-    const Y = () => {
+    const $ = () => {
       D = !0;
-    }, $ = () => {
-      D && (D = !1, y());
+    }, W = () => {
+      D && (D = !1, b());
     }, X = () => {
       D = !1, k();
     }, B = (G) => {
-      G.preventDefault(), G.touches.length === 1 && (V(), I((Q) => !Q));
+      G.preventDefault(), G.touches.length === 1 && (T(), I((Q) => !Q));
     };
-    return d.addEventListener("mousedown", Y), d.addEventListener("mouseup", $), d.addEventListener("mouseenter", k), d.addEventListener("mousemove", X), d.addEventListener("mouseleave", A), b.addEventListener("touchstart", B), () => {
-      d.removeEventListener("mousedown", Y), d.removeEventListener("mouseup", $), d.removeEventListener("mouseenter", k), d.removeEventListener("mousemove", k), d.removeEventListener("mouseleave", A), b.removeEventListener("touchstart", B);
+    return d.addEventListener("mousedown", $), d.addEventListener("mouseup", W), d.addEventListener("mouseenter", k), d.addEventListener("mousemove", X), d.addEventListener("mouseleave", A), y.addEventListener("touchstart", B), () => {
+      d.removeEventListener("mousedown", $), d.removeEventListener("mouseup", W), d.removeEventListener("mouseenter", k), d.removeEventListener("mousemove", k), d.removeEventListener("mouseleave", A), y.removeEventListener("touchstart", B);
     };
-  }, [h, y, V]), /* @__PURE__ */ t.jsxs("div", { ref: u, className: "relative size-full", children: [
+  }, [h, b, T]), /* @__PURE__ */ t.jsxs("div", { ref: u, className: "relative size-full", children: [
     /* @__PURE__ */ t.jsx(
       "video",
       {
@@ -1586,7 +1606,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
         onPlay: w,
         onPause: x,
         onEnded: x,
-        onCanPlay: E,
+        onCanPlay: N,
         onWaiting: C
       }
     ),
@@ -1607,20 +1627,20 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
                   className: "flex items-center gap-x-4",
                   children: [
                     /* @__PURE__ */ t.jsx(
-                      K,
+                      q,
                       {
                         shape: "icon",
                         variant: "ghost",
                         color: "neutral",
-                        onClick: y,
+                        onClick: b,
                         children: /* @__PURE__ */ t.jsx(Cr, { className: "size-full" })
                       }
                     ),
                     j && /* @__PURE__ */ t.jsxs("span", { className: "text-sm", children: [
-                      N(j.currentTime),
+                      E(j.currentTime),
                       " /",
                       " ",
-                      N(j.duration)
+                      E(j.duration)
                     ] })
                   ]
                 }
@@ -1635,7 +1655,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
                       {
                         className: `w-12 cursor-pointer py-1 opacity-0 transition-opacity ${z.isMuted ? "group-hover/volume:opacity-50" : "group-hover/volume:opacity-100"}`,
                         onClick: p,
-                        children: /* @__PURE__ */ t.jsx(Ke, { progress: z.volume })
+                        children: /* @__PURE__ */ t.jsx(qe, { progress: z.volume })
                       }
                     ),
                     /* @__PURE__ */ t.jsx(
@@ -1643,7 +1663,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
                       {
                         className: "size-5 cursor-pointer",
                         onClick: () => v(!z.isMuted),
-                        children: z.isMuted ? /* @__PURE__ */ t.jsx(Er, { className: "size-full" }) : /* @__PURE__ */ t.jsx(kr, { className: "size-full" })
+                        children: z.isMuted ? /* @__PURE__ */ t.jsx(Nr, { className: "size-full" }) : /* @__PURE__ */ t.jsx(kr, { className: "size-full" })
                       }
                     )
                   ]
@@ -1654,8 +1674,8 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
               "div",
               {
                 className: "cursor-pointer py-1",
-                onClick: S,
-                children: /* @__PURE__ */ t.jsx(Ke, { progress: R })
+                onClick: V,
+                children: /* @__PURE__ */ t.jsx(qe, { progress: R })
               }
             )
           ]
@@ -1665,7 +1685,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
         "div",
         {
           className: "pointer-events-none absolute inset-0 flex items-center justify-center bg-foreground/25",
-          children: /* @__PURE__ */ t.jsx(Ct, { size: "lg" })
+          children: /* @__PURE__ */ t.jsx(Ct, { size: "lg", color: "background" })
         }
       )
     ] }) : /* @__PURE__ */ t.jsx(
@@ -1691,7 +1711,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
         break;
       case "360":
         u = /* @__PURE__ */ t.jsx(
-          br,
+          yr,
           {
             itemIndex: e,
             onlyPreload: !n,
@@ -1704,7 +1724,7 @@ const wt = _e(null), yt = () => ze(wt), De = () => {
   }
   return u;
 }, zr = (e) => {
-  F(() => {
+  Z(() => {
     const r = (n) => {
       n.key === "Escape" && e();
     };
@@ -1720,25 +1740,25 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
   /* @__PURE__ */ t.jsx("span", { children: e + 1 }),
   /* @__PURE__ */ t.jsx("span", { children: "/" }),
   /* @__PURE__ */ t.jsx("span", { children: r + 1 })
-] }), qe = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_ARROW_RIGHT", children: /* @__PURE__ */ t.jsx("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t.jsx(
+] }), Ke = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_ARROW_RIGHT", children: /* @__PURE__ */ t.jsx("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t.jsx(
   "path",
   {
     d: "M4.07666 13.4868L5.25666 14.6668L11.9233 8.00016L5.25666 1.3335L4.07666 2.5135L9.56333 8.00016L4.07666 13.4868Z",
     fill: "currentColor"
   }
-) }) }), Tr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_EXTEND", children: /* @__PURE__ */ t.jsx("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t.jsx(
+) }) }), Sr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_EXTEND", children: /* @__PURE__ */ t.jsx("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t.jsx(
   "path",
   {
     d: "M4.66683 9.3335H3.3335V12.6668H6.66683V11.3335H4.66683V9.3335ZM3.3335 6.66683H4.66683V4.66683H6.66683V3.3335H3.3335V6.66683ZM11.3335 11.3335H9.3335V12.6668H12.6668V9.3335H11.3335V11.3335ZM9.3335 3.3335V4.66683H11.3335V6.66683H12.6668V3.3335H9.3335Z",
     fill: "currentColor"
   }
-) }) }), Sr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_GALLERY", children: /* @__PURE__ */ t.jsx("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t.jsx(
+) }) }), Vr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_GALLERY", children: /* @__PURE__ */ t.jsx("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t.jsx(
   "path",
   {
     d: "M13.3334 2.66683V10.6668H5.33337V2.66683H13.3334ZM13.3334 1.3335H5.33337C4.60004 1.3335 4.00004 1.9335 4.00004 2.66683V10.6668C4.00004 11.4002 4.60004 12.0002 5.33337 12.0002H13.3334C14.0667 12.0002 14.6667 11.4002 14.6667 10.6668V2.66683C14.6667 1.9335 14.0667 1.3335 13.3334 1.3335ZM7.66671 7.78016L8.79337 9.28683L10.4467 7.22016L12.6667 10.0002H6.00004L7.66671 7.78016ZM1.33337 4.00016V13.3335C1.33337 14.0668 1.93337 14.6668 2.66671 14.6668H12V13.3335H2.66671V4.00016H1.33337Z",
     fill: "currentColor"
   }
-) }) }), Vr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_HOTSPOTS", children: /* @__PURE__ */ t.jsxs(
+) }) }), Tr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_HOTSPOTS", children: /* @__PURE__ */ t.jsxs(
   "svg",
   {
     className: e,
@@ -1843,7 +1863,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
       )
     ]
   }
-), Fr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_BURGER", children: /* @__PURE__ */ t.jsx(
+), Zr = ({ className: e }) => /* @__PURE__ */ t.jsx(U, { className: e, customizationKey: "UI_BURGER", children: /* @__PURE__ */ t.jsx(
   "svg",
   {
     className: e,
@@ -1861,7 +1881,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     )
   }
 ) }), Ar = ({ sharedClassName: e }) => {
-  const { categories: r } = ne(), { displayedCategoryId: n, changeCategory: o } = q(), [a, u] = W(!1), l = () => {
+  const { categories: r } = ne(), { displayedCategoryId: n, changeCategory: o } = K(), [a, u] = F(!1), l = () => {
     u(!a);
   }, i = () => {
     u(!1);
@@ -1884,15 +1904,15 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
         ),
         children: [
           /* @__PURE__ */ t.jsx(
-            K,
+            q,
             {
               shape: "icon",
               color: a ? "primary" : "neutral",
               onClick: l,
-              children: /* @__PURE__ */ t.jsx(Fr, {})
+              children: /* @__PURE__ */ t.jsx(Zr, {})
             }
           ),
-          a && /* @__PURE__ */ t.jsx("div", { className: "rounded-ui-md bg-background transition-radius", children: /* @__PURE__ */ t.jsx("ul", { className: "space-y-0.5 p-1", children: r.map(({ id: s, title: y }) => /* @__PURE__ */ t.jsx(
+          a && /* @__PURE__ */ t.jsx("div", { className: "rounded-ui-md bg-background transition-radius", children: /* @__PURE__ */ t.jsx("ul", { className: "space-y-0.5 p-1", children: r.map(({ id: s, title: b }) => /* @__PURE__ */ t.jsx(
             "li",
             {
               className: O(
@@ -1902,7 +1922,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
               onClick: () => {
                 o(s), u(!1);
               },
-              children: y
+              children: b
             },
             s
           )) }) })
@@ -1917,12 +1937,12 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
           vt("top"),
           "w-full overflow-x-auto max-small:hidden"
         ),
-        children: /* @__PURE__ */ t.jsx("div", { className: "mx-auto flex w-fit gap-x-1 rounded-ui-md bg-background p-1 shadow", children: r.map(({ id: s, title: y }) => /* @__PURE__ */ t.jsx(
-          K,
+        children: /* @__PURE__ */ t.jsx("div", { className: "mx-auto flex w-fit gap-x-1 rounded-ui-md bg-background p-1 shadow", children: r.map(({ id: s, title: b }) => /* @__PURE__ */ t.jsx(
+          q,
           {
             variant: s === n ? "fill" : "ghost",
             onClick: () => o(s),
-            children: y
+            children: b
           },
           s
         )) })
@@ -1938,26 +1958,26 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     carrouselItemIndex: l,
     masterItemIndex: i,
     prevItem: s,
-    nextItem: y,
+    nextItem: b,
     showGalleryControls: c,
     enableHotspotsControl: m,
     showHotspots: g,
     toggleHotspots: _,
     showGallery: w,
     toggleGallery: x,
-    extendMode: E,
+    extendMode: N,
     toggleExtendMode: C,
     shownDetails: z,
     isShowingDetails: f,
     resetShownDetails: p,
     showZoomControls: v,
     isZooming: j,
-    canZoomIn: T,
+    canZoomIn: S,
     zoomIn: R,
-    canZoomOut: S,
-    zoomOut: N,
+    canZoomOut: V,
+    zoomOut: E,
     resetView: L
-  } = q(), I = M(
+  } = K(), I = M(
     (h) => {
       Ir(h) && p();
     },
@@ -1985,7 +2005,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     ) }),
     u && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       /* @__PURE__ */ t.jsx(
-        K,
+        q,
         {
           shape: "icon",
           color: "neutral",
@@ -1996,11 +2016,11 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
           ),
           onClick: s,
           disabled: !r && i <= 0,
-          children: /* @__PURE__ */ t.jsx(U, { customizationKey: "CONTROLS_ARROW_LEFT", children: /* @__PURE__ */ t.jsx(qe, { className: "size-full rotate-180" }) })
+          children: /* @__PURE__ */ t.jsx(U, { customizationKey: "CONTROLS_ARROW_LEFT", children: /* @__PURE__ */ t.jsx(Ke, { className: "size-full rotate-180" }) })
         }
       ),
       /* @__PURE__ */ t.jsx(
-        K,
+        q,
         {
           shape: "icon",
           color: "neutral",
@@ -2009,9 +2029,9 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
             ue("middle-right"),
             j ? "!pointer-events-none opacity-0" : "opacity-100"
           ),
-          onClick: y,
+          onClick: b,
           disabled: !r && i >= o - 1,
-          children: /* @__PURE__ */ t.jsx(U, { customizationKey: "CONTROLS_ARROW_RIGHT", children: /* @__PURE__ */ t.jsx(qe, { className: "size-full" }) })
+          children: /* @__PURE__ */ t.jsx(U, { customizationKey: "CONTROLS_ARROW_RIGHT", children: /* @__PURE__ */ t.jsx(Ke, { className: "size-full" }) })
         }
       )
     ] }),
@@ -2026,18 +2046,18 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
         children: [
           !n && u && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
             /* @__PURE__ */ t.jsx(
-              K,
+              q,
               {
                 className: c && !j ? "opacity-100" : "!pointer-events-none opacity-0",
                 variant: "fill",
                 color: w ? "primary" : "neutral",
                 shape: "icon",
                 onClick: x,
-                children: /* @__PURE__ */ t.jsx(U, { customizationKey: "CONTROLS_GALLERY", children: /* @__PURE__ */ t.jsx(Sr, { className: "size-full" }) })
+                children: /* @__PURE__ */ t.jsx(U, { customizationKey: "CONTROLS_GALLERY", children: /* @__PURE__ */ t.jsx(Vr, { className: "size-full" }) })
               }
             ),
             w && /* @__PURE__ */ t.jsx(
-              Nt,
+              Et,
               {
                 className: O(
                   "transition-opacity",
@@ -2059,42 +2079,42 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
                 ),
                 enabled: g,
                 onToggle: _,
-                children: /* @__PURE__ */ t.jsx(Vr, { className: "size-full" })
+                children: /* @__PURE__ */ t.jsx(Tr, { className: "size-full" })
               }
             ),
             v && /* @__PURE__ */ t.jsxs("div", { className: "max-small:hidden", children: [
               /* @__PURE__ */ t.jsx(
-                K,
+                q,
                 {
                   className: "rounded-b-none",
                   color: "neutral",
                   shape: "icon",
-                  disabled: !T,
+                  disabled: !S,
                   onClick: R,
                   children: /* @__PURE__ */ t.jsx(Or, { className: "size-full" })
                 }
               ),
-              /* @__PURE__ */ t.jsx(Et, { color: "background" }),
+              /* @__PURE__ */ t.jsx(Nt, { color: "background" }),
               /* @__PURE__ */ t.jsx(
-                K,
+                q,
                 {
                   className: "rounded-t-none",
                   color: "neutral",
                   shape: "icon",
-                  disabled: !S,
-                  onClick: N,
+                  disabled: !V,
+                  onClick: E,
                   children: /* @__PURE__ */ t.jsx(Hr, { className: "size-full" })
                 }
               )
             ] }),
             /* @__PURE__ */ t.jsx(
-              K,
+              q,
               {
                 variant: "fill",
-                color: E ? "primary" : "neutral",
+                color: N ? "primary" : "neutral",
                 shape: "icon",
                 onClick: C,
-                children: E ? /* @__PURE__ */ t.jsx(Rr, { className: "size-full" }) : /* @__PURE__ */ t.jsx(Tr, { className: "size-full" })
+                children: N ? /* @__PURE__ */ t.jsx(Rr, { className: "size-full" }) : /* @__PURE__ */ t.jsx(Sr, { className: "size-full" })
               }
             )
           ] })
@@ -2132,7 +2152,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
                 {
                   className: O(
                     "space-y-1 px-2 py-1 small:p-3",
-                    E && "large:p-4"
+                    N && "large:p-4"
                   ),
                   children: [
                     z.title && /* @__PURE__ */ t.jsx(
@@ -2140,7 +2160,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
                       {
                         className: O(
                           "text-sm font-semibold small:text-base small:font-bold",
-                          E && "large:text-lg"
+                          N && "large:text-lg"
                         ),
                         children: z.title
                       }
@@ -2150,7 +2170,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
                       {
                         className: O(
                           "text-xs text-foreground/65 small:text-sm",
-                          E && "large:text-base"
+                          N && "large:text-base"
                         ),
                         children: z.text
                       }
@@ -2164,120 +2184,120 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
       }
     ),
     (j || f) && /* @__PURE__ */ t.jsx(
-      bt,
+      yt,
       {
         className: O(H, ue("top-right")),
         onClick: L
       }
     )
   ] });
-}, Wr = ({ className: e = "" }) => {
+}, Fr = ({ className: e = "" }) => {
   const { infiniteCarrousel: r, isFullScreen: n } = J(), { items: o, aspectRatioStyle: a } = ne(), {
     slidable: u,
     carrouselItemIndex: l,
     setCarrouselItemIndex: i,
     itemIndexCommand: s,
-    setItemIndexCommand: y,
+    setItemIndexCommand: b,
     specialCommand: c,
     isRunningSpecialCommand: m,
     finishSpecialCommand: g,
     extendMode: _,
     extendTransition: w
-  } = q(), x = Z(null), E = M((h) => {
+  } = K(), x = Y(null), N = M((h) => {
     if (!x.current)
       throw new Error(`[${h ?? "sliderOrThrow"}] slider.current is null`);
     return x.current;
-  }, []), C = Z(!1), z = Z(null), f = Z(null), p = Z(null), v = M(() => {
+  }, []), C = Y(!1), z = Y(null), f = Y(null), p = Y(null), v = M(() => {
     p.current && cancelAnimationFrame(p.current);
   }, []), j = M(() => {
-    const h = E("computeClosestSnapIndex"), V = Array.from(h.children), d = h.scrollLeft, b = V.reduce(
+    const h = N("computeClosestSnapIndex"), T = Array.from(h.children), d = h.scrollLeft, y = T.reduce(
       (k, A, D) => {
-        const Y = A.offsetLeft;
-        return Math.abs(Y - d) < Math.abs(V[k].offsetLeft - d) ? D : k;
+        const $ = A.offsetLeft;
+        return Math.abs($ - d) < Math.abs(T[k].offsetLeft - d) ? D : k;
       },
       0
     );
-    return c === "first_to_last" ? Xe(b, o.length) : c === "last_to_first" ? Xe(b - 1, o.length) : b;
-  }, [c, E, o.length]), T = M(
+    return c === "first_to_last" ? Xe(y, o.length) : c === "last_to_first" ? Xe(y - 1, o.length) : y;
+  }, [c, N, o.length]), S = M(
     (h) => {
-      const V = E("setStyleCursor");
-      V.style.cursor = h;
+      const T = N("setStyleCursor");
+      T.style.cursor = h;
     },
-    [E]
+    [N]
   ), R = M(
     (h) => {
-      const V = E("setStyleSnapState");
-      h === "mandatory" ? V.style.scrollSnapType = "x mandatory" : V.style.scrollSnapType = "none";
+      const T = N("setStyleSnapState");
+      h === "mandatory" ? T.style.scrollSnapType = "x mandatory" : T.style.scrollSnapType = "none";
     },
-    [E]
-  ), S = M(
-    (h, V, d) => {
+    [N]
+  ), V = M(
+    (h, T, d) => {
       v();
-      const b = E("scrollToIndex"), k = Array.from(b.children), A = b.scrollLeft, D = k[h].offsetLeft, Y = (pe) => {
-        b.scrollTo({
+      const y = N("scrollToIndex"), k = Array.from(y.children), A = y.scrollLeft, D = k[h].offsetLeft, $ = (pe) => {
+        y.scrollTo({
           left: pe,
           behavior: "instant"
         });
-      }, $ = () => {
-        Y(D), R("mandatory"), d?.();
+      }, W = () => {
+        $(D), R("mandatory"), d?.();
       }, X = Math.abs(A - D);
-      if (X < 1 || V === "instant") {
-        $();
+      if (X < 1 || T === "instant") {
+        W();
         return;
       }
       const B = ae(X / 2.5, 300, 1e3), G = (/* @__PURE__ */ new Date()).getTime();
       R("none");
       const Q = () => {
         const pe = () => {
-          const be = (/* @__PURE__ */ new Date()).getTime() - G;
-          if (be >= B) {
-            $();
+          const ye = (/* @__PURE__ */ new Date()).getTime() - G;
+          if (ye >= B) {
+            W();
             return;
           }
-          const Ie = Math.min(be / B, 1), ie = Lt(Ie), he = Ne(A, D, ie);
-          Y(he), Q();
+          const Ie = Math.min(ye / B, 1), ie = Lt(Ie), he = Ee(A, D, ie);
+          $(he), Q();
         };
         p.current = requestAnimationFrame(pe);
       };
       Q();
     },
-    [v, E, R]
-  ), [N, L] = W(), I = !!N;
-  F(() => {
+    [v, N, R]
+  ), [E, L] = F(), I = !!E;
+  Z(() => {
     const h = () => {
-      clearTimeout(N);
-      const V = setTimeout(() => {
+      clearTimeout(E);
+      const T = setTimeout(() => {
         L(void 0);
       }, pt);
-      L(V);
+      L(T);
     };
     return addEventListener("resize", h), document.addEventListener("fullscreenchange", h), () => {
       removeEventListener("resize", h), document.removeEventListener("fullscreenchange", h);
     };
-  }, [N]), F(() => {
+  }, [E]), Z(() => {
     const h = j();
-    Number.isNaN(h) || h !== l && S(l, "instant");
+    Number.isNaN(h) || h !== l && V(l, "instant");
   }, [
     l,
-    S,
+    V,
     j,
     // - Run the effect when those values change
     o,
-    N,
+    E,
     n,
     _,
     w
-  ]), F(() => {
+  ]), Z(() => {
     if (!u || m) {
-      T("auto");
+      S("auto");
       return;
     }
     const h = x.current;
     if (!h)
       return;
-    T("grab"), R("mandatory");
-    const V = (k) => {
-      k.button === 0 && (k.preventDefault(), k.stopPropagation(), v(), C.current = !0, z.current = k.pageX - h.offsetLeft, f.current = h.scrollLeft, T("grabbing"));
+    S("grab"), R("mandatory");
+    const T = (k) => {
+      k.button === 0 && (k.preventDefault(), k.stopPropagation(), v(), C.current = !0, z.current = k.pageX - h.offsetLeft, f.current = h.scrollLeft, S("grabbing"));
     }, d = (k) => {
       if (!C.current)
         return;
@@ -2290,36 +2310,36 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
           throw new Error("[onMouseMove] scrollLeft is null");
         h.scrollLeft = f.current - A;
       });
-    }, b = () => {
+    }, y = () => {
       if (!C.current)
         return;
-      C.current = !1, T("grab");
+      C.current = !1, S("grab");
       const k = j();
-      S(k, "smooth");
+      V(k, "smooth");
     };
-    return h.addEventListener("mousedown", V), document.addEventListener("mousemove", d), document.addEventListener("mouseleave", b), document.addEventListener("mouseup", b), document.addEventListener("contextmenu", b), () => {
-      h.removeEventListener("mousedown", V), document.removeEventListener("mousemove", d), document.removeEventListener("mouseleave", b), document.removeEventListener("mouseup", b), document.removeEventListener("contextmenu", b);
+    return h.addEventListener("mousedown", T), document.addEventListener("mousemove", d), document.addEventListener("mouseleave", y), document.addEventListener("mouseup", y), document.addEventListener("contextmenu", y), () => {
+      h.removeEventListener("mousedown", T), document.removeEventListener("mousemove", d), document.removeEventListener("mouseleave", y), document.removeEventListener("mouseup", y), document.removeEventListener("contextmenu", y);
     };
   }, [
     v,
     j,
     m,
+    V,
     S,
-    T,
     R,
     u
-  ]), F(() => {
+  ]), Z(() => {
     if (w || I)
       return;
     const h = x.current;
     if (!h)
       return;
-    const V = () => {
+    const T = () => {
       const d = j();
-      Number.isNaN(d) || (i(d), d === s && y(null));
+      Number.isNaN(d) || (i(d), d === s && b(null));
     };
-    return h.addEventListener("scroll", V), () => {
-      h.removeEventListener("scroll", V);
+    return h.addEventListener("scroll", T), () => {
+      h.removeEventListener("scroll", T);
     };
   }, [
     j,
@@ -2329,23 +2349,23 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     s,
     o.length,
     i,
-    y
-  ]), F(() => {
+    b
+  ]), Z(() => {
     if (s === null)
       return;
     const h = () => g();
     switch (c) {
       case "first_to_last":
-        S(o.length, "instant"), S(o.length - 1, "smooth", h);
+        V(o.length, "instant"), V(o.length - 1, "smooth", h);
         break;
       case "last_to_first":
-        S(0, "instant"), S(1, "smooth", h);
+        V(0, "instant"), V(1, "smooth", h);
         break;
       case "instant":
-        S(s, "instant", h);
+        V(s, "instant", h);
         break;
       default:
-        S(s, "smooth");
+        V(s, "smooth");
         break;
     }
   }, [
@@ -2353,7 +2373,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     g,
     s,
     o.length,
-    S
+    V
   ]);
   const H = () => /* @__PURE__ */ t.jsx("div", { className: "h-full", style: a });
   return /* @__PURE__ */ t.jsxs(
@@ -2372,10 +2392,10 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
             className: `flex size-full ${u ? "overflow-x-auto no-scrollbar *:snap-start *:snap-always" : "justify-center"}`,
             children: [
               c === "last_to_first" && /* @__PURE__ */ t.jsx(H, {}),
-              o.map((h, V) => {
-                const d = h.type === "360" ? h.images[0] : h.src, b = V === l, k = V === 0, A = l === o.length - 1, D = V === o.length - 1, Y = l === 0, $ = Math.abs(V - l) > 1 && // Not next to the current one
+              o.map((h, T) => {
+                const d = h.type === "360" ? h.images[0] : h.src, y = T === l, k = T === 0, A = l === o.length - 1, D = T === o.length - 1, $ = l === 0, W = Math.abs(T - l) > 1 && // Not next to the current one
                 !(r && k && A) && // Not the last one when the first one is shown (only for infinite carrousel)
-                !(r && D && Y), X = (() => {
+                !(r && D && $), X = (() => {
                   if (c === "first_to_last" && k)
                     return {
                       transform: `translateX(${100 * o.length}%)`
@@ -2389,22 +2409,22 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
                   "div",
                   {
                     className: O(
-                      "h-full bg-foreground/50",
-                      l === V && "z-1"
+                      "h-full bg-foreground/35",
+                      l === T && "z-1"
                       // Give high-ground to the shown item (to avoid 1px vertical line)
                     ),
                     style: { ...a, ...X },
                     children: /* @__PURE__ */ t.jsx(
                       _r,
                       {
-                        index: V,
+                        index: T,
                         item: h,
-                        isShown: b,
-                        lazy: $
+                        isShown: y,
+                        lazy: W
                       }
                     )
                   },
-                  `${V}_${d}`
+                  `${T}_${d}`
                 );
               }),
               c === "first_to_last" && /* @__PURE__ */ t.jsx(H, {})
@@ -2415,7 +2435,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
       ]
     }
   );
-}, Zr = () => {
+}, Yr = () => {
   const { permanentGallery: e } = J(), { aspectRatioStyle: r } = ne(), {
     prevItem: n,
     nextItem: o,
@@ -2424,17 +2444,17 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     extendMode: l,
     disableExtendMode: i,
     isZooming: s,
-    resetZoom: y,
+    resetZoom: b,
     fakeFullScreen: c
-  } = q(), m = Z(null), g = Z(null), _ = Z(null);
-  return F(() => {
+  } = K(), m = Y(null), g = Y(null), _ = Y(null);
+  return Z(() => {
     if (!l)
       return;
-    const w = m.current, x = g.current, E = _.current;
-    if (!w || !x || !E)
+    const w = m.current, x = g.current, N = _.current;
+    if (!w || !x || !N)
       return;
     let C = !1;
-    const z = (v) => [w, x, E].includes(v.target), f = (v) => {
+    const z = (v) => [w, x, N].includes(v.target), f = (v) => {
       C = z(v);
     }, p = (v) => {
       C && (z(v) && i(), C = !1);
@@ -2442,9 +2462,9 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     return w.addEventListener("mousedown", f), w.addEventListener("mouseup", p), () => {
       w.removeEventListener("mousedown", f), w.removeEventListener("mouseup", p);
     };
-  }, [i, l]), F(() => {
+  }, [i, l]), Z(() => {
     const w = (x) => {
-      x.key === "Escape" && (s ? y() : a ? u() : i());
+      x.key === "Escape" && (s ? b() : a ? u() : i());
     };
     return addEventListener("keydown", w), () => {
       removeEventListener("keydown", w);
@@ -2456,7 +2476,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     o,
     n,
     u,
-    y
+    b
   ]), /* @__PURE__ */ t.jsxs(
     "div",
     {
@@ -2480,15 +2500,15 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
                     l && "mx-auto flex min-h-0 w-full max-w-[1600px] justify-center"
                   ),
                   style: r,
-                  children: /* @__PURE__ */ t.jsx(Wr, { className: O(l && "h-full min-w-0") })
+                  children: /* @__PURE__ */ t.jsx(Fr, { className: O(l && "h-full min-w-0") })
                 }
               ),
-              e && /* @__PURE__ */ t.jsx(Nt, { className: O(l && "my-2 shrink-0 small:my-4") })
+              e && /* @__PURE__ */ t.jsx(Et, { className: O(l && "my-2 shrink-0 small:my-4") })
             ]
           }
         ),
         l && /* @__PURE__ */ t.jsx(
-          bt,
+          yt,
           {
             className: "absolute right-2 top-2 small:right-4 small:top-4",
             onClick: i
@@ -2497,7 +2517,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
       ]
     }
   );
-}, Yr = ({
+}, $r = ({
   compositionUrl: e
 }) => {
   const { emitEvent: r } = J(), {
@@ -2506,33 +2526,39 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     isSuccess: a,
     error: u
   } = Gt(e);
-  return F(() => {
+  return Z(() => {
     u ? r(nt, u) : o === "fetching" ? r(tt, e) : a && r(rt, n);
-  }, [n, e, r, u, a, o]), u ? /* @__PURE__ */ t.jsx(jt, { title: "Failed to fetch composition", error: u }) : a ? /* @__PURE__ */ t.jsx(Kt, { composition: n, children: /* @__PURE__ */ t.jsx(Jt, { children: /* @__PURE__ */ t.jsx(Zr, {}) }) }) : /* @__PURE__ */ t.jsxs("div", { className: "flex aspect-video size-full flex-col items-center justify-center gap-y-4", children: [
-    /* @__PURE__ */ t.jsx("div", { className: "text-xl", children: "Loading WebPlayer..." }),
-    /* @__PURE__ */ t.jsx(Ct, { color: "primary" })
+  }, [n, e, r, u, a, o]), u ? /* @__PURE__ */ t.jsx(
+    jt,
+    {
+      className: "aspect-square text-foreground/70",
+      text: "Player could not be loaded"
+    }
+  ) : a ? /* @__PURE__ */ t.jsx(qt, { composition: n, children: /* @__PURE__ */ t.jsx(Jt, { children: /* @__PURE__ */ t.jsx(Yr, {}) }) }) : /* @__PURE__ */ t.jsxs("div", { className: "flex aspect-square size-full flex-col items-center justify-center gap-y-4", children: [
+    /* @__PURE__ */ t.jsx("div", { className: "animate-pulse text-xl", children: "Loading Player" }),
+    /* @__PURE__ */ t.jsx(Ct, { color: "foreground" })
   ] });
-}, $r = ({
+}, Wr = ({
   compositionUrl: e,
   hideCategories: r = At,
   infiniteCarrousel: n = Dt,
-  permanentGallery: o = Wt,
-  imageLoadStrategy: a = Zt,
-  preventFullScreen: u = Yt,
+  permanentGallery: o = Ft,
+  imageLoadStrategy: a = Yt,
+  preventFullScreen: u = $t,
   eventPrefix: l = dt,
-  reverse360: i = $t,
+  reverse360: i = Wt,
   children: s,
   // NOTE: use to customize the player, not to display the content
-  ...y
+  ...b
 }) => {
-  const c = Z(null), [m, g] = W(0.5), [_, w] = W(!1), x = M(
+  const c = Y(null), [m, g] = F(0.5), [_, w] = F(!1), x = M(
     (z, f) => {
       const p = l + z, v = new CustomEvent(p, { detail: f });
       document.dispatchEvent(v);
     },
     [l]
   );
-  F(() => {
+  Z(() => {
     if (_) {
       g(1);
       return;
@@ -2546,7 +2572,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     return f(), addEventListener("resize", f), () => {
       removeEventListener("resize", f);
     };
-  }, [_]), F(() => {
+  }, [_]), Z(() => {
     if (u)
       return;
     const z = c.current;
@@ -2556,14 +2582,14 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
       const { fullscreenElement: p } = document;
       w(
         p === z || // NOTE: For custom element, the web browser is making the whole custom element full-screen and not only the wrapper
-        p?.localName === Fe
+        p?.localName === Ze
       );
     };
     return document.addEventListener("fullscreenchange", f), () => {
       document.removeEventListener("fullscreenchange", f);
     };
   }, [u]);
-  const E = M(async () => {
+  const N = M(async () => {
     const z = c.current;
     if (!z)
       throw new Error("Wrapper not found");
@@ -2580,9 +2606,9 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
     }
   }, []);
   return /* @__PURE__ */ t.jsx(
-    qt,
+    Kt,
     {
-      ...y,
+      ...b,
       reverse360: i,
       imageLoadStrategy: a,
       hideCategories: r,
@@ -2592,7 +2618,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
       emitEvent: x,
       playerInViewportWidthRatio: m,
       isFullScreen: _,
-      requestFullscreen: E,
+      requestFullscreen: N,
       exitFullscreen: C,
       children: /* @__PURE__ */ t.jsxs(ar, { children: [
         /* @__PURE__ */ t.jsx(
@@ -2601,7 +2627,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
             id: "cc-webplayer-wrapper",
             ref: c,
             className: "select-none text-foreground",
-            children: /* @__PURE__ */ t.jsx(Yr, { compositionUrl: e })
+            children: /* @__PURE__ */ t.jsx($r, { compositionUrl: e })
           }
         ),
         s
@@ -2610,7 +2636,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
   );
 }, Ur = ({ name: e, color: r, children: n }) => {
   const { setIconConfig: o, resetIconConfig: a } = De();
-  return F(() => {
+  return Z(() => {
     if (!(!n && !r))
       return o(e, {
         Icon: n,
@@ -2619,7 +2645,7 @@ const Mr = ({ currentIndex: e, maxIndex: r }) => /* @__PURE__ */ t.jsxs("div", {
         a(e);
       };
   }, [n, r, e, a, o]), null;
-}, Xr = (e) => yt() ? /* @__PURE__ */ t.jsx(Ur, { ...e }) : /* @__PURE__ */ t.jsx("slot", {}), Br = '*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}#cc-webplayer-wrapper{--background: var(--cc-webplayer-background, 0 0% 100%);--foreground: var(--cc-webplayer-foreground, 240 10% 3.9%);--primary: var(--cc-webplayer-primary, 216 100% 52%);--primary-foreground: var( --cc-webplayer-primary-foreground, var(--background) );--primary-light: var(--cc-webplayer-primary-light, var(--primary));--neutral: var(--cc-webplayer-neutral, 0 0% 39%);--neutral-foreground: var( --cc-webplayer-neutral-foreground, var(--foreground) );--radius-ui: var(--cc-webplayer-radius-ui, 1rem);--radius-carrousel: var(--cc-webplayer-radius-carrousel, 0);--radius-gallery: var(--cc-webplayer-radius-gallery, 0)}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.\\!container{width:100%!important}.container{width:100%}@media (min-width: 1280px){.\\!container{max-width:1280px!important}.container{max-width:1280px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.\\!pointer-events-none{pointer-events:none!important}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.invisible{visibility:hidden}.fixed{position:fixed}.\\!absolute{position:absolute!important}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.inset-x-0{left:0;right:0}.inset-x-1{left:.25rem;right:.25rem}.inset-y-1{top:.25rem;bottom:.25rem}.-bottom-1{bottom:-.25rem}.-left-1{left:-.25rem}.-right-1{right:-.25rem}.-top-1{top:-.25rem}.bottom-0{bottom:0}.bottom-1{bottom:.25rem}.left-0{left:0}.left-1{left:.25rem}.left-1\\/2{left:50%}.right-1{right:.25rem}.right-2{right:.5rem}.top-0{top:0}.top-1{top:.25rem}.top-1\\/2{top:50%}.top-2{top:.5rem}.-z-10{z-index:-10}.-z-20{z-index:-20}.z-1{z-index:1}.z-hotspot{z-index:10}.z-overlay{z-index:30}.z-zoomed-image{z-index:20}.col-start-3{grid-column-start:3}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-2{margin-top:.5rem;margin-bottom:.5rem}.-ml-px{margin-left:-1px}.-mt-px{margin-top:-1px}.inline-block{display:inline-block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.aspect-square{aspect-ratio:1 / 1}.aspect-video{aspect-ratio:16 / 9}.size-1{width:.25rem;height:.25rem}.size-12{width:3rem;height:3rem}.size-20{width:5rem;height:5rem}.size-4{width:1rem;height:1rem}.size-5{width:1.25rem;height:1.25rem}.size-8{width:2rem;height:2rem}.size-full{width:100%;height:100%}.h-1{height:.25rem}.h-10{height:2.5rem}.h-3\\/4{height:75%}.h-5{height:1.25rem}.h-8{height:2rem}.h-full{height:100%}.h-px{height:1px}.min-h-0{min-height:0px}.w-12{width:3rem}.w-3\\/5{width:60%}.w-8{width:2rem}.w-\\[calc\\(100\\%\\+1024px\\)\\]{width:calc(100% + 1024px)}.w-\\[calc\\(100\\%\\+2px\\)\\]{width:calc(100% + 2px)}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-px{width:1px}.min-w-0{min-width:0px}.max-w-40{max-width:10rem}.max-w-\\[1600px\\]{max-width:1600px}.shrink-0{flex-shrink:0}.origin-top-left{transform-origin:top left}.-translate-x-1\\.5{--tw-translate-x: -.375rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-1\\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\\.5{--tw-translate-x: .375rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-full{--tw-translate-x: 100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-100{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-105{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes hotspot-ping{0%{transform:scale(0)}25%{opacity:1}75%,to{transform:scale(1.5);opacity:0}}.animate-hotspot-ping{animation:hotspot-ping 3s cubic-bezier(0,0,.2,1) infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-rotation{animation:rotation 1s linear infinite}.cursor-auto{cursor:auto}.cursor-ew-resize{cursor:ew-resize}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.cursor-help{cursor:help}.cursor-move{cursor:move}.cursor-pointer{cursor:pointer}.resize{resize:both}.grid-cols-\\[auto\\,1fr\\,auto\\]{grid-template-columns:auto 1fr auto}.flex-col{flex-direction:column}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.gap-x-4{-moz-column-gap:1rem;column-gap:1rem}.gap-y-1{row-gap:.25rem}.gap-y-2{row-gap:.5rem}.gap-y-4{row-gap:1rem}.space-x-0\\.5>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.125rem * var(--tw-space-x-reverse));margin-left:calc(.125rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-0\\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.125rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.125rem * var(--tw-space-y-reverse))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-scroll{overflow-x:scroll}.text-pretty{text-wrap:pretty}.rounded-carrousel{border-radius:var(--radius-carrousel)}.rounded-full{border-radius:9999px}.rounded-gallery{border-radius:var(--radius-gallery)}.rounded-ui{border-radius:var(--radius-ui)}.rounded-ui-md{border-radius:calc(var(--radius-ui) + .125rem)}.rounded-ui-sm{border-radius:calc(var(--radius-ui) - .125rem)}.rounded-b-none{border-bottom-right-radius:0;border-bottom-left-radius:0}.rounded-t-none{border-top-left-radius:0;border-top-right-radius:0}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-background{border-color:hsl(var(--background))}.border-primary{border-color:hsl(var(--primary))}.border-b-transparent{border-bottom-color:transparent}.bg-background{background-color:hsl(var(--background))}.bg-background\\/25{background-color:hsl(var(--background) / .25)}.bg-background\\/50{background-color:hsl(var(--background) / .5)}.bg-background\\/60{background-color:hsl(var(--background) / .6)}.bg-foreground\\/25{background-color:hsl(var(--foreground) / .25)}.bg-foreground\\/30{background-color:hsl(var(--foreground) / .3)}.bg-foreground\\/35{background-color:hsl(var(--foreground) / .35)}.bg-foreground\\/40{background-color:hsl(var(--foreground) / .4)}.bg-foreground\\/50{background-color:hsl(var(--foreground) / .5)}.bg-foreground\\/60{background-color:hsl(var(--foreground) / .6)}.bg-foreground\\/65{background-color:hsl(var(--foreground) / .65)}.bg-foreground\\/75{background-color:hsl(var(--foreground) / .75)}.bg-neutral\\/50{background-color:hsl(var(--neutral) / .5)}.bg-primary{background-color:hsl(var(--primary))}.bg-primary-foreground{background-color:hsl(var(--primary-foreground))}.bg-primary\\/50{background-color:hsl(var(--primary) / .5)}.bg-transparent{background-color:transparent}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.from-foreground{--tw-gradient-from: hsl(var(--foreground)) var(--tw-gradient-from-position);--tw-gradient-to: hsl(var(--foreground) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.to-transparent{--tw-gradient-to: transparent var(--tw-gradient-to-position)}.object-cover{-o-object-fit:cover;object-fit:cover}.p-0\\.5{padding:.125rem}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.px-1\\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-0\\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.pl-6{padding-left:1.5rem}.pr-12{padding-right:3rem}.pr-4{padding-right:1rem}.pt-8{padding-top:2rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.text-background{color:hsl(var(--background))}.text-background\\/75{color:hsl(var(--background) / .75)}.text-foreground{color:hsl(var(--foreground))}.text-foreground\\/65{color:hsl(var(--foreground) / .65)}.text-neutral-foreground{color:hsl(var(--neutral-foreground))}.text-primary{color:hsl(var(--primary))}.text-primary-foreground{color:hsl(var(--primary-foreground))}.text-primary-light{color:hsl(var(--primary-light))}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\\[width\\]{transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-radius{transition-property:border-radius;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-details{transition-duration:.35s}.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.no-scrollbar::-webkit-scrollbar{display:none}.\\[mask-image\\:linear-gradient\\(to_left\\,transparent_0px\\,black_4px\\,black_calc\\(100\\%-4px\\)\\,transparent_100\\%\\)\\]{-webkit-mask-image:linear-gradient(to left,transparent 0px,black 4px,black calc(100% - 4px),transparent 100%);mask-image:linear-gradient(to left,transparent 0px,black 4px,black calc(100% - 4px),transparent 100%)}.\\*\\:pointer-events-auto>*{pointer-events:auto}.\\*\\:snap-start>*{scroll-snap-align:start}.\\*\\:snap-always>*{scroll-snap-stop:always}.after\\:absolute:after{content:var(--tw-content);position:absolute}.after\\:inset-0:after{content:var(--tw-content);inset:0}.after\\:rounded-gallery:after{content:var(--tw-content);border-radius:var(--radius-gallery)}.after\\:border-2:after{content:var(--tw-content);border-width:2px}.after\\:border-primary:after{content:var(--tw-content);border-color:hsl(var(--primary))}.after\\:opacity-0:after{content:var(--tw-content);opacity:0}.after\\:opacity-100:after{content:var(--tw-content);opacity:1}.after\\:transition-all:after{content:var(--tw-content);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.hover\\:z-hotspot-hover:hover{z-index:11}.hover\\:bg-foreground\\/25:hover{background-color:hsl(var(--foreground) / .25)}.hover\\:bg-primary\\/25:hover{background-color:hsl(var(--primary) / .25)}.hover\\:bg-primary\\/30:hover{background-color:hsl(var(--primary) / .3)}.hover\\:opacity-80:hover{opacity:.8}.hover\\:after\\:opacity-70:hover:after{content:var(--tw-content);opacity:.7}.disabled\\:opacity-60:disabled{opacity:.6}.group:hover .group-hover\\:pointer-events-auto{pointer-events:auto}.group\\/volume:hover .group-hover\\/volume\\:opacity-100{opacity:1}.group\\/volume:hover .group-hover\\/volume\\:opacity-50{opacity:.5}.group:hover .group-hover\\:opacity-100{opacity:1}@media ((orientation: portrait) and (max-width: 767px)) or ((orientation: landscape) and (max-width: 1023px)){.max-small\\:hidden{display:none}}@media ((orientation: portrait) and (min-width: 768px)) or ((orientation: landscape) and (min-width: 1024px)){.small\\:inset-x-2{left:.5rem;right:.5rem}.small\\:inset-y-2{top:.5rem;bottom:.5rem}.small\\:bottom-2{bottom:.5rem}.small\\:left-2{left:.5rem}.small\\:right-2{right:.5rem}.small\\:right-4{right:1rem}.small\\:top-2{top:.5rem}.small\\:top-4{top:1rem}.small\\:my-4{margin-top:1rem;margin-bottom:1rem}.small\\:hidden{display:none}.small\\:h-12{height:3rem}.small\\:max-w-48{max-width:12rem}.small\\:gap-2{gap:.5rem}.small\\:gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.small\\:gap-y-2{row-gap:.5rem}.small\\:gap-y-4{row-gap:1rem}.small\\:space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.small\\:p-3{padding:.75rem}.small\\:px-2{padding-left:.5rem;padding-right:.5rem}.small\\:py-1{padding-top:.25rem;padding-bottom:.25rem}.small\\:pl-8{padding-left:2rem}.small\\:pr-6{padding-right:1.5rem}.small\\:text-base{font-size:1rem;line-height:1.5rem}.small\\:text-sm{font-size:.875rem;line-height:1.25rem}.small\\:font-bold{font-weight:700}}@media (min-width: 1280px){.large\\:h-20{height:5rem}.large\\:h-3\\/5{height:60%}.large\\:max-w-56{max-width:14rem}.large\\:gap-4{gap:1rem}.large\\:p-2{padding:.5rem}.large\\:p-4{padding:1rem}.large\\:text-base{font-size:1rem;line-height:1.5rem}.large\\:text-lg{font-size:1.125rem;line-height:1.75rem}}';
+}, Xr = (e) => bt() ? /* @__PURE__ */ t.jsx(Ur, { ...e }) : /* @__PURE__ */ t.jsx("slot", {}), Br = '*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}#cc-webplayer-wrapper{--background: var(--cc-webplayer-background, 0 0% 100%);--foreground: var(--cc-webplayer-foreground, 240 10% 3.9%);--primary: var(--cc-webplayer-primary, 216 100% 52%);--primary-foreground: var( --cc-webplayer-primary-foreground, var(--background) );--primary-light: var(--cc-webplayer-primary-light, var(--primary));--neutral: var(--cc-webplayer-neutral, 0 0% 39%);--neutral-foreground: var( --cc-webplayer-neutral-foreground, var(--foreground) );--radius-ui: var(--cc-webplayer-radius-ui, 1rem);--radius-carrousel: var(--cc-webplayer-radius-carrousel, 0);--radius-gallery: var(--cc-webplayer-radius-gallery, 0)}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.\\!container{width:100%!important}.container{width:100%}@media (min-width: 1280px){.\\!container{max-width:1280px!important}.container{max-width:1280px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.\\!pointer-events-none{pointer-events:none!important}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.invisible{visibility:hidden}.fixed{position:fixed}.\\!absolute{position:absolute!important}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.inset-x-0{left:0;right:0}.inset-x-1{left:.25rem;right:.25rem}.inset-y-1{top:.25rem;bottom:.25rem}.-bottom-1{bottom:-.25rem}.-left-1{left:-.25rem}.-right-1{right:-.25rem}.-top-1{top:-.25rem}.bottom-0{bottom:0}.bottom-1{bottom:.25rem}.left-0{left:0}.left-1{left:.25rem}.left-1\\/2{left:50%}.right-1{right:.25rem}.right-2{right:.5rem}.top-0{top:0}.top-1{top:.25rem}.top-1\\/2{top:50%}.top-2{top:.5rem}.-z-10{z-index:-10}.-z-20{z-index:-20}.z-1{z-index:1}.z-hotspot{z-index:10}.z-overlay{z-index:30}.z-zoomed-image{z-index:20}.col-start-3{grid-column-start:3}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-2{margin-top:.5rem;margin-bottom:.5rem}.-ml-px{margin-left:-1px}.-mt-px{margin-top:-1px}.inline-block{display:inline-block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.aspect-square{aspect-ratio:1 / 1}.size-1{width:.25rem;height:.25rem}.size-12{width:3rem;height:3rem}.size-20{width:5rem;height:5rem}.size-4{width:1rem;height:1rem}.size-5{width:1.25rem;height:1.25rem}.size-8{width:2rem;height:2rem}.size-full{width:100%;height:100%}.h-1{height:.25rem}.h-10{height:2.5rem}.h-20{height:5rem}.h-3\\/4{height:75%}.h-5{height:1.25rem}.h-8{height:2rem}.h-full{height:100%}.h-px{height:1px}.min-h-0{min-height:0px}.w-12{width:3rem}.w-3\\/5{width:60%}.w-8{width:2rem}.w-\\[calc\\(100\\%\\+1024px\\)\\]{width:calc(100% + 1024px)}.w-\\[calc\\(100\\%\\+2px\\)\\]{width:calc(100% + 2px)}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-px{width:1px}.min-w-0{min-width:0px}.max-w-40{max-width:10rem}.max-w-\\[1600px\\]{max-width:1600px}.shrink-0{flex-shrink:0}.origin-top-left{transform-origin:top left}.-translate-x-1\\.5{--tw-translate-x: -.375rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-1\\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\\.5{--tw-translate-x: .375rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-full{--tw-translate-x: 100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-100{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-105{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes hotspot-ping{0%{transform:scale(0)}25%{opacity:1}75%,to{transform:scale(1.5);opacity:0}}.animate-hotspot-ping{animation:hotspot-ping 3s cubic-bezier(0,0,.2,1) infinite}@keyframes pulse{50%{opacity:1}0%,to{opacity:0}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-rotation{animation:rotation 1s linear infinite}.cursor-auto{cursor:auto}.cursor-ew-resize{cursor:ew-resize}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.cursor-help{cursor:help}.cursor-move{cursor:move}.cursor-pointer{cursor:pointer}.resize{resize:both}.grid-cols-\\[auto\\,1fr\\,auto\\]{grid-template-columns:auto 1fr auto}.flex-col{flex-direction:column}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.gap-x-4{-moz-column-gap:1rem;column-gap:1rem}.gap-y-1{row-gap:.25rem}.gap-y-2{row-gap:.5rem}.gap-y-4{row-gap:1rem}.space-x-0\\.5>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.125rem * var(--tw-space-x-reverse));margin-left:calc(.125rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-0\\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.125rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.125rem * var(--tw-space-y-reverse))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-scroll{overflow-x:scroll}.text-pretty{text-wrap:pretty}.rounded-carrousel{border-radius:var(--radius-carrousel)}.rounded-full{border-radius:9999px}.rounded-gallery{border-radius:var(--radius-gallery)}.rounded-ui{border-radius:var(--radius-ui)}.rounded-ui-md{border-radius:calc(var(--radius-ui) + .125rem)}.rounded-ui-sm{border-radius:calc(var(--radius-ui) - .125rem)}.rounded-b-none{border-bottom-right-radius:0;border-bottom-left-radius:0}.rounded-t-none{border-top-left-radius:0;border-top-right-radius:0}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-background{border-color:hsl(var(--background))}.border-foreground{border-color:hsl(var(--foreground))}.border-primary{border-color:hsl(var(--primary))}.border-b-transparent{border-bottom-color:transparent}.bg-background{background-color:hsl(var(--background))}.bg-background\\/25{background-color:hsl(var(--background) / .25)}.bg-background\\/50{background-color:hsl(var(--background) / .5)}.bg-background\\/60{background-color:hsl(var(--background) / .6)}.bg-foreground\\/25{background-color:hsl(var(--foreground) / .25)}.bg-foreground\\/30{background-color:hsl(var(--foreground) / .3)}.bg-foreground\\/35{background-color:hsl(var(--foreground) / .35)}.bg-foreground\\/40{background-color:hsl(var(--foreground) / .4)}.bg-foreground\\/50{background-color:hsl(var(--foreground) / .5)}.bg-foreground\\/60{background-color:hsl(var(--foreground) / .6)}.bg-foreground\\/65{background-color:hsl(var(--foreground) / .65)}.bg-foreground\\/75{background-color:hsl(var(--foreground) / .75)}.bg-neutral\\/50{background-color:hsl(var(--neutral) / .5)}.bg-primary{background-color:hsl(var(--primary))}.bg-primary-foreground{background-color:hsl(var(--primary-foreground))}.bg-primary\\/50{background-color:hsl(var(--primary) / .5)}.bg-transparent{background-color:transparent}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.from-foreground{--tw-gradient-from: hsl(var(--foreground)) var(--tw-gradient-from-position);--tw-gradient-to: hsl(var(--foreground) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.to-transparent{--tw-gradient-to: transparent var(--tw-gradient-to-position)}.object-cover{-o-object-fit:cover;object-fit:cover}.p-0\\.5{padding:.125rem}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.px-1\\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-0\\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.pl-6{padding-left:1.5rem}.pr-12{padding-right:3rem}.pr-4{padding-right:1rem}.pt-8{padding-top:2rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.text-background{color:hsl(var(--background))}.text-background\\/75{color:hsl(var(--background) / .75)}.text-foreground{color:hsl(var(--foreground))}.text-foreground\\/65{color:hsl(var(--foreground) / .65)}.text-foreground\\/70{color:hsl(var(--foreground) / .7)}.text-neutral-foreground{color:hsl(var(--neutral-foreground))}.text-primary{color:hsl(var(--primary))}.text-primary-foreground{color:hsl(var(--primary-foreground))}.text-primary-light{color:hsl(var(--primary-light))}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\\[width\\]{transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-radius{transition-property:border-radius;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-details{transition-duration:.35s}.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.no-scrollbar::-webkit-scrollbar{display:none}.\\[mask-image\\:linear-gradient\\(to_left\\,transparent_0px\\,black_4px\\,black_calc\\(100\\%-4px\\)\\,transparent_100\\%\\)\\]{-webkit-mask-image:linear-gradient(to left,transparent 0px,black 4px,black calc(100% - 4px),transparent 100%);mask-image:linear-gradient(to left,transparent 0px,black 4px,black calc(100% - 4px),transparent 100%)}.\\*\\:pointer-events-auto>*{pointer-events:auto}.\\*\\:snap-start>*{scroll-snap-align:start}.\\*\\:snap-always>*{scroll-snap-stop:always}.after\\:absolute:after{content:var(--tw-content);position:absolute}.after\\:inset-0:after{content:var(--tw-content);inset:0}.after\\:rounded-gallery:after{content:var(--tw-content);border-radius:var(--radius-gallery)}.after\\:border-2:after{content:var(--tw-content);border-width:2px}.after\\:border-primary:after{content:var(--tw-content);border-color:hsl(var(--primary))}.after\\:opacity-0:after{content:var(--tw-content);opacity:0}.after\\:opacity-100:after{content:var(--tw-content);opacity:1}.after\\:transition-all:after{content:var(--tw-content);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.hover\\:z-hotspot-hover:hover{z-index:11}.hover\\:bg-foreground\\/25:hover{background-color:hsl(var(--foreground) / .25)}.hover\\:bg-primary\\/25:hover{background-color:hsl(var(--primary) / .25)}.hover\\:bg-primary\\/30:hover{background-color:hsl(var(--primary) / .3)}.hover\\:opacity-80:hover{opacity:.8}.hover\\:after\\:opacity-70:hover:after{content:var(--tw-content);opacity:.7}.disabled\\:opacity-60:disabled{opacity:.6}.group:hover .group-hover\\:pointer-events-auto{pointer-events:auto}.group\\/volume:hover .group-hover\\/volume\\:opacity-100{opacity:1}.group\\/volume:hover .group-hover\\/volume\\:opacity-50{opacity:.5}.group:hover .group-hover\\:opacity-100{opacity:1}@media ((orientation: portrait) and (max-width: 767px)) or ((orientation: landscape) and (max-width: 1023px)){.max-small\\:hidden{display:none}}@media ((orientation: portrait) and (min-width: 768px)) or ((orientation: landscape) and (min-width: 1024px)){.small\\:inset-x-2{left:.5rem;right:.5rem}.small\\:inset-y-2{top:.5rem;bottom:.5rem}.small\\:bottom-2{bottom:.5rem}.small\\:left-2{left:.5rem}.small\\:right-2{right:.5rem}.small\\:right-4{right:1rem}.small\\:top-2{top:.5rem}.small\\:top-4{top:1rem}.small\\:my-4{margin-top:1rem;margin-bottom:1rem}.small\\:hidden{display:none}.small\\:h-12{height:3rem}.small\\:h-28{height:7rem}.small\\:max-w-48{max-width:12rem}.small\\:gap-2{gap:.5rem}.small\\:gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.small\\:gap-y-2{row-gap:.5rem}.small\\:gap-y-4{row-gap:1rem}.small\\:space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.small\\:p-3{padding:.75rem}.small\\:px-2{padding-left:.5rem;padding-right:.5rem}.small\\:py-1{padding-top:.25rem;padding-bottom:.25rem}.small\\:pl-8{padding-left:2rem}.small\\:pr-6{padding-right:1.5rem}.small\\:text-base{font-size:1rem;line-height:1.5rem}.small\\:text-sm{font-size:.875rem;line-height:1.25rem}.small\\:font-bold{font-weight:700}}@media (min-width: 1280px){.large\\:h-20{height:5rem}.large\\:h-3\\/5{height:60%}.large\\:max-w-56{max-width:14rem}.large\\:gap-4{gap:1rem}.large\\:p-2{padding:.5rem}.large\\:p-4{padding:1rem}.large\\:text-base{font-size:1rem;line-height:1.5rem}.large\\:text-lg{font-size:1.125rem;line-height:1.75rem}}';
 var zt = { exports: {} }, we = {};
 /**
  * @license React
@@ -2634,10 +2660,10 @@ var Je;
 function Gr() {
   if (Je) return we;
   Je = 1;
-  var e = ye, r = Symbol.for("react.element"), n = Symbol.for("react.fragment"), o = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, u = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function l(i, s, y) {
+  var e = be, r = Symbol.for("react.element"), n = Symbol.for("react.fragment"), o = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, u = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function l(i, s, b) {
     var c, m = {}, g = null, _ = null;
-    y !== void 0 && (g = "" + y), s.key !== void 0 && (g = "" + s.key), s.ref !== void 0 && (_ = s.ref);
+    b !== void 0 && (g = "" + b), s.key !== void 0 && (g = "" + s.key), s.ref !== void 0 && (_ = s.ref);
     for (c in s) o.call(s, c) && !u.hasOwnProperty(c) && (m[c] = s[c]);
     if (i && i.defaultProps) for (c in s = i.defaultProps, s) m[c] === void 0 && (m[c] = s[c]);
     return { $$typeof: r, type: i, key: g, ref: _, props: m, _owner: a.current };
@@ -2645,7 +2671,7 @@ function Gr() {
   return we.Fragment = n, we.jsx = l, we.jsxs = l, we;
 }
 zt.exports = Gr();
-var je = zt.exports, Kr = Object.defineProperty, qr = (e, r, n) => r in e ? Kr(e, r, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[r] = n, Ce = (e, r, n) => (qr(e, typeof r != "symbol" ? r + "" : r, n), n);
+var je = zt.exports, qr = Object.defineProperty, Kr = (e, r, n) => r in e ? qr(e, r, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[r] = n, Ce = (e, r, n) => (Kr(e, typeof r != "symbol" ? r + "" : r, n), n);
 const Jr = {
   stringify: (e) => e,
   parse: (e) => e
@@ -2682,15 +2708,15 @@ function nn(e) {
     (r, n, o) => `${n}-${o.toLowerCase()}`
   );
 }
-const ke = Symbol.for("r2wc.render"), Ee = Symbol.for("r2wc.connected"), se = Symbol.for("r2wc.context"), te = Symbol.for("r2wc.props");
+const ke = Symbol.for("r2wc.render"), Ne = Symbol.for("r2wc.connected"), se = Symbol.for("r2wc.context"), te = Symbol.for("r2wc.props");
 function on(e, r, n) {
   var o, a, u;
   r.props || (r.props = e.propTypes ? Object.keys(e.propTypes) : []);
-  const l = Array.isArray(r.props) ? r.props.slice() : Object.keys(r.props), i = {}, s = {}, y = {};
+  const l = Array.isArray(r.props) ? r.props.slice() : Object.keys(r.props), i = {}, s = {}, b = {};
   for (const m of l) {
     i[m] = Array.isArray(r.props) ? "string" : r.props[m];
     const g = nn(m);
-    s[m] = g, y[g] = m;
+    s[m] = g, b[g] = m;
   }
   class c extends HTMLElement {
     constructor() {
@@ -2698,25 +2724,25 @@ function on(e, r, n) {
         mode: r.shadow
       }) : this.container = this, this[te].container = this.container;
       for (const g of l) {
-        const _ = s[g], w = this.getAttribute(_), x = i[g], E = x ? Re[x] : null;
-        E != null && E.parse && w && (this[te][g] = E.parse(w, _, this));
+        const _ = s[g], w = this.getAttribute(_), x = i[g], N = x ? Re[x] : null;
+        N != null && N.parse && w && (this[te][g] = N.parse(w, _, this));
       }
     }
     static get observedAttributes() {
-      return Object.keys(y);
+      return Object.keys(b);
     }
     connectedCallback() {
-      this[Ee] = !0, this[ke]();
+      this[Ne] = !0, this[ke]();
     }
     disconnectedCallback() {
-      this[Ee] = !1, this[se] && n.unmount(this[se]), delete this[se];
+      this[Ne] = !1, this[se] && n.unmount(this[se]), delete this[se];
     }
     attributeChangedCallback(g, _, w) {
-      const x = y[g], E = i[x], C = E ? Re[E] : null;
+      const x = b[g], N = i[x], C = N ? Re[N] : null;
       x in i && C != null && C.parse && w && (this[te][x] = C.parse(w, g, this), this[ke]());
     }
-    [(o = Ee, a = se, u = te, ke)]() {
-      this[Ee] && (this[se] ? n.update(this[se], this[te]) : this[se] = n.mount(
+    [(o = Ne, a = se, u = te, ke)]() {
+      this[Ne] && (this[se] ? n.update(this[se], this[te]) : this[se] = n.mount(
         this.container,
         e,
         this[te]
@@ -2735,8 +2761,8 @@ function on(e, r, n) {
         this[te][m] = w;
         const x = _ ? Re[_] : null;
         if (x != null && x.stringify) {
-          const E = x.stringify(w, g, this);
-          this.getAttribute(g) !== E && this.setAttribute(g, E);
+          const N = x.stringify(w, g, this);
+          this.getAttribute(g) !== N && this.setAttribute(g, N);
         } else
           this[ke]();
       }
@@ -2745,14 +2771,14 @@ function on(e, r, n) {
   return c;
 }
 function sn(e, r, n) {
-  const o = Pt(e), a = ye.createElement(r, n);
+  const o = Pt(e), a = be.createElement(r, n);
   return o.render(a), {
     root: o,
     ReactComponent: r
   };
 }
 function an({ root: e, ReactComponent: r }, n) {
-  const o = ye.createElement(r, n);
+  const o = be.createElement(r, n);
   e.render(o);
 }
 function ln({ root: e }) {
@@ -2775,7 +2801,7 @@ function dn(e) {
 }
 const un = (e) => /* @__PURE__ */ je.jsxs(je.Fragment, { children: [
   /* @__PURE__ */ je.jsx("style", { children: Br }),
-  /* @__PURE__ */ je.jsx($r, { ...e })
+  /* @__PURE__ */ je.jsx(Wr, { ...e })
 ] }), mn = It(un, {
   shadow: "open",
   props: {
@@ -2798,16 +2824,16 @@ const un = (e) => /* @__PURE__ */ je.jsxs(je.Fragment, { children: [
   }
 });
 function gn() {
-  return !!customElements.get(Fe) && !!customElements.get(Ae);
+  return !!customElements.get(Ze) && !!customElements.get(Ae);
 }
 function fn() {
-  customElements.define(Fe, mn), customElements.define(Ae, hn);
+  customElements.define(Ze, mn), customElements.define(Ae, hn);
 }
 function Mt() {
   gn() || fn();
 }
 Mt();
-const yn = ({
+const bn = ({
   onCompositionLoading: e,
   onCompositionLoaded: r,
   onCompositionLoadError: n,
@@ -2817,11 +2843,11 @@ const yn = ({
   onHotspotsOff: l,
   onGalleryOpen: i,
   onGalleryClose: s,
-  ...y
+  ...b
 }) => {
-  const c = pn(y);
-  return F(() => {
-    const m = y.eventPrefix ?? dt, g = (x) => `${m}${x}`, _ = {
+  const c = pn(b);
+  return Z(() => {
+    const m = b.eventPrefix ?? dt, g = (x) => `${m}${x}`, _ = {
       [tt]: e,
       [rt]: r,
       [nt]: n,
@@ -2832,18 +2858,18 @@ const yn = ({
       [lt]: i,
       [ct]: s
     }, w = /* @__PURE__ */ new Map();
-    return Object.entries(_).forEach(([x, E]) => {
-      if (!E)
+    return Object.entries(_).forEach(([x, N]) => {
+      if (!N)
         return;
-      const C = g(x), z = (f) => E(f.detail);
+      const C = g(x), z = (f) => N(f.detail);
       w.set(C, z), document.addEventListener(C, z);
     }), () => {
-      w.forEach((x, E) => {
-        document.removeEventListener(E, x);
+      w.forEach((x, N) => {
+        document.removeEventListener(N, x);
       });
     };
   }, [
-    y.eventPrefix,
+    b.eventPrefix,
     e,
     r,
     n,
@@ -2856,7 +2882,7 @@ const yn = ({
   ]), /* @__PURE__ */ et.jsx("cc-webplayer", { ...c });
 };
 Mt();
-const bn = ({ name: e, color: r }) => /* @__PURE__ */ et.jsx("cc-webplayer-icon", { name: e, color: r });
+const yn = ({ name: e, color: r }) => /* @__PURE__ */ et.jsx("cc-webplayer-icon", { name: e, color: r });
 export {
   dt as DEFAULT_EVENT_PREFIX,
   rt as EVENT_COMPOSITION_LOADED,
@@ -2869,8 +2895,8 @@ export {
   it as EVENT_HOTSPOTS_OFF,
   at as EVENT_HOTSPOTS_ON,
   Ae as WEB_PLAYER_ICON_WC_TAG,
-  Fe as WEB_PLAYER_WC_TAG,
-  yn as WebPlayer,
-  bn as WebPlayerIcon,
+  Ze as WEB_PLAYER_WC_TAG,
+  bn as WebPlayer,
+  yn as WebPlayerIcon,
   wn as generateCompositionUrl
 };