cyberui-2045 2.1.1 → 2.3.0

package/dist/index.es.js

@@ -1,5 +1,5 @@
-import Ee, { useCallback as D, useState as X, useEffect as ae, useRef as te, useId as Fe, memo as $e, useMemo as be, createContext as lt, useContext as it } from "react";
-import { createPortal as Be } from "react-dom";
+import Ee, { useCallback as D, useState as Z, useEffect as oe, useRef as te, useId as Be, memo as _e, useMemo as pe, createContext as lt, useContext as it } from "react";
+import { createPortal as Fe } from "react-dom";
 var ve = { exports: {} }, he = {};
 /**
  * @license React
@@ -48,38 +48,38 @@ function dt() {
     function e(o) {
       if (o == null) return null;
       if (typeof o == "function")
-        return o.$$typeof === U ? null : o.displayName || o.name || null;
+        return o.$$typeof === V ? null : o.displayName || o.name || null;
       if (typeof o == "string") return o;
       switch (o) {
-        case y:
+        case x:
           return "Fragment";
         case A:
           return "Profiler";
-        case w:
+        case v:
           return "StrictMode";
-        case k:
+        case C:
           return "Suspense";
-        case L:
-          return "SuspenseList";
         case z:
+          return "SuspenseList";
+        case M:
           return "Activity";
       }
       if (typeof o == "object")
         switch (typeof o.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
         ), o.$$typeof) {
-          case v:
+          case w:
             return "Portal";
-          case _:
+          case T:
             return (o.displayName || "Context") + ".Provider";
-          case C:
+          case N:
             return (o._context.displayName || "Context") + ".Consumer";
-          case $:
+          case _:
             var u = o.render;
             return o = o.displayName, o || (o = u.displayName || u.name || "", o = o !== "" ? "ForwardRef(" + o + ")" : "ForwardRef"), o;
           case G:
             return u = o.displayName || null, u !== null ? u : e(o.type) || "Memo";
-          case h:
+          case f:
             u = o._payload, o = o._init;
             try {
               return e(o(u));
@@ -100,8 +100,8 @@ function dt() {
       }
       if (u) {
         u = console;
-        var f = u.error, R = typeof Symbol == "function" && Symbol.toStringTag && o[Symbol.toStringTag] || o.constructor.name || "Object";
-        return f.call(
+        var b = u.error, R = typeof Symbol == "function" && Symbol.toStringTag && o[Symbol.toStringTag] || o.constructor.name || "Object";
+        return b.call(
           u,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
           R
@@ -109,8 +109,8 @@ function dt() {
       }
     }
     function s(o) {
-      if (o === y) return "<>";
-      if (typeof o == "object" && o !== null && o.$$typeof === h)
+      if (o === x) return "<>";
+      if (typeof o == "object" && o !== null && o.$$typeof === f)
         return "<...>";
       try {
         var u = e(o);
@@ -120,7 +120,7 @@ function dt() {
       }
     }
     function n() {
-      var o = q.A;
+      var o = X.A;
       return o === null ? null : o.getOwner();
     }
     function c() {
@@ -134,31 +134,31 @@ function dt() {
       return o.key !== void 0;
     }
     function i(o, u) {
-      function f() {
-        B || (B = !0, console.error(
+      function b() {
+        F || (F = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
           u
         ));
       }
-      f.isReactWarning = !0, Object.defineProperty(o, "key", {
-        get: f,
+      b.isReactWarning = !0, Object.defineProperty(o, "key", {
+        get: b,
         configurable: !0
       });
     }
     function d() {
       var o = e(this.type);
-      return H[o] || (H[o] = !0, console.error(
+      return U[o] || (U[o] = !0, console.error(
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), o = this.props.ref, o !== void 0 ? o : null;
     }
-    function x(o, u, f, R, S, E, O, W) {
-      return f = E.ref, o = {
-        $$typeof: p,
+    function g(o, u, b, R, S, E, I, W) {
+      return b = E.ref, o = {
+        $$typeof: h,
         type: o,
         key: u,
         props: E,
         _owner: S
-      }, (f !== void 0 ? f : null) !== null ? Object.defineProperty(o, "ref", {
+      }, (b !== void 0 ? b : null) !== null ? Object.defineProperty(o, "ref", {
         enumerable: !1,
         get: d
       }) : Object.defineProperty(o, "ref", { enumerable: !1, value: null }), o._store = {}, Object.defineProperty(o._store, "validated", {
@@ -175,7 +175,7 @@ function dt() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: O
+        value: I
       }), Object.defineProperty(o, "_debugTask", {
         configurable: !1,
         enumerable: !1,
@@ -183,25 +183,25 @@ function dt() {
         value: W
       }), Object.freeze && (Object.freeze(o.props), Object.freeze(o)), o;
     }
-    function b(o, u, f, R, S, E, O, W) {
-      var I = u.children;
-      if (I !== void 0)
+    function m(o, u, b, R, S, E, I, W) {
+      var O = u.children;
+      if (O !== void 0)
         if (R)
-          if (re(I)) {
-            for (R = 0; R < I.length; R++)
-              g(I[R]);
-            Object.freeze && Object.freeze(I);
+          if (re(O)) {
+            for (R = 0; R < O.length; R++)
+              y(O[R]);
+            Object.freeze && Object.freeze(O);
           } else
             console.error(
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
-        else g(I);
+        else y(O);
       if (Q.call(u, "key")) {
-        I = e(o);
-        var M = Object.keys(u).filter(function(se) {
+        O = e(o);
+        var L = Object.keys(u).filter(function(se) {
           return se !== "key";
         });
-        R = 0 < M.length ? "{key: someKey, " + M.join(": ..., ") + ": ...}" : "{key: someKey}", K[I + R] || (M = 0 < M.length ? "{" + M.join(": ..., ") + ": ...}" : "{}", console.error(
+        R = 0 < L.length ? "{key: someKey, " + L.join(": ..., ") + ": ...}" : "{key: someKey}", K[O + R] || (L = 0 < L.length ? "{" + L.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
@@ -209,67 +209,67 @@ React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
           R,
-          I,
-          M,
-          I
-        ), K[I + R] = !0);
+          O,
+          L,
+          O
+        ), K[O + R] = !0);
       }
-      if (I = null, f !== void 0 && (a(f), I = "" + f), l(u) && (a(u.key), I = "" + u.key), "key" in u) {
-        f = {};
-        for (var F in u)
-          F !== "key" && (f[F] = u[F]);
-      } else f = u;
-      return I && i(
-        f,
+      if (O = null, b !== void 0 && (a(b), O = "" + b), l(u) && (a(u.key), O = "" + u.key), "key" in u) {
+        b = {};
+        for (var B in u)
+          B !== "key" && (b[B] = u[B]);
+      } else b = u;
+      return O && i(
+        b,
         typeof o == "function" ? o.displayName || o.name || "Unknown" : o
-      ), x(
+      ), g(
         o,
-        I,
+        O,
         E,
         S,
         n(),
-        f,
-        O,
+        b,
+        I,
         W
       );
     }
-    function g(o) {
-      typeof o == "object" && o !== null && o.$$typeof === p && o._store && (o._store.validated = 1);
+    function y(o) {
+      typeof o == "object" && o !== null && o.$$typeof === h && o._store && (o._store.validated = 1);
     }
-    var m = Ee, p = Symbol.for("react.transitional.element"), v = Symbol.for("react.portal"), y = Symbol.for("react.fragment"), w = Symbol.for("react.strict_mode"), A = Symbol.for("react.profiler"), C = Symbol.for("react.consumer"), _ = Symbol.for("react.context"), $ = Symbol.for("react.forward_ref"), k = Symbol.for("react.suspense"), L = Symbol.for("react.suspense_list"), G = Symbol.for("react.memo"), h = Symbol.for("react.lazy"), z = Symbol.for("react.activity"), U = Symbol.for("react.client.reference"), q = m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Q = Object.prototype.hasOwnProperty, re = Array.isArray, ee = console.createTask ? console.createTask : function() {
+    var p = Ee, h = Symbol.for("react.transitional.element"), w = Symbol.for("react.portal"), x = Symbol.for("react.fragment"), v = Symbol.for("react.strict_mode"), A = Symbol.for("react.profiler"), N = Symbol.for("react.consumer"), T = Symbol.for("react.context"), _ = Symbol.for("react.forward_ref"), C = Symbol.for("react.suspense"), z = Symbol.for("react.suspense_list"), G = Symbol.for("react.memo"), f = Symbol.for("react.lazy"), M = Symbol.for("react.activity"), V = Symbol.for("react.client.reference"), X = p.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Q = Object.prototype.hasOwnProperty, re = Array.isArray, ee = console.createTask ? console.createTask : function() {
       return null;
     };
-    m = {
+    p = {
       react_stack_bottom_frame: function(o) {
         return o();
       }
     };
-    var B, H = {}, Z = m.react_stack_bottom_frame.bind(
-      m,
+    var F, U = {}, q = p.react_stack_bottom_frame.bind(
+      p,
       c
     )(), Y = ee(s(c)), K = {};
-    ge.Fragment = y, ge.jsx = function(o, u, f, R, S) {
-      var E = 1e4 > q.recentlyCreatedOwnerStacks++;
-      return b(
+    ge.Fragment = x, ge.jsx = function(o, u, b, R, S) {
+      var E = 1e4 > X.recentlyCreatedOwnerStacks++;
+      return m(
         o,
         u,
-        f,
+        b,
         !1,
         R,
         S,
-        E ? Error("react-stack-top-frame") : Z,
+        E ? Error("react-stack-top-frame") : q,
         E ? ee(s(o)) : Y
       );
-    }, ge.jsxs = function(o, u, f, R, S) {
-      var E = 1e4 > q.recentlyCreatedOwnerStacks++;
-      return b(
+    }, ge.jsxs = function(o, u, b, R, S) {
+      var E = 1e4 > X.recentlyCreatedOwnerStacks++;
+      return m(
         o,
         u,
-        f,
+        b,
         !0,
         R,
         S,
-        E ? Error("react-stack-top-frame") : Z,
+        E ? Error("react-stack-top-frame") : q,
         E ? ee(s(o)) : Y
       );
     };
@@ -280,8 +280,8 @@ function ut() {
   return Le || (Le = 1, process.env.NODE_ENV === "production" ? ve.exports = ct() : ve.exports = dt()), ve.exports;
 }
 var t = ut();
-const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
-  if (!Te(e))
+const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
+  if (!$e(e))
     return r[e] || "";
   const a = [];
   if (e.base && r[e.base] && a.push(r[e.base]), e.sm && r[e.sm]) {
@@ -305,7 +305,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
     a.push(...s);
   }
   return a.join(" ");
-}, pr = (...e) => e.filter(Boolean).join(" "), oe = {
+}, vr = (...e) => e.filter(Boolean).join(" "), ae = {
   button: {
     sm: "py-1 px-4 text-sm",
     md: "py-2 px-6 text-lg",
@@ -366,7 +366,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   xl: 1280,
   "2xl": 1536
 }, ft = (e, r, a) => {
-  if (!Te(e))
+  if (!$e(e))
     return e ?? a;
   let s = e.base ?? a;
   const n = ["sm", "md", "lg", "xl", "2xl"];
@@ -379,16 +379,16 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   const a = D(
     () => typeof window > "u" ? r : ft(e, window.innerWidth, r),
     [r, e]
-  ), [s, n] = X(a);
-  return ae(() => {
-    if (!Te(e)) {
+  ), [s, n] = Z(a);
+  return oe(() => {
+    if (!$e(e)) {
       n(e ?? r);
       return;
     }
     const c = () => n(a());
     return c(), window.addEventListener("resize", c), () => window.removeEventListener("resize", c);
   }, [r, a, e]), s;
-}, bt = ({
+}, pt = ({
   tabs: e,
   activeTab: r,
   onTabChange: a,
@@ -398,75 +398,75 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   menuClassName: l = "",
   menuItemClassName: i = "",
   dropdownLabel: d,
-  anchorIcon: x,
-  showAnchorLabel: b = !0,
-  anchorAriaLabel: g,
-  closeOnSelect: m = !0
+  anchorIcon: g,
+  showAnchorLabel: m = !0,
+  anchorAriaLabel: y,
+  closeOnSelect: p = !0
 }) => {
-  const [p, v] = X(!1), [y, w] = X(!1), [A, C] = X(!1), [_, $] = X(!1), k = te(null), L = te(null);
-  ae(() => {
-    if (!p) return;
-    const h = (z) => {
-      k.current && !k.current.contains(z.target) && (C(!0), setTimeout(() => {
-        v(!1), C(!1);
+  const [h, w] = Z(!1), [x, v] = Z(!1), [A, N] = Z(!1), [T, _] = Z(!1), C = te(null), z = te(null);
+  oe(() => {
+    if (!h) return;
+    const f = (M) => {
+      C.current && !C.current.contains(M.target) && (N(!0), setTimeout(() => {
+        w(!1), N(!1);
       }, 180));
     };
-    return document.addEventListener("mousedown", h), () => document.removeEventListener("mousedown", h);
-  }, [p]), ae(() => {
-    if (!p) return;
-    const h = L.current;
+    return document.addEventListener("mousedown", f), () => document.removeEventListener("mousedown", f);
+  }, [h]), oe(() => {
     if (!h) return;
-    const z = h.getBoundingClientRect();
-    $(z.right > window.innerWidth);
-  }, [p]);
+    const f = z.current;
+    if (!f) return;
+    const M = f.getBoundingClientRect();
+    _(M.right > window.innerWidth);
+  }, [h]);
   const G = () => {
-    p ? (C(!0), setTimeout(() => {
-      v(!1), C(!1);
-    }, 180)) : (w(!0), v(!0), setTimeout(() => w(!1), 30));
+    h ? (N(!0), setTimeout(() => {
+      w(!1), N(!1);
+    }, 180)) : (v(!0), w(!0), setTimeout(() => v(!1), 30));
   };
-  return /* @__PURE__ */ t.jsx("div", { className: `${n}`, children: /* @__PURE__ */ t.jsxs("div", { ref: k, className: "relative inline-block", children: [
+  return /* @__PURE__ */ t.jsx("div", { className: `${n}`, children: /* @__PURE__ */ t.jsxs("div", { ref: C, className: "relative inline-block", children: [
     /* @__PURE__ */ t.jsxs(
       "button",
       {
         onClick: G,
         className: `inline-flex items-center gap-2 ${s} bg-surface text-default border-2 border-border-default rounded-lg transition-all duration-300 hover:text-secondary hover:border-secondary hover:cursor-pointer shadow-secondary/30 ${c}`,
         "aria-haspopup": "menu",
-        "aria-expanded": p,
-        "aria-label": b ? void 0 : g ?? (typeof d == "string" ? d : "Open tabs"),
+        "aria-expanded": h,
+        "aria-label": m ? void 0 : y ?? (typeof d == "string" ? d : "Open tabs"),
         children: [
-          x ?? /* @__PURE__ */ t.jsxs("svg", { className: "w-5 h-5", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: [
+          g ?? /* @__PURE__ */ t.jsxs("svg", { className: "w-5 h-5", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: [
             /* @__PURE__ */ t.jsx("rect", { x: "3", y: "5", width: "14", height: "2", rx: "1" }),
             /* @__PURE__ */ t.jsx("rect", { x: "3", y: "9", width: "14", height: "2", rx: "1" }),
             /* @__PURE__ */ t.jsx("rect", { x: "3", y: "13", width: "14", height: "2", rx: "1" })
           ] }),
-          b && /* @__PURE__ */ t.jsx("span", { children: d ?? r })
+          m && /* @__PURE__ */ t.jsx("span", { children: d ?? r })
         ]
       }
     ),
-    (p || A) && /* @__PURE__ */ t.jsx(
+    (h || A) && /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: L,
-        "aria-hidden": !p,
-        className: `absolute ${_ ? "right-0" : "left-0"} mt-2 min-w-40 z-50 bg-surface border-2 border-border-default rounded-lg shadow-secondary overflow-hidden ${l}
-              transition-transform transition-opacity duration-200 ease-[cubic-bezier(.2,0,0,1)] transform-gpu origin-top will-change-transform will-change-opacity ${y || A ? "opacity-0 scale-y-0 pointer-events-none" : "opacity-100 scale-y-100 pointer-events-auto"}`,
-        children: /* @__PURE__ */ t.jsx("div", { className: "py-1", children: e.map((h) => /* @__PURE__ */ t.jsx(
+        ref: z,
+        "aria-hidden": !h,
+        className: `absolute ${T ? "right-0" : "left-0"} mt-2 min-w-40 z-50 bg-surface border-2 border-border-default rounded-lg shadow-secondary overflow-hidden ${l}
+              transition-transform transition-opacity duration-200 ease-[cubic-bezier(.2,0,0,1)] transform-gpu origin-top will-change-transform will-change-opacity ${x || A ? "opacity-0 scale-y-0 pointer-events-none" : "opacity-100 scale-y-100 pointer-events-auto"}`,
+        children: /* @__PURE__ */ t.jsx("div", { className: "py-1", children: e.map((f) => /* @__PURE__ */ t.jsx(
           "button",
           {
             onClick: () => {
-              a(h), m && (C(!0), setTimeout(() => {
-                v(!1), C(!1);
+              a(f), p && (N(!0), setTimeout(() => {
+                w(!1), N(!1);
               }, 180));
             },
-            className: `w-full flex items-center justify-between text-left px-4 py-2 font-bold transition-colors duration-200 outline-none hover:cursor-pointer ${r === h ? "text-secondary relative pl-4 before:content-[''] before:h-full before:absolute before:left-0 before:top-1/2 before:-translate-y-1/2 before:h-4 before:w-[3px] before:rounded before:bg-accent before:shadow-lg-accent" : "text-default hover:text-secondary hover:bg-base/70"} ${i}`,
-            children: /* @__PURE__ */ t.jsx("span", { children: h })
+            className: `w-full flex items-center justify-between text-left px-4 py-2 font-bold transition-colors duration-200 outline-none hover:cursor-pointer ${r === f ? "text-secondary relative pl-4 before:content-[''] before:h-full before:absolute before:left-0 before:top-1/2 before:-translate-y-1/2 before:h-4 before:w-[3px] before:rounded before:bg-accent before:shadow-lg-accent" : "text-default hover:text-secondary hover:bg-base/70"} ${i}`,
+            children: /* @__PURE__ */ t.jsx("span", { children: f })
           },
-          h
+          f
         )) })
       }
     )
   ] }) });
-}, hr = ({
+}, wr = ({
   tabs: e,
   activeTab: r,
   onTabChange: a,
@@ -476,14 +476,14 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   tabsClassName: l = "",
   dropdownLabel: i,
   anchorIcon: d,
-  showAnchorLabel: x = !0,
-  anchorAriaLabel: b,
-  closeOnSelect: g = !0,
-  anchorClassName: m = "",
-  menuClassName: p = "",
-  menuItemClassName: v = ""
+  showAnchorLabel: g = !0,
+  anchorAriaLabel: m,
+  closeOnSelect: y = !0,
+  anchorClassName: p = "",
+  menuClassName: h = "",
+  menuItemClassName: w = ""
 }) => {
-  const w = (($) => V($, oe.tabNavigation))(s), A = Ve(n, "scroll"), C = () => {
+  const v = ((_) => H(_, ae.tabNavigation))(s), A = Ve(n, "scroll"), N = () => {
     switch (A) {
       case "scroll":
         return "w-full overflow-x-auto overflow-y-hidden scrollbar-thin scrollbar-thumb-border-default scrollbar-track-transparent hover:scrollbar-thumb-secondary/50 py-1";
@@ -496,43 +496,43 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
       default:
         return "flex space-x-2";
     }
-  }, _ = /* @__PURE__ */ t.jsx(t.Fragment, { children: e.map(($) => /* @__PURE__ */ t.jsx(
+  }, T = /* @__PURE__ */ t.jsx(t.Fragment, { children: e.map((_) => /* @__PURE__ */ t.jsx(
     "button",
     {
-      onClick: () => a($),
+      onClick: () => a(_),
       className: `
-            ${w} font-bold transition-colors duration-200 rounded-t-lg cursor-pointer whitespace-nowrap flex-shrink-0 relative
+            ${v} font-bold transition-colors duration-200 rounded-t-lg cursor-pointer whitespace-nowrap flex-shrink-0 relative
             after:content-[''] after:absolute after:left-0 after:right-0 after:-bottom-[2px] after:h-[2px] after:w-full after:scale-x-0 after:origin-center after:transition-transform after:duration-300 after:ease-out
             before:content-[''] before:absolute before:left-1/2 before:-translate-x-1/2 before:-bottom-[6px] before:w-1.5 before:h-1.5 before:bg-accent before:rotate-45 before:rounded-[2px] before:opacity-0 before:transition-opacity before:duration-200
-            ${r === $ ? "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100" : "text-muted hover:text-secondary hover:before:opacity-70"}
+            ${r === _ ? "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100" : "text-muted hover:text-secondary hover:before:opacity-70"}
             ${l}
           `,
       role: "tab",
-      "aria-selected": r === $,
-      tabIndex: r === $ ? 0 : -1,
-      children: $
+      "aria-selected": r === _,
+      tabIndex: r === _ ? 0 : -1,
+      children: _
     },
-    $
+    _
   )) });
   return A === "dropdown" ? /* @__PURE__ */ t.jsx(
-    bt,
+    pt,
     {
       tabs: e,
       activeTab: r,
       onTabChange: a,
-      sizeClasses: w,
+      sizeClasses: v,
       containerClassName: c,
-      anchorClassName: m,
-      menuClassName: p,
-      menuItemClassName: v,
+      anchorClassName: p,
+      menuClassName: h,
+      menuItemClassName: w,
       dropdownLabel: i,
       anchorIcon: d,
-      showAnchorLabel: x,
-      anchorAriaLabel: b,
-      closeOnSelect: g
+      showAnchorLabel: g,
+      anchorAriaLabel: m,
+      closeOnSelect: y
     }
-  ) : A === "scroll" ? /* @__PURE__ */ t.jsx("div", { className: `${C()} ${c}`, role: "tablist", "aria-label": "Tabs", children: /* @__PURE__ */ t.jsx("div", { className: "w-max mx-auto flex space-x-2", children: _ }) }) : /* @__PURE__ */ t.jsx("div", { className: `${C()} ${c}`, role: "tablist", "aria-label": "Tabs", children: _ });
-}, pt = (e, r) => {
+  ) : A === "scroll" ? /* @__PURE__ */ t.jsx("div", { className: `${N()} ${c}`, role: "tablist", "aria-label": "Tabs", children: /* @__PURE__ */ t.jsx("div", { className: "w-max mx-auto flex space-x-2", children: T }) }) : /* @__PURE__ */ t.jsx("div", { className: `${N()} ${c}`, role: "tablist", "aria-label": "Tabs", children: T });
+}, bt = (e, r) => {
   const a = new Array(e.length + r.length);
   for (let s = 0; s < e.length; s++)
     a[s] = e[s];
@@ -542,7 +542,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
 }, ht = (e, r) => ({
   classGroupId: e,
   validator: r
-}), Ue = (e = /* @__PURE__ */ new Map(), r = null, a) => ({
+}), He = (e = /* @__PURE__ */ new Map(), r = null, a) => ({
   nextPart: e,
   validators: r,
   classGroupId: a
@@ -556,32 +556,32 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
       if (l.startsWith("[") && l.endsWith("]"))
         return yt(l);
       const i = l.split(Ne), d = i[0] === "" && i.length > 1 ? 1 : 0;
-      return He(i, d, r);
+      return Ue(i, d, r);
     },
     getConflictingClassGroupIds: (l, i) => {
       if (i) {
-        const d = s[l], x = a[l];
-        return d ? x ? pt(x, d) : d : x || ze;
+        const d = s[l], g = a[l];
+        return d ? g ? bt(g, d) : d : g || ze;
       }
       return a[l] || ze;
     }
   };
-}, He = (e, r, a) => {
+}, Ue = (e, r, a) => {
   if (e.length - r === 0)
     return a.classGroupId;
   const n = e[r], c = a.nextPart.get(n);
   if (c) {
-    const x = He(e, r + 1, c);
-    if (x) return x;
+    const g = Ue(e, r + 1, c);
+    if (g) return g;
   }
   const l = a.validators;
   if (l === null)
     return;
   const i = r === 0 ? e.join(Ne) : e.slice(r).join(Ne), d = l.length;
-  for (let x = 0; x < d; x++) {
-    const b = l[x];
-    if (b.validator(i))
-      return b.classGroupId;
+  for (let g = 0; g < d; g++) {
+    const m = l[g];
+    if (m.validator(i))
+      return m.classGroupId;
   }
 }, yt = (e) => e.slice(1, -1).indexOf(":") === -1 ? void 0 : (() => {
   const r = e.slice(1, -1), a = r.indexOf(":"), s = r.slice(0, a);
@@ -593,13 +593,13 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   } = e;
   return wt(a, r);
 }, wt = (e, r) => {
-  const a = Ue();
+  const a = He();
   for (const s in e) {
     const n = e[s];
-    _e(n, a, s, r);
+    Te(n, a, s, r);
   }
   return a;
-}, _e = (e, r, a, s) => {
+}, Te = (e, r, a, s) => {
   const n = e.length;
   for (let c = 0; c < n; c++) {
     const l = e[c];
@@ -620,7 +620,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   s.classGroupId = a;
 }, Nt = (e, r, a, s) => {
   if (St(e)) {
-    _e(e(s), r, a, s);
+    Te(e(s), r, a, s);
     return;
   }
   r.validators === null && (r.validators = []), r.validators.push(ht(a, e));
@@ -628,7 +628,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   const n = Object.entries(e), c = n.length;
   for (let l = 0; l < c; l++) {
     const [i, d] = n[l];
-    _e(d, Ye(r, i), a, s);
+    Te(d, Ye(r, i), a, s);
   }
 }, Ye = (e, r) => {
   let a = e;
@@ -636,7 +636,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   for (let c = 0; c < n; c++) {
     const l = s[c];
     let i = a.nextPart.get(l);
-    i || (i = Ue(), a.nextPart.set(l, i)), a = i;
+    i || (i = He(), a.nextPart.set(l, i)), a = i;
   }
   return a;
 }, St = (e) => "isThemeGetter" in e && e.isThemeGetter === !0, Et = (e) => {
@@ -663,50 +663,50 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
       c in a ? a[c] = l : n(c, l);
     }
   };
-}, Se = "!", Pe = ":", $t = [], Oe = (e, r, a, s, n) => ({
+}, Se = "!", Pe = ":", _t = [], Ie = (e, r, a, s, n) => ({
   modifiers: e,
   hasImportantModifier: r,
   baseClassName: a,
   maybePostfixModifierPosition: s,
   isExternal: n
-}), Tt = (e) => {
+}), $t = (e) => {
   const {
     prefix: r,
     experimentalParseClassName: a
   } = e;
   let s = (n) => {
     const c = [];
-    let l = 0, i = 0, d = 0, x;
-    const b = n.length;
-    for (let y = 0; y < b; y++) {
-      const w = n[y];
+    let l = 0, i = 0, d = 0, g;
+    const m = n.length;
+    for (let x = 0; x < m; x++) {
+      const v = n[x];
       if (l === 0 && i === 0) {
-        if (w === Pe) {
-          c.push(n.slice(d, y)), d = y + 1;
+        if (v === Pe) {
+          c.push(n.slice(d, x)), d = x + 1;
           continue;
         }
-        if (w === "/") {
-          x = y;
+        if (v === "/") {
+          g = x;
           continue;
         }
       }
-      w === "[" ? l++ : w === "]" ? l-- : w === "(" ? i++ : w === ")" && i--;
+      v === "[" ? l++ : v === "]" ? l-- : v === "(" ? i++ : v === ")" && i--;
     }
-    const g = c.length === 0 ? n : n.slice(d);
-    let m = g, p = !1;
-    g.endsWith(Se) ? (m = g.slice(0, -1), p = !0) : (
+    const y = c.length === 0 ? n : n.slice(d);
+    let p = y, h = !1;
+    y.endsWith(Se) ? (p = y.slice(0, -1), h = !0) : (
       /**
        * In Tailwind CSS v3 the important modifier was at the start of the base class name. This is still supported for legacy reasons.
        * @see https://github.com/dcastil/tailwind-merge/issues/513#issuecomment-2614029864
        */
-      g.startsWith(Se) && (m = g.slice(1), p = !0)
+      y.startsWith(Se) && (p = y.slice(1), h = !0)
     );
-    const v = x && x > d ? x - d : void 0;
-    return Oe(c, p, m, v);
+    const w = g && g > d ? g - d : void 0;
+    return Ie(c, h, p, w);
   };
   if (r) {
     const n = r + Pe, c = s;
-    s = (l) => l.startsWith(n) ? c(l.slice(n.length)) : Oe($t, !1, l, void 0, !0);
+    s = (l) => l.startsWith(n) ? c(l.slice(n.length)) : Ie(_t, !1, l, void 0, !0);
   }
   if (a) {
     const n = s;
@@ -716,7 +716,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
     });
   }
   return s;
-}, _t = (e) => {
+}, Tt = (e) => {
   const r = /* @__PURE__ */ new Map();
   return e.orderSensitiveModifiers.forEach((a, s) => {
     r.set(a, 1e6 + s);
@@ -731,8 +731,8 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   };
 }, Rt = (e) => ({
   cache: Et(e.cacheSize),
-  parseClassName: Tt(e),
-  sortModifiers: _t(e),
+  parseClassName: $t(e),
+  sortModifiers: Tt(e),
   ...xt(e)
 }), At = /\s+/, Mt = (e, r) => {
   const {
@@ -742,40 +742,40 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
     sortModifiers: c
   } = r, l = [], i = e.trim().split(At);
   let d = "";
-  for (let x = i.length - 1; x >= 0; x -= 1) {
-    const b = i[x], {
-      isExternal: g,
-      modifiers: m,
-      hasImportantModifier: p,
-      baseClassName: v,
-      maybePostfixModifierPosition: y
-    } = a(b);
-    if (g) {
-      d = b + (d.length > 0 ? " " + d : d);
+  for (let g = i.length - 1; g >= 0; g -= 1) {
+    const m = i[g], {
+      isExternal: y,
+      modifiers: p,
+      hasImportantModifier: h,
+      baseClassName: w,
+      maybePostfixModifierPosition: x
+    } = a(m);
+    if (y) {
+      d = m + (d.length > 0 ? " " + d : d);
       continue;
     }
-    let w = !!y, A = s(w ? v.substring(0, y) : v);
+    let v = !!x, A = s(v ? w.substring(0, x) : w);
     if (!A) {
-      if (!w) {
-        d = b + (d.length > 0 ? " " + d : d);
+      if (!v) {
+        d = m + (d.length > 0 ? " " + d : d);
         continue;
       }
-      if (A = s(v), !A) {
-        d = b + (d.length > 0 ? " " + d : d);
+      if (A = s(w), !A) {
+        d = m + (d.length > 0 ? " " + d : d);
         continue;
       }
-      w = !1;
+      v = !1;
     }
-    const C = m.length === 0 ? "" : m.length === 1 ? m[0] : c(m).join(":"), _ = p ? C + Se : C, $ = _ + A;
-    if (l.indexOf($) > -1)
+    const N = p.length === 0 ? "" : p.length === 1 ? p[0] : c(p).join(":"), T = h ? N + Se : N, _ = T + A;
+    if (l.indexOf(_) > -1)
       continue;
-    l.push($);
-    const k = n(A, w);
-    for (let L = 0; L < k.length; ++L) {
-      const G = k[L];
-      l.push(_ + G);
+    l.push(_);
+    const C = n(A, v);
+    for (let z = 0; z < C.length; ++z) {
+      const G = C[z];
+      l.push(T + G);
     }
-    d = b + (d.length > 0 ? " " + d : d);
+    d = m + (d.length > 0 ? " " + d : d);
   }
   return d;
 }, Lt = (...e) => {
@@ -793,32 +793,32 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
 }, zt = (e, ...r) => {
   let a, s, n, c;
   const l = (d) => {
-    const x = r.reduce((b, g) => g(b), e());
-    return a = Rt(x), s = a.cache.get, n = a.cache.set, c = i, i(d);
+    const g = r.reduce((m, y) => y(m), e());
+    return a = Rt(g), s = a.cache.get, n = a.cache.set, c = i, i(d);
   }, i = (d) => {
-    const x = s(d);
-    if (x)
-      return x;
-    const b = Mt(d, a);
-    return n(d, b), b;
+    const g = s(d);
+    if (g)
+      return g;
+    const m = Mt(d, a);
+    return n(d, m), m;
   };
   return c = l, (...d) => c(Lt(...d));
 }, Pt = [], J = (e) => {
   const r = (a) => a[e] || Pt;
   return r.isThemeGetter = !0, r;
-}, Xe = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, qe = /^\((?:(\w[\w-]*):)?(.+)\)$/i, Ot = /^\d+(?:\.\d+)?\/\d+(?:\.\d+)?$/, It = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, Dt = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, Gt = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, Wt = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Ft = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, ie = (e) => Ot.test(e), P = (e) => !!e && !Number.isNaN(Number(e)), ce = (e) => !!e && Number.isInteger(Number(e)), Ce = (e) => e.endsWith("%") && P(e.slice(0, -1)), le = (e) => It.test(e), Ke = () => !0, Bt = (e) => (
+}, Xe = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, qe = /^\((?:(\w[\w-]*):)?(.+)\)$/i, It = /^\d+(?:\.\d+)?\/\d+(?:\.\d+)?$/, Ot = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, Dt = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, Gt = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, Wt = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Bt = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, ie = (e) => It.test(e), P = (e) => !!e && !Number.isNaN(Number(e)), ce = (e) => !!e && Number.isInteger(Number(e)), Ce = (e) => e.endsWith("%") && P(e.slice(0, -1)), le = (e) => Ot.test(e), Ke = () => !0, Ft = (e) => (
   // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
   // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
   // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
   Dt.test(e) && !Gt.test(e)
-), Re = () => !1, Vt = (e) => Wt.test(e), Ut = (e) => Ft.test(e), Ht = (e) => !j(e) && !N(e), Yt = (e) => de(e, et, Re), j = (e) => Xe.test(e), ue = (e) => de(e, tt, Bt), Ie = (e) => de(e, tr, P), Zt = (e) => de(e, st, Ke), Xt = (e) => de(e, rt, Re), De = (e) => de(e, Je, Re), qt = (e) => de(e, Qe, Ut), we = (e) => de(e, ot, Vt), N = (e) => qe.test(e), xe = (e) => me(e, tt), Kt = (e) => me(e, rt), Ge = (e) => me(e, Je), Jt = (e) => me(e, et), Qt = (e) => me(e, Qe), ke = (e) => me(e, ot, !0), er = (e) => me(e, st, !0), de = (e, r, a) => {
+), Re = () => !1, Vt = (e) => Wt.test(e), Ht = (e) => Bt.test(e), Ut = (e) => !k(e) && !j(e), Yt = (e) => de(e, et, Re), k = (e) => Xe.test(e), ue = (e) => de(e, tt, Ft), Oe = (e) => de(e, tr, P), Zt = (e) => de(e, st, Ke), Xt = (e) => de(e, rt, Re), De = (e) => de(e, Je, Re), qt = (e) => de(e, Qe, Ht), we = (e) => de(e, ot, Vt), j = (e) => qe.test(e), xe = (e) => me(e, tt), Kt = (e) => me(e, rt), Ge = (e) => me(e, Je), Jt = (e) => me(e, et), Qt = (e) => me(e, Qe), ke = (e) => me(e, ot, !0), er = (e) => me(e, st, !0), de = (e, r, a) => {
   const s = Xe.exec(e);
   return s ? s[1] ? r(s[1]) : a(s[2]) : !1;
 }, me = (e, r, a = !1) => {
   const s = qe.exec(e);
   return s ? s[1] ? r(s[1]) : a : !1;
 }, Je = (e) => e === "position" || e === "percentage", Qe = (e) => e === "image" || e === "url", et = (e) => e === "length" || e === "size" || e === "bg-size", tt = (e) => e === "length", tr = (e) => e === "number", rt = (e) => e === "family-name", st = (e) => e === "number" || e === "weight", ot = (e) => e === "shadow", rr = () => {
-  const e = J("color"), r = J("font"), a = J("text"), s = J("font-weight"), n = J("tracking"), c = J("leading"), l = J("breakpoint"), i = J("container"), d = J("spacing"), x = J("radius"), b = J("shadow"), g = J("inset-shadow"), m = J("text-shadow"), p = J("drop-shadow"), v = J("blur"), y = J("perspective"), w = J("aspect"), A = J("ease"), C = J("animate"), _ = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], $ = () => [
+  const e = J("color"), r = J("font"), a = J("text"), s = J("font-weight"), n = J("tracking"), c = J("leading"), l = J("breakpoint"), i = J("container"), d = J("spacing"), g = J("radius"), m = J("shadow"), y = J("inset-shadow"), p = J("text-shadow"), h = J("drop-shadow"), w = J("blur"), x = J("perspective"), v = J("aspect"), A = J("ease"), N = J("animate"), T = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], _ = () => [
     "center",
     "top",
     "bottom",
@@ -836,30 +836,30 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
     "bottom-left",
     // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
     "left-bottom"
-  ], k = () => [...$(), N, j], L = () => ["auto", "hidden", "clip", "visible", "scroll"], G = () => ["auto", "contain", "none"], h = () => [N, j, d], z = () => [ie, "full", "auto", ...h()], U = () => [ce, "none", "subgrid", N, j], q = () => ["auto", {
-    span: ["full", ce, N, j]
-  }, ce, N, j], Q = () => [ce, "auto", N, j], re = () => ["auto", "min", "max", "fr", N, j], ee = () => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], B = () => ["start", "end", "center", "stretch", "center-safe", "end-safe"], H = () => ["auto", ...h()], Z = () => [ie, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...h()], Y = () => [ie, "screen", "full", "dvw", "lvw", "svw", "min", "max", "fit", ...h()], K = () => [ie, "screen", "full", "lh", "dvh", "lvh", "svh", "min", "max", "fit", ...h()], o = () => [e, N, j], u = () => [...$(), Ge, De, {
-    position: [N, j]
-  }], f = () => ["no-repeat", {
+  ], C = () => [..._(), j, k], z = () => ["auto", "hidden", "clip", "visible", "scroll"], G = () => ["auto", "contain", "none"], f = () => [j, k, d], M = () => [ie, "full", "auto", ...f()], V = () => [ce, "none", "subgrid", j, k], X = () => ["auto", {
+    span: ["full", ce, j, k]
+  }, ce, j, k], Q = () => [ce, "auto", j, k], re = () => ["auto", "min", "max", "fr", j, k], ee = () => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], F = () => ["start", "end", "center", "stretch", "center-safe", "end-safe"], U = () => ["auto", ...f()], q = () => [ie, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...f()], Y = () => [ie, "screen", "full", "dvw", "lvw", "svw", "min", "max", "fit", ...f()], K = () => [ie, "screen", "full", "lh", "dvh", "lvh", "svh", "min", "max", "fit", ...f()], o = () => [e, j, k], u = () => [..._(), Ge, De, {
+    position: [j, k]
+  }], b = () => ["no-repeat", {
     repeat: ["", "x", "y", "space", "round"]
   }], R = () => ["auto", "cover", "contain", Jt, Yt, {
-    size: [N, j]
+    size: [j, k]
   }], S = () => [Ce, xe, ue], E = () => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
     "full",
-    x,
-    N,
-    j
-  ], O = () => ["", P, xe, ue], W = () => ["solid", "dashed", "dotted", "double"], I = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], M = () => [P, Ce, Ge, De], F = () => [
+    g,
+    j,
+    k
+  ], I = () => ["", P, xe, ue], W = () => ["solid", "dashed", "dotted", "double"], O = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], L = () => [P, Ce, Ge, De], B = () => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
-    v,
-    N,
-    j
-  ], se = () => ["none", P, N, j], fe = () => ["none", P, N, j], pe = () => [P, N, j], ye = () => [ie, "full", ...h()];
+    w,
+    j,
+    k
+  ], se = () => ["none", P, j, k], fe = () => ["none", P, j, k], be = () => [P, j, k], ye = () => [ie, "full", ...f()];
   return {
     cacheSize: 500,
     theme: {
@@ -871,7 +871,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
       container: [le],
       "drop-shadow": [le],
       ease: ["in", "out", "in-out"],
-      font: [Ht],
+      font: [Ut],
       "font-weight": ["thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black"],
       "inset-shadow": [le],
       leading: ["none", "tight", "snug", "normal", "relaxed", "loose"],
@@ -892,7 +892,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/aspect-ratio
        */
       aspect: [{
-        aspect: ["auto", "square", ie, j, N, w]
+        aspect: ["auto", "square", ie, k, j, v]
       }],
       /**
        * Container
@@ -905,21 +905,21 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/columns
        */
       columns: [{
-        columns: [P, j, N, i]
+        columns: [P, k, j, i]
       }],
       /**
        * Break After
        * @see https://tailwindcss.com/docs/break-after
        */
       "break-after": [{
-        "break-after": _()
+        "break-after": T()
       }],
       /**
        * Break Before
        * @see https://tailwindcss.com/docs/break-before
        */
       "break-before": [{
-        "break-before": _()
+        "break-before": T()
       }],
       /**
        * Break Inside
@@ -983,28 +983,28 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/object-position
        */
       "object-position": [{
-        object: k()
+        object: C()
       }],
       /**
        * Overflow
        * @see https://tailwindcss.com/docs/overflow
        */
       overflow: [{
-        overflow: L()
+        overflow: z()
       }],
       /**
        * Overflow X
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-x": [{
-        "overflow-x": L()
+        "overflow-x": z()
       }],
       /**
        * Overflow Y
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-y": [{
-        "overflow-y": L()
+        "overflow-y": z()
       }],
       /**
        * Overscroll Behavior
@@ -1037,21 +1037,21 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       inset: [{
-        inset: z()
+        inset: M()
       }],
       /**
        * Inset Inline
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       "inset-x": [{
-        "inset-x": z()
+        "inset-x": M()
       }],
       /**
        * Inset Block
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       "inset-y": [{
-        "inset-y": z()
+        "inset-y": M()
       }],
       /**
        * Inset Inline Start
@@ -1059,12 +1059,12 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @todo class group will be renamed to `inset-s` in next major release
        */
       start: [{
-        "inset-s": z(),
+        "inset-s": M(),
         /**
          * @deprecated since Tailwind CSS v4.2.0 in favor of `inset-s-*` utilities.
          * @see https://github.com/tailwindlabs/tailwindcss/pull/19613
          */
-        start: z()
+        start: M()
       }],
       /**
        * Inset Inline End
@@ -1072,54 +1072,54 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @todo class group will be renamed to `inset-e` in next major release
        */
       end: [{
-        "inset-e": z(),
+        "inset-e": M(),
         /**
          * @deprecated since Tailwind CSS v4.2.0 in favor of `inset-e-*` utilities.
          * @see https://github.com/tailwindlabs/tailwindcss/pull/19613
          */
-        end: z()
+        end: M()
       }],
       /**
        * Inset Block Start
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       "inset-bs": [{
-        "inset-bs": z()
+        "inset-bs": M()
       }],
       /**
        * Inset Block End
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       "inset-be": [{
-        "inset-be": z()
+        "inset-be": M()
       }],
       /**
        * Top
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       top: [{
-        top: z()
+        top: M()
       }],
       /**
        * Right
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       right: [{
-        right: z()
+        right: M()
       }],
       /**
        * Bottom
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       bottom: [{
-        bottom: z()
+        bottom: M()
       }],
       /**
        * Left
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       left: [{
-        left: z()
+        left: M()
       }],
       /**
        * Visibility
@@ -1131,7 +1131,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/z-index
        */
       z: [{
-        z: [ce, "auto", N, j]
+        z: [ce, "auto", j, k]
       }],
       // ------------------------
       // --- Flexbox and Grid ---
@@ -1141,7 +1141,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/flex-basis
        */
       basis: [{
-        basis: [ie, "full", "auto", i, ...h()]
+        basis: [ie, "full", "auto", i, ...f()]
       }],
       /**
        * Flex Direction
@@ -1162,42 +1162,42 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/flex
        */
       flex: [{
-        flex: [P, ie, "auto", "initial", "none", j]
+        flex: [P, ie, "auto", "initial", "none", k]
       }],
       /**
        * Flex Grow
        * @see https://tailwindcss.com/docs/flex-grow
        */
       grow: [{
-        grow: ["", P, N, j]
+        grow: ["", P, j, k]
       }],
       /**
        * Flex Shrink
        * @see https://tailwindcss.com/docs/flex-shrink
        */
       shrink: [{
-        shrink: ["", P, N, j]
+        shrink: ["", P, j, k]
       }],
       /**
        * Order
        * @see https://tailwindcss.com/docs/order
        */
       order: [{
-        order: [ce, "first", "last", "none", N, j]
+        order: [ce, "first", "last", "none", j, k]
       }],
       /**
        * Grid Template Columns
        * @see https://tailwindcss.com/docs/grid-template-columns
        */
       "grid-cols": [{
-        "grid-cols": U()
+        "grid-cols": V()
       }],
       /**
        * Grid Column Start / End
        * @see https://tailwindcss.com/docs/grid-column
        */
       "col-start-end": [{
-        col: q()
+        col: X()
       }],
       /**
        * Grid Column Start
@@ -1218,14 +1218,14 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/grid-template-rows
        */
       "grid-rows": [{
-        "grid-rows": U()
+        "grid-rows": V()
       }],
       /**
        * Grid Row Start / End
        * @see https://tailwindcss.com/docs/grid-row
        */
       "row-start-end": [{
-        row: q()
+        row: X()
       }],
       /**
        * Grid Row Start
@@ -1267,21 +1267,21 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/gap
        */
       gap: [{
-        gap: h()
+        gap: f()
       }],
       /**
        * Gap X
        * @see https://tailwindcss.com/docs/gap
        */
       "gap-x": [{
-        "gap-x": h()
+        "gap-x": f()
       }],
       /**
        * Gap Y
        * @see https://tailwindcss.com/docs/gap
        */
       "gap-y": [{
-        "gap-y": h()
+        "gap-y": f()
       }],
       /**
        * Justify Content
@@ -1295,14 +1295,14 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/justify-items
        */
       "justify-items": [{
-        "justify-items": [...B(), "normal"]
+        "justify-items": [...F(), "normal"]
       }],
       /**
        * Justify Self
        * @see https://tailwindcss.com/docs/justify-self
        */
       "justify-self": [{
-        "justify-self": ["auto", ...B()]
+        "justify-self": ["auto", ...F()]
       }],
       /**
        * Align Content
@@ -1316,7 +1316,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/align-items
        */
       "align-items": [{
-        items: [...B(), {
+        items: [...F(), {
           baseline: ["", "last"]
         }]
       }],
@@ -1325,7 +1325,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/align-self
        */
       "align-self": [{
-        self: ["auto", ...B(), {
+        self: ["auto", ...F(), {
           baseline: ["", "last"]
         }]
       }],
@@ -1341,14 +1341,14 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/place-items
        */
       "place-items": [{
-        "place-items": [...B(), "baseline"]
+        "place-items": [...F(), "baseline"]
       }],
       /**
        * Place Self
        * @see https://tailwindcss.com/docs/place-self
        */
       "place-self": [{
-        "place-self": ["auto", ...B()]
+        "place-self": ["auto", ...F()]
       }],
       // Spacing
       /**
@@ -1356,161 +1356,161 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/padding
        */
       p: [{
-        p: h()
+        p: f()
       }],
       /**
        * Padding Inline
        * @see https://tailwindcss.com/docs/padding
        */
       px: [{
-        px: h()
+        px: f()
       }],
       /**
        * Padding Block
        * @see https://tailwindcss.com/docs/padding
        */
       py: [{
-        py: h()
+        py: f()
       }],
       /**
        * Padding Inline Start
        * @see https://tailwindcss.com/docs/padding
        */
       ps: [{
-        ps: h()
+        ps: f()
       }],
       /**
        * Padding Inline End
        * @see https://tailwindcss.com/docs/padding
        */
       pe: [{
-        pe: h()
+        pe: f()
       }],
       /**
        * Padding Block Start
        * @see https://tailwindcss.com/docs/padding
        */
       pbs: [{
-        pbs: h()
+        pbs: f()
       }],
       /**
        * Padding Block End
        * @see https://tailwindcss.com/docs/padding
        */
       pbe: [{
-        pbe: h()
+        pbe: f()
       }],
       /**
        * Padding Top
        * @see https://tailwindcss.com/docs/padding
        */
       pt: [{
-        pt: h()
+        pt: f()
       }],
       /**
        * Padding Right
        * @see https://tailwindcss.com/docs/padding
        */
       pr: [{
-        pr: h()
+        pr: f()
       }],
       /**
        * Padding Bottom
        * @see https://tailwindcss.com/docs/padding
        */
       pb: [{
-        pb: h()
+        pb: f()
       }],
       /**
        * Padding Left
        * @see https://tailwindcss.com/docs/padding
        */
       pl: [{
-        pl: h()
+        pl: f()
       }],
       /**
        * Margin
        * @see https://tailwindcss.com/docs/margin
        */
       m: [{
-        m: H()
+        m: U()
       }],
       /**
        * Margin Inline
        * @see https://tailwindcss.com/docs/margin
        */
       mx: [{
-        mx: H()
+        mx: U()
       }],
       /**
        * Margin Block
        * @see https://tailwindcss.com/docs/margin
        */
       my: [{
-        my: H()
+        my: U()
       }],
       /**
        * Margin Inline Start
        * @see https://tailwindcss.com/docs/margin
        */
       ms: [{
-        ms: H()
+        ms: U()
       }],
       /**
        * Margin Inline End
        * @see https://tailwindcss.com/docs/margin
        */
       me: [{
-        me: H()
+        me: U()
       }],
       /**
        * Margin Block Start
        * @see https://tailwindcss.com/docs/margin
        */
       mbs: [{
-        mbs: H()
+        mbs: U()
       }],
       /**
        * Margin Block End
        * @see https://tailwindcss.com/docs/margin
        */
       mbe: [{
-        mbe: H()
+        mbe: U()
       }],
       /**
        * Margin Top
        * @see https://tailwindcss.com/docs/margin
        */
       mt: [{
-        mt: H()
+        mt: U()
       }],
       /**
        * Margin Right
        * @see https://tailwindcss.com/docs/margin
        */
       mr: [{
-        mr: H()
+        mr: U()
       }],
       /**
        * Margin Bottom
        * @see https://tailwindcss.com/docs/margin
        */
       mb: [{
-        mb: H()
+        mb: U()
       }],
       /**
        * Margin Left
        * @see https://tailwindcss.com/docs/margin
        */
       ml: [{
-        ml: H()
+        ml: U()
       }],
       /**
        * Space Between X
        * @see https://tailwindcss.com/docs/margin#adding-space-between-children
        */
       "space-x": [{
-        "space-x": h()
+        "space-x": f()
       }],
       /**
        * Space Between X Reverse
@@ -1522,7 +1522,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/margin#adding-space-between-children
        */
       "space-y": [{
-        "space-y": h()
+        "space-y": f()
       }],
       /**
        * Space Between Y Reverse
@@ -1537,7 +1537,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/width#setting-both-width-and-height
        */
       size: [{
-        size: Z()
+        size: q()
       }],
       /**
        * Inline Size
@@ -1586,7 +1586,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/width
        */
       w: [{
-        w: [i, "screen", ...Z()]
+        w: [i, "screen", ...q()]
       }],
       /**
        * Min-Width
@@ -1598,7 +1598,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
           "screen",
           /** Deprecated. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
           "none",
-          ...Z()
+          ...q()
         ]
       }],
       /**
@@ -1616,7 +1616,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
           {
             screen: [l]
           },
-          ...Z()
+          ...q()
         ]
       }],
       /**
@@ -1624,21 +1624,21 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/height
        */
       h: [{
-        h: ["screen", "lh", ...Z()]
+        h: ["screen", "lh", ...q()]
       }],
       /**
        * Min-Height
        * @see https://tailwindcss.com/docs/min-height
        */
       "min-h": [{
-        "min-h": ["screen", "lh", "none", ...Z()]
+        "min-h": ["screen", "lh", "none", ...q()]
       }],
       /**
        * Max-Height
        * @see https://tailwindcss.com/docs/max-height
        */
       "max-h": [{
-        "max-h": ["screen", "lh", ...Z()]
+        "max-h": ["screen", "lh", ...q()]
       }],
       // ------------------
       // --- Typography ---
@@ -1672,7 +1672,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/font-stretch
        */
       "font-stretch": [{
-        "font-stretch": ["ultra-condensed", "extra-condensed", "condensed", "semi-condensed", "normal", "semi-expanded", "expanded", "extra-expanded", "ultra-expanded", Ce, j]
+        "font-stretch": ["ultra-condensed", "extra-condensed", "condensed", "semi-condensed", "normal", "semi-expanded", "expanded", "extra-expanded", "ultra-expanded", Ce, k]
       }],
       /**
        * Font Family
@@ -1686,7 +1686,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/font-feature-settings
        */
       "font-features": [{
-        "font-features": [j]
+        "font-features": [k]
       }],
       /**
        * Font Variant Numeric
@@ -1723,14 +1723,14 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/letter-spacing
        */
       tracking: [{
-        tracking: [n, N, j]
+        tracking: [n, j, k]
       }],
       /**
        * Line Clamp
        * @see https://tailwindcss.com/docs/line-clamp
        */
       "line-clamp": [{
-        "line-clamp": [P, "none", N, Ie]
+        "line-clamp": [P, "none", j, Oe]
       }],
       /**
        * Line Height
@@ -1740,7 +1740,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         leading: [
           /** Deprecated since Tailwind CSS v4.0.0. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
           c,
-          ...h()
+          ...f()
         ]
       }],
       /**
@@ -1748,7 +1748,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/list-style-image
        */
       "list-image": [{
-        "list-image": ["none", N, j]
+        "list-image": ["none", j, k]
       }],
       /**
        * List Style Position
@@ -1762,7 +1762,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/list-style-type
        */
       "list-style-type": [{
-        list: ["disc", "decimal", "none", N, j]
+        list: ["disc", "decimal", "none", j, k]
       }],
       /**
        * Text Alignment
@@ -1803,7 +1803,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/text-decoration-thickness
        */
       "text-decoration-thickness": [{
-        decoration: [P, "from-font", "auto", N, ue]
+        decoration: [P, "from-font", "auto", j, ue]
       }],
       /**
        * Text Decoration Color
@@ -1817,7 +1817,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/text-underline-offset
        */
       "underline-offset": [{
-        "underline-offset": [P, "auto", N, j]
+        "underline-offset": [P, "auto", j, k]
       }],
       /**
        * Text Transform
@@ -1841,14 +1841,14 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/text-indent
        */
       indent: [{
-        indent: h()
+        indent: f()
       }],
       /**
        * Vertical Alignment
        * @see https://tailwindcss.com/docs/vertical-align
        */
       "vertical-align": [{
-        align: ["baseline", "top", "middle", "bottom", "text-top", "text-bottom", "sub", "super", N, j]
+        align: ["baseline", "top", "middle", "bottom", "text-top", "text-bottom", "sub", "super", j, k]
       }],
       /**
        * Whitespace
@@ -1883,7 +1883,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/content
        */
       content: [{
-        content: ["none", N, j]
+        content: ["none", j, k]
       }],
       // -------------------
       // --- Backgrounds ---
@@ -1921,7 +1921,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/background-repeat
        */
       "bg-repeat": [{
-        bg: f()
+        bg: b()
       }],
       /**
        * Background Size
@@ -1938,9 +1938,9 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         bg: ["none", {
           linear: [{
             to: ["t", "tr", "r", "br", "b", "bl", "l", "tl"]
-          }, ce, N, j],
-          radial: ["", N, j],
-          conic: [ce, N, j]
+          }, ce, j, k],
+          radial: ["", j, k],
+          conic: [ce, j, k]
         }, Qt, qt]
       }],
       /**
@@ -2105,84 +2105,84 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w": [{
-        border: O()
+        border: I()
       }],
       /**
        * Border Width Inline
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-x": [{
-        "border-x": O()
+        "border-x": I()
       }],
       /**
        * Border Width Block
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-y": [{
-        "border-y": O()
+        "border-y": I()
       }],
       /**
        * Border Width Inline Start
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-s": [{
-        "border-s": O()
+        "border-s": I()
       }],
       /**
        * Border Width Inline End
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-e": [{
-        "border-e": O()
+        "border-e": I()
       }],
       /**
        * Border Width Block Start
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-bs": [{
-        "border-bs": O()
+        "border-bs": I()
       }],
       /**
        * Border Width Block End
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-be": [{
-        "border-be": O()
+        "border-be": I()
       }],
       /**
        * Border Width Top
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-t": [{
-        "border-t": O()
+        "border-t": I()
       }],
       /**
        * Border Width Right
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-r": [{
-        "border-r": O()
+        "border-r": I()
       }],
       /**
        * Border Width Bottom
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-b": [{
-        "border-b": O()
+        "border-b": I()
       }],
       /**
        * Border Width Left
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-l": [{
-        "border-l": O()
+        "border-l": I()
       }],
       /**
        * Divide Width X
        * @see https://tailwindcss.com/docs/border-width#between-children
        */
       "divide-x": [{
-        "divide-x": O()
+        "divide-x": I()
       }],
       /**
        * Divide Width X Reverse
@@ -2194,7 +2194,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/border-width#between-children
        */
       "divide-y": [{
-        "divide-y": O()
+        "divide-y": I()
       }],
       /**
        * Divide Width Y Reverse
@@ -2311,7 +2311,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/outline-offset
        */
       "outline-offset": [{
-        "outline-offset": [P, N, j]
+        "outline-offset": [P, j, k]
       }],
       /**
        * Outline Width
@@ -2339,7 +2339,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
           // Deprecated since Tailwind CSS v4.0.0
           "",
           "none",
-          b,
+          m,
           ke,
           we
         ]
@@ -2356,7 +2356,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/box-shadow#adding-an-inset-shadow
        */
       "inset-shadow": [{
-        "inset-shadow": ["none", g, ke, we]
+        "inset-shadow": ["none", y, ke, we]
       }],
       /**
        * Inset Box Shadow Color
@@ -2370,7 +2370,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/box-shadow#adding-a-ring
        */
       "ring-w": [{
-        ring: O()
+        ring: I()
       }],
       /**
        * Ring Width Inset
@@ -2409,7 +2409,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/box-shadow#adding-an-inset-ring
        */
       "inset-ring-w": [{
-        "inset-ring": O()
+        "inset-ring": I()
       }],
       /**
        * Inset Ring Color
@@ -2423,7 +2423,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/text-shadow
        */
       "text-shadow": [{
-        "text-shadow": ["none", m, ke, we]
+        "text-shadow": ["none", p, ke, we]
       }],
       /**
        * Text Shadow Color
@@ -2437,21 +2437,21 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/opacity
        */
       opacity: [{
-        opacity: [P, N, j]
+        opacity: [P, j, k]
       }],
       /**
        * Mix Blend Mode
        * @see https://tailwindcss.com/docs/mix-blend-mode
        */
       "mix-blend": [{
-        "mix-blend": [...I(), "plus-darker", "plus-lighter"]
+        "mix-blend": [...O(), "plus-darker", "plus-lighter"]
       }],
       /**
        * Background Blend Mode
        * @see https://tailwindcss.com/docs/background-blend-mode
        */
       "bg-blend": [{
-        "bg-blend": I()
+        "bg-blend": O()
       }],
       /**
        * Mask Clip
@@ -2475,10 +2475,10 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         "mask-linear": [P]
       }],
       "mask-image-linear-from-pos": [{
-        "mask-linear-from": M()
+        "mask-linear-from": L()
       }],
       "mask-image-linear-to-pos": [{
-        "mask-linear-to": M()
+        "mask-linear-to": L()
       }],
       "mask-image-linear-from-color": [{
         "mask-linear-from": o()
@@ -2487,10 +2487,10 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         "mask-linear-to": o()
       }],
       "mask-image-t-from-pos": [{
-        "mask-t-from": M()
+        "mask-t-from": L()
       }],
       "mask-image-t-to-pos": [{
-        "mask-t-to": M()
+        "mask-t-to": L()
       }],
       "mask-image-t-from-color": [{
         "mask-t-from": o()
@@ -2499,10 +2499,10 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         "mask-t-to": o()
       }],
       "mask-image-r-from-pos": [{
-        "mask-r-from": M()
+        "mask-r-from": L()
       }],
       "mask-image-r-to-pos": [{
-        "mask-r-to": M()
+        "mask-r-to": L()
       }],
       "mask-image-r-from-color": [{
         "mask-r-from": o()
@@ -2511,10 +2511,10 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         "mask-r-to": o()
       }],
       "mask-image-b-from-pos": [{
-        "mask-b-from": M()
+        "mask-b-from": L()
       }],
       "mask-image-b-to-pos": [{
-        "mask-b-to": M()
+        "mask-b-to": L()
       }],
       "mask-image-b-from-color": [{
         "mask-b-from": o()
@@ -2523,10 +2523,10 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         "mask-b-to": o()
       }],
       "mask-image-l-from-pos": [{
-        "mask-l-from": M()
+        "mask-l-from": L()
       }],
       "mask-image-l-to-pos": [{
-        "mask-l-to": M()
+        "mask-l-to": L()
       }],
       "mask-image-l-from-color": [{
         "mask-l-from": o()
@@ -2535,10 +2535,10 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         "mask-l-to": o()
       }],
       "mask-image-x-from-pos": [{
-        "mask-x-from": M()
+        "mask-x-from": L()
       }],
       "mask-image-x-to-pos": [{
-        "mask-x-to": M()
+        "mask-x-to": L()
       }],
       "mask-image-x-from-color": [{
         "mask-x-from": o()
@@ -2547,10 +2547,10 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         "mask-x-to": o()
       }],
       "mask-image-y-from-pos": [{
-        "mask-y-from": M()
+        "mask-y-from": L()
       }],
       "mask-image-y-to-pos": [{
-        "mask-y-to": M()
+        "mask-y-to": L()
       }],
       "mask-image-y-from-color": [{
         "mask-y-from": o()
@@ -2559,13 +2559,13 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         "mask-y-to": o()
       }],
       "mask-image-radial": [{
-        "mask-radial": [N, j]
+        "mask-radial": [j, k]
       }],
       "mask-image-radial-from-pos": [{
-        "mask-radial-from": M()
+        "mask-radial-from": L()
       }],
       "mask-image-radial-to-pos": [{
-        "mask-radial-to": M()
+        "mask-radial-to": L()
       }],
       "mask-image-radial-from-color": [{
         "mask-radial-from": o()
@@ -2583,16 +2583,16 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
         }]
       }],
       "mask-image-radial-pos": [{
-        "mask-radial-at": $()
+        "mask-radial-at": _()
       }],
       "mask-image-conic-pos": [{
         "mask-conic": [P]
       }],
       "mask-image-conic-from-pos": [{
-        "mask-conic-from": M()
+        "mask-conic-from": L()
       }],
       "mask-image-conic-to-pos": [{
-        "mask-conic-to": M()
+        "mask-conic-to": L()
       }],
       "mask-image-conic-from-color": [{
         "mask-conic-from": o()
@@ -2626,7 +2626,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/mask-repeat
        */
       "mask-repeat": [{
-        mask: f()
+        mask: b()
       }],
       /**
        * Mask Size
@@ -2647,7 +2647,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/mask-image
        */
       "mask-image": [{
-        mask: ["none", N, j]
+        mask: ["none", j, k]
       }],
       // ---------------
       // --- Filters ---
@@ -2661,8 +2661,8 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
           // Deprecated since Tailwind CSS v3.0.0
           "",
           "none",
-          N,
-          j
+          j,
+          k
         ]
       }],
       /**
@@ -2670,21 +2670,21 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/blur
        */
       blur: [{
-        blur: F()
+        blur: B()
       }],
       /**
        * Brightness
        * @see https://tailwindcss.com/docs/brightness
        */
       brightness: [{
-        brightness: [P, N, j]
+        brightness: [P, j, k]
       }],
       /**
        * Contrast
        * @see https://tailwindcss.com/docs/contrast
        */
       contrast: [{
-        contrast: [P, N, j]
+        contrast: [P, j, k]
       }],
       /**
        * Drop Shadow
@@ -2695,7 +2695,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
           // Deprecated since Tailwind CSS v4.0.0
           "",
           "none",
-          p,
+          h,
           ke,
           we
         ]
@@ -2712,35 +2712,35 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/grayscale
        */
       grayscale: [{
-        grayscale: ["", P, N, j]
+        grayscale: ["", P, j, k]
       }],
       /**
        * Hue Rotate
        * @see https://tailwindcss.com/docs/hue-rotate
        */
       "hue-rotate": [{
-        "hue-rotate": [P, N, j]
+        "hue-rotate": [P, j, k]
       }],
       /**
        * Invert
        * @see https://tailwindcss.com/docs/invert
        */
       invert: [{
-        invert: ["", P, N, j]
+        invert: ["", P, j, k]
       }],
       /**
        * Saturate
        * @see https://tailwindcss.com/docs/saturate
        */
       saturate: [{
-        saturate: [P, N, j]
+        saturate: [P, j, k]
       }],
       /**
        * Sepia
        * @see https://tailwindcss.com/docs/sepia
        */
       sepia: [{
-        sepia: ["", P, N, j]
+        sepia: ["", P, j, k]
       }],
       /**
        * Backdrop Filter
@@ -2751,8 +2751,8 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
           // Deprecated since Tailwind CSS v3.0.0
           "",
           "none",
-          N,
-          j
+          j,
+          k
         ]
       }],
       /**
@@ -2760,63 +2760,63 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/backdrop-blur
        */
       "backdrop-blur": [{
-        "backdrop-blur": F()
+        "backdrop-blur": B()
       }],
       /**
        * Backdrop Brightness
        * @see https://tailwindcss.com/docs/backdrop-brightness
        */
       "backdrop-brightness": [{
-        "backdrop-brightness": [P, N, j]
+        "backdrop-brightness": [P, j, k]
       }],
       /**
        * Backdrop Contrast
        * @see https://tailwindcss.com/docs/backdrop-contrast
        */
       "backdrop-contrast": [{
-        "backdrop-contrast": [P, N, j]
+        "backdrop-contrast": [P, j, k]
       }],
       /**
        * Backdrop Grayscale
        * @see https://tailwindcss.com/docs/backdrop-grayscale
        */
       "backdrop-grayscale": [{
-        "backdrop-grayscale": ["", P, N, j]
+        "backdrop-grayscale": ["", P, j, k]
       }],
       /**
        * Backdrop Hue Rotate
        * @see https://tailwindcss.com/docs/backdrop-hue-rotate
        */
       "backdrop-hue-rotate": [{
-        "backdrop-hue-rotate": [P, N, j]
+        "backdrop-hue-rotate": [P, j, k]
       }],
       /**
        * Backdrop Invert
        * @see https://tailwindcss.com/docs/backdrop-invert
        */
       "backdrop-invert": [{
-        "backdrop-invert": ["", P, N, j]
+        "backdrop-invert": ["", P, j, k]
       }],
       /**
        * Backdrop Opacity
        * @see https://tailwindcss.com/docs/backdrop-opacity
        */
       "backdrop-opacity": [{
-        "backdrop-opacity": [P, N, j]
+        "backdrop-opacity": [P, j, k]
       }],
       /**
        * Backdrop Saturate
        * @see https://tailwindcss.com/docs/backdrop-saturate
        */
       "backdrop-saturate": [{
-        "backdrop-saturate": [P, N, j]
+        "backdrop-saturate": [P, j, k]
       }],
       /**
        * Backdrop Sepia
        * @see https://tailwindcss.com/docs/backdrop-sepia
        */
       "backdrop-sepia": [{
-        "backdrop-sepia": ["", P, N, j]
+        "backdrop-sepia": ["", P, j, k]
       }],
       // --------------
       // --- Tables ---
@@ -2833,21 +2833,21 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/border-spacing
        */
       "border-spacing": [{
-        "border-spacing": h()
+        "border-spacing": f()
       }],
       /**
        * Border Spacing X
        * @see https://tailwindcss.com/docs/border-spacing
        */
       "border-spacing-x": [{
-        "border-spacing-x": h()
+        "border-spacing-x": f()
       }],
       /**
        * Border Spacing Y
        * @see https://tailwindcss.com/docs/border-spacing
        */
       "border-spacing-y": [{
-        "border-spacing-y": h()
+        "border-spacing-y": f()
       }],
       /**
        * Table Layout
@@ -2871,7 +2871,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/transition-property
        */
       transition: [{
-        transition: ["", "all", "colors", "opacity", "shadow", "transform", "none", N, j]
+        transition: ["", "all", "colors", "opacity", "shadow", "transform", "none", j, k]
       }],
       /**
        * Transition Behavior
@@ -2885,28 +2885,28 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/transition-duration
        */
       duration: [{
-        duration: [P, "initial", N, j]
+        duration: [P, "initial", j, k]
       }],
       /**
        * Transition Timing Function
        * @see https://tailwindcss.com/docs/transition-timing-function
        */
       ease: [{
-        ease: ["linear", "initial", A, N, j]
+        ease: ["linear", "initial", A, j, k]
       }],
       /**
        * Transition Delay
        * @see https://tailwindcss.com/docs/transition-delay
        */
       delay: [{
-        delay: [P, N, j]
+        delay: [P, j, k]
       }],
       /**
        * Animation
        * @see https://tailwindcss.com/docs/animation
        */
       animate: [{
-        animate: ["none", C, N, j]
+        animate: ["none", N, j, k]
       }],
       // ------------------
       // --- Transforms ---
@@ -2923,14 +2923,14 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/perspective
        */
       perspective: [{
-        perspective: [y, N, j]
+        perspective: [x, j, k]
       }],
       /**
        * Perspective Origin
        * @see https://tailwindcss.com/docs/perspective-origin
        */
       "perspective-origin": [{
-        "perspective-origin": k()
+        "perspective-origin": C()
       }],
       /**
        * Rotate
@@ -2998,35 +2998,35 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/skew
        */
       skew: [{
-        skew: pe()
+        skew: be()
       }],
       /**
        * Skew X
        * @see https://tailwindcss.com/docs/skew
        */
       "skew-x": [{
-        "skew-x": pe()
+        "skew-x": be()
       }],
       /**
        * Skew Y
        * @see https://tailwindcss.com/docs/skew
        */
       "skew-y": [{
-        "skew-y": pe()
+        "skew-y": be()
       }],
       /**
        * Transform
        * @see https://tailwindcss.com/docs/transform
        */
       transform: [{
-        transform: [N, j, "", "none", "gpu", "cpu"]
+        transform: [j, k, "", "none", "gpu", "cpu"]
       }],
       /**
        * Transform Origin
        * @see https://tailwindcss.com/docs/transform-origin
        */
       "transform-origin": [{
-        origin: k()
+        origin: C()
       }],
       /**
        * Transform Style
@@ -3104,7 +3104,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/cursor
        */
       cursor: [{
-        cursor: ["auto", "default", "pointer", "wait", "text", "move", "help", "not-allowed", "none", "context-menu", "progress", "cell", "crosshair", "vertical-text", "alias", "copy", "no-drop", "grab", "grabbing", "all-scroll", "col-resize", "row-resize", "n-resize", "e-resize", "s-resize", "w-resize", "ne-resize", "nw-resize", "se-resize", "sw-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "zoom-in", "zoom-out", N, j]
+        cursor: ["auto", "default", "pointer", "wait", "text", "move", "help", "not-allowed", "none", "context-menu", "progress", "cell", "crosshair", "vertical-text", "alias", "copy", "no-drop", "grab", "grabbing", "all-scroll", "col-resize", "row-resize", "n-resize", "e-resize", "s-resize", "w-resize", "ne-resize", "nw-resize", "se-resize", "sw-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "zoom-in", "zoom-out", j, k]
       }],
       /**
        * Field Sizing
@@ -3139,154 +3139,154 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-m": [{
-        "scroll-m": h()
+        "scroll-m": f()
       }],
       /**
        * Scroll Margin Inline
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mx": [{
-        "scroll-mx": h()
+        "scroll-mx": f()
       }],
       /**
        * Scroll Margin Block
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-my": [{
-        "scroll-my": h()
+        "scroll-my": f()
       }],
       /**
        * Scroll Margin Inline Start
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-ms": [{
-        "scroll-ms": h()
+        "scroll-ms": f()
       }],
       /**
        * Scroll Margin Inline End
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-me": [{
-        "scroll-me": h()
+        "scroll-me": f()
       }],
       /**
        * Scroll Margin Block Start
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mbs": [{
-        "scroll-mbs": h()
+        "scroll-mbs": f()
       }],
       /**
        * Scroll Margin Block End
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mbe": [{
-        "scroll-mbe": h()
+        "scroll-mbe": f()
       }],
       /**
        * Scroll Margin Top
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mt": [{
-        "scroll-mt": h()
+        "scroll-mt": f()
       }],
       /**
        * Scroll Margin Right
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mr": [{
-        "scroll-mr": h()
+        "scroll-mr": f()
       }],
       /**
        * Scroll Margin Bottom
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mb": [{
-        "scroll-mb": h()
+        "scroll-mb": f()
       }],
       /**
        * Scroll Margin Left
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-ml": [{
-        "scroll-ml": h()
+        "scroll-ml": f()
       }],
       /**
        * Scroll Padding
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-p": [{
-        "scroll-p": h()
+        "scroll-p": f()
       }],
       /**
        * Scroll Padding Inline
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-px": [{
-        "scroll-px": h()
+        "scroll-px": f()
       }],
       /**
        * Scroll Padding Block
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-py": [{
-        "scroll-py": h()
+        "scroll-py": f()
       }],
       /**
        * Scroll Padding Inline Start
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-ps": [{
-        "scroll-ps": h()
+        "scroll-ps": f()
       }],
       /**
        * Scroll Padding Inline End
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pe": [{
-        "scroll-pe": h()
+        "scroll-pe": f()
       }],
       /**
        * Scroll Padding Block Start
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pbs": [{
-        "scroll-pbs": h()
+        "scroll-pbs": f()
       }],
       /**
        * Scroll Padding Block End
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pbe": [{
-        "scroll-pbe": h()
+        "scroll-pbe": f()
       }],
       /**
        * Scroll Padding Top
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pt": [{
-        "scroll-pt": h()
+        "scroll-pt": f()
       }],
       /**
        * Scroll Padding Right
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pr": [{
-        "scroll-pr": h()
+        "scroll-pr": f()
       }],
       /**
        * Scroll Padding Bottom
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pb": [{
-        "scroll-pb": h()
+        "scroll-pb": f()
       }],
       /**
        * Scroll Padding Left
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pl": [{
-        "scroll-pl": h()
+        "scroll-pl": f()
       }],
       /**
        * Scroll Snap Align
@@ -3354,7 +3354,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/will-change
        */
       "will-change": [{
-        "will-change": ["auto", "scroll", "contents", "transform", N, j]
+        "will-change": ["auto", "scroll", "contents", "transform", j, k]
       }],
       // -----------
       // --- SVG ---
@@ -3371,7 +3371,7 @@ const Te = (e) => typeof e == "object" && e !== null, V = (e, r) => {
        * @see https://tailwindcss.com/docs/stroke-width
        */
       "stroke-w": [{
-        stroke: [P, xe, ue, Ie]
+        stroke: [P, xe, ue, Oe]
       }],
       /**
        * Stroke
@@ -3460,23 +3460,29 @@ function or() {
   for (var e, r, a = 0, s = "", n = arguments.length; a < n; a++) (e = arguments[a]) && (r = at(e)) && (s && (s += " "), s += r);
   return s;
 }
-function T(...e) {
+function $(...e) {
   return sr(or(e));
 }
-const gr = ({
+const ar = {
+  sm: "w-16 h-16",
+  md: "w-24 h-24",
+  lg: "w-32 h-32",
+  xl: "w-40 h-40"
+}, kr = ({
   progress: e,
-  radius: r,
-  className: a = "",
-  children: s,
-  ariaLabel: n
+  size: r = "md",
+  radius: a = 20,
+  className: s = "",
+  children: n,
+  ariaLabel: c
 }) => {
-  const c = 2 * Math.PI * r, l = c / 2, i = l * (1 - e / 100), d = l * (1 - e / 100);
+  const l = 2 * Math.PI * a, i = l / 2, d = i * (1 - e / 100), g = i * (1 - e / 100);
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: T("relative", a),
+      className: $("relative", ar[r], s),
       role: "progressbar",
-      "aria-label": n || "Progress",
+      "aria-label": c || "Progress",
       "aria-valuenow": Math.max(0, Math.min(100, e)),
       "aria-valuemin": 0,
       "aria-valuemax": 100,
@@ -3492,13 +3498,13 @@ const gr = ({
                 {
                   cx: "25",
                   cy: "25",
-                  r,
+                  r: a,
                   fill: "none",
                   stroke: "var(--color-accent)",
                   strokeWidth: "4",
                   strokeLinecap: "butt",
-                  strokeDasharray: `${l * 0.98} ${c}`,
-                  strokeDashoffset: i,
+                  strokeDasharray: `${i * 0.98} ${l}`,
+                  strokeDashoffset: d,
                   transform: "rotate(-90 25 25)",
                   style: {
                     filter: "drop-shadow(0 0 8px var(--color-accent))"
@@ -3510,13 +3516,13 @@ const gr = ({
                 {
                   cx: "25",
                   cy: "25",
-                  r,
+                  r: a,
                   fill: "none",
                   stroke: "var(--color-primary)",
                   strokeWidth: "4",
                   strokeLinecap: "butt",
-                  strokeDasharray: `${l * 0.98} ${c}`,
-                  strokeDashoffset: d,
+                  strokeDasharray: `${i * 0.98} ${l}`,
+                  strokeDashoffset: g,
                   transform: "rotate(90 25 25)",
                   style: {
                     filter: "drop-shadow(0 0 8px var(--color-primary))"
@@ -3526,81 +3532,95 @@ const gr = ({
             ]
           }
         ),
-        s && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: s })
+        n && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: n })
       ]
     }
   );
-}, ar = {
+}, nr = {
   SEGMENT_COUNT: 20,
   SEGMENT_ANGLE: 360 / 20,
   GAP_ANGLE: 4,
   INNER_RADIUS: 18.5,
   OUTER_RADIUS: 23.5,
   OUTER_TICK_RADIUS: 30
-}, xr = ({
-  progress: e,
-  className: r = "",
-  children: a
-}) => {
+}, lr = {
+  sm: "w-16 h-16",
+  md: "w-24 h-24",
+  lg: "w-32 h-32",
+  xl: "w-40 h-40"
+}, ir = ({ progress: e, size: r = "md", className: a, children: s }) => {
   const {
-    SEGMENT_COUNT: s,
-    SEGMENT_ANGLE: n,
-    GAP_ANGLE: c,
-    INNER_RADIUS: l,
-    OUTER_RADIUS: i,
-    OUTER_TICK_RADIUS: d
-  } = ar, x = n - c;
-  return /* @__PURE__ */ t.jsxs("div", { className: T("relative", r), children: [
-    /* @__PURE__ */ t.jsxs(
-      "svg",
-      {
-        className: "w-full h-full",
-        viewBox: "0 0 60 60",
-        style: { overflow: "visible" },
-        children: [
-          [...Array(60)].map((b, g) => {
-            const m = 6 * g, v = g % 5 === 0 ? 6 : 3, y = "var(--color-muted)", w = 30 + d * Math.cos(m * Math.PI / 180), A = 30 + d * Math.sin(m * Math.PI / 180), C = 30 + (d - v) * Math.cos(m * Math.PI / 180), _ = 30 + (d - v) * Math.sin(m * Math.PI / 180);
-            return /* @__PURE__ */ t.jsx(
-              "line",
-              {
-                x1: w,
-                y1: A,
-                x2: C,
-                y2: _,
-                stroke: y,
-                strokeWidth: 1,
-                strokeLinecap: "round",
-                opacity: 0.7
-              },
-              `tick-${g}`
-            );
-          }),
-          [...Array(s)].map((b, g) => {
-            const m = n * g - 90 + c / 2, p = m + x, v = (z) => z * Math.PI / 180, y = 30 + l * Math.cos(v(m)), w = 30 + l * Math.sin(v(m)), A = 30 + i * Math.cos(v(m)), C = 30 + i * Math.sin(v(m)), _ = 30 + i * Math.cos(v(p)), $ = 30 + i * Math.sin(v(p)), k = 30 + l * Math.cos(v(p)), L = 30 + l * Math.sin(v(p)), G = `M ${y} ${w} L ${A} ${C} L ${_} ${$} L ${k} ${L} Z`, h = g < Math.floor(e / 5);
-            return /* @__PURE__ */ t.jsx(
-              "path",
-              {
-                d: G,
-                fill: h ? "var(--color-accent)" : "var(--color-border-default)",
-                style: {
-                  filter: h ? "drop-shadow(0 0 6px var(--color-accent))" : "none",
-                  transition: "fill 0.3s ease"
-                }
-              },
-              `segment-${g}`
-            );
-          })
-        ]
-      }
-    ),
-    a && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: a })
+    SEGMENT_COUNT: n,
+    SEGMENT_ANGLE: c,
+    GAP_ANGLE: l,
+    INNER_RADIUS: i,
+    OUTER_RADIUS: d,
+    OUTER_TICK_RADIUS: g
+  } = nr, m = c - l;
+  return /* @__PURE__ */ t.jsxs("div", { className: $("relative", lr[r], a), children: [
+    /* @__PURE__ */ t.jsxs("svg", { className: "w-full h-full", viewBox: "0 0 60 60", style: { overflow: "visible" }, children: [
+      [...Array(60)].map((y, p) => {
+        const h = 6 * p, x = p % 5 === 0 ? 6 : 3, v = 30 + g * Math.cos(h * Math.PI / 180), A = 30 + g * Math.sin(h * Math.PI / 180), N = 30 + (g - x) * Math.cos(h * Math.PI / 180), T = 30 + (g - x) * Math.sin(h * Math.PI / 180);
+        return /* @__PURE__ */ t.jsx(
+          "line",
+          {
+            x1: v,
+            y1: A,
+            x2: N,
+            y2: T,
+            stroke: "var(--color-muted)",
+            strokeWidth: 1,
+            strokeLinecap: "round",
+            opacity: 0.7
+          },
+          `tick-${p}`
+        );
+      }),
+      [...Array(n)].map((y, p) => {
+        const h = c * p - 90 + l / 2, w = h + m, x = (M) => M * Math.PI / 180, v = 30 + i * Math.cos(x(h)), A = 30 + i * Math.sin(x(h)), N = 30 + d * Math.cos(x(h)), T = 30 + d * Math.sin(x(h)), _ = 30 + d * Math.cos(x(w)), C = 30 + d * Math.sin(x(w)), z = 30 + i * Math.cos(x(w)), G = 30 + i * Math.sin(x(w)), f = p < Math.floor(e / 5);
+        return /* @__PURE__ */ t.jsx(
+          "path",
+          {
+            d: `M ${v} ${A} L ${N} ${T} L ${_} ${C} L ${z} ${G} Z`,
+            fill: f ? "var(--color-accent)" : "var(--color-border-default)",
+            style: {
+              filter: f ? "drop-shadow(0 0 6px var(--color-accent))" : "none",
+              transition: "fill 0.3s ease"
+            }
+          },
+          `segment-${p}`
+        );
+      })
+    ] }),
+    s && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: s })
   ] });
-}, yr = ({
+}, cr = {
+  sm: "h-3",
+  md: "h-5",
+  lg: "h-7",
+  xl: "h-9"
+}, dr = ({ progress: e, segments: r = 10, size: a = "md", className: s }) => {
+  const n = Math.round(Math.min(100, Math.max(0, e)) / 100 * r);
+  return /* @__PURE__ */ t.jsx("div", { className: $("flex gap-1 w-full", s), children: [...Array(r)].map((c, l) => {
+    const i = l < n;
+    return /* @__PURE__ */ t.jsx(
+      "div",
+      {
+        className: $("flex-1 rounded-sm transition-all duration-300", cr[a]),
+        style: {
+          backgroundColor: i ? "var(--color-accent)" : "var(--color-border-default)",
+          boxShadow: i ? "0 0 6px var(--color-accent)" : "none"
+        }
+      },
+      l
+    );
+  }) });
+}, jr = (e) => e.variant === "block" ? /* @__PURE__ */ t.jsx(dr, { ...e }) : /* @__PURE__ */ t.jsx(ir, { ...e }), Nr = ({
   progress: e,
   size: r = "md",
   className: a = ""
 }) => {
-  const s = (x) => V(x, oe.linearProgress.width), n = (x) => V(x, oe.linearProgress.height), c = s(r), l = n(r), i = T("bg-surface rounded-full shadow-inner", l, a || c), d = T("bg-gradient-to-r from-accent to-primary rounded-full shadow-lg-accent transition-all duration-500 ease-out", l);
+  const s = (g) => H(g, ae.linearProgress.width), n = (g) => H(g, ae.linearProgress.height), c = s(r), l = n(r), i = $("bg-surface rounded-full shadow-inner", l, a || c), d = $("bg-gradient-to-r from-accent to-primary rounded-full shadow-lg-accent transition-all duration-500 ease-out", l);
   return /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -3618,14 +3638,14 @@ const gr = ({
       )
     }
   );
-}, nr = ({
+}, ur = ({
   type: e,
   title: r,
   message: a,
   size: s = "md",
   onClose: n
 }) => {
-  const c = (g) => V(g, oe.notification), i = (() => {
+  const c = (y) => H(y, ae.notification), i = (() => {
     switch (e) {
       case "success":
         return {
@@ -3673,8 +3693,8 @@ const gr = ({
           icon: null
         };
     }
-  })(), d = c(s), x = e === "error" ? "alert" : "status", b = e === "warning" ? "hover:text-default/70" : "hover:text-base/70";
-  return /* @__PURE__ */ t.jsxs("div", { className: `flex items-start rounded-lg ${d} ${i.container}`, role: x, "aria-atomic": "true", children: [
+  })(), d = c(s), g = e === "error" ? "alert" : "status", m = e === "warning" ? "hover:text-default/70" : "hover:text-base/70";
+  return /* @__PURE__ */ t.jsxs("div", { className: `flex items-start rounded-lg ${d} ${i.container}`, role: g, "aria-atomic": "true", children: [
     /* @__PURE__ */ t.jsx("div", { className: "flex-shrink-0", children: i.icon }),
     /* @__PURE__ */ t.jsxs("div", { className: "flex-1", children: [
       /* @__PURE__ */ t.jsx("h4", { className: `font-bold ${i.textColor}`, children: r }),
@@ -3683,7 +3703,7 @@ const gr = ({
     n && /* @__PURE__ */ t.jsx(
       "button",
       {
-        className: `flex-shrink-0 ${i.textColor} ${b} transition-colors cursor-pointer`,
+        className: `flex-shrink-0 ${i.textColor} ${m} transition-colors cursor-pointer`,
         onClick: n,
         "aria-label": "Close notification",
         children: /* @__PURE__ */ t.jsx("svg", { className: "w-5 h-5", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ t.jsx(
@@ -3716,41 +3736,40 @@ const gr = ({
     "transition-all",
     "duration-300",
     "ease-in-out",
-    "transform",
     "focus:outline-none",
     s ? "cursor-not-allowed" : "cursor-pointer"
-  ].join(" "), i = (g) => V(g, oe.button), d = (g, m) => ({
+  ].join(" "), i = (y) => H(y, ae.button), d = (y, p) => ({
     primary: {
-      enabled: "bg-linear-(--gradient-accent) text-base shadow-primary border-none hover:shadow-lg-accent hover:scale-105 focus-visible:ring-2 focus-visible:ring-accent/50 active:scale-95",
-      disabled: "bg-base border-2 border-accent/20 text-accent/40 shadow-none opacity-50 hover:scale-100"
+      enabled: "bg-linear-(--gradient-accent) text-base shadow-primary border-none hover:shadow-lg-accent hover:brightness-110 focus-visible:ring-2 focus-visible:ring-accent/50 active:scale-95",
+      disabled: "bg-base border-2 border-accent/20 text-accent/40 shadow-none opacity-50"
     },
     secondary: {
-      enabled: "bg-surface border-2 border-secondary text-secondary shadow-secondary/30 hover:bg-secondary hover:text-base hover:shadow-secondary hover:scale-105 focus-visible:ring-2 focus-visible:ring-secondary/50 active:scale-95",
-      disabled: "bg-base border-2 border-secondary/20 text-secondary/40 shadow-none opacity-50 hover:bg-base hover:text-secondary/40 hover:scale-100"
+      enabled: "bg-surface border-2 border-secondary text-secondary shadow-secondary/30 hover:bg-secondary hover:text-base hover:shadow-secondary focus-visible:ring-2 focus-visible:ring-secondary/50 active:scale-95",
+      disabled: "bg-base border-2 border-secondary/20 text-secondary/40 shadow-none opacity-50"
     },
     danger: {
-      enabled: "bg-surface border-2 border-error text-error shadow-error/30 hover:bg-error hover:text-base hover:shadow-error hover:scale-105 focus-visible:ring-2 focus-visible:ring-error/50 active:scale-95",
-      disabled: "bg-base border-2 border-error/20 text-error/40 shadow-none opacity-50 hover:bg-base hover:text-error/40 hover:scale-100"
+      enabled: "bg-surface border-2 border-error text-error shadow-error/30 hover:bg-error hover:text-base hover:shadow-error focus-visible:ring-2 focus-visible:ring-error/50 active:scale-95",
+      disabled: "bg-base border-2 border-error/20 text-error/40 shadow-none opacity-50"
     },
     ghost: {
-      enabled: "bg-surface border-2 border-accent text-accent shadow-secondary hover:bg-accent hover:text-base hover:shadow-lg-accent hover:scale-105 focus-visible:ring-2 focus-visible:ring-accent/50 active:scale-95",
-      disabled: "bg-base border-2 border-accent/10 text-muted/60 shadow-none opacity-40 hover:bg-base hover:text-muted/60 hover:scale-100"
+      enabled: "bg-surface border-2 border-accent text-accent shadow-secondary hover:bg-accent hover:text-base hover:shadow-lg-accent focus-visible:ring-2 focus-visible:ring-accent/50 active:scale-95",
+      disabled: "bg-base border-2 border-accent/10 text-muted/60 shadow-none opacity-40"
     }
-  })[g][m ? "disabled" : "enabled"], x = T(l, i(r), d(e, s), a), b = e === "primary" && !s;
+  })[y][p ? "disabled" : "enabled"], g = $(l, i(r), d(e, s), a), m = e === "primary" && !s;
   return /* @__PURE__ */ t.jsxs(
     "button",
     {
-      className: x,
+      className: g,
       disabled: s,
       ...c,
       children: [
         /* @__PURE__ */ t.jsx("span", { className: "relative z-10", children: n }),
-        b && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/20 to-transparent -translate-x-full group-hover:translate-x-full transition-transform duration-700" }),
+        m && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/20 to-transparent -translate-x-full group-hover:translate-x-full transition-transform duration-700" }),
         s && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 bg-gradient-to-br from-transparent via-base/10 to-transparent pointer-events-none" })
       ]
     }
   );
-}, vr = ({
+}, Cr = ({
   variant: e = "primary",
   size: r = "md",
   label: a,
@@ -3760,9 +3779,9 @@ const gr = ({
   rightIcon: l,
   className: i = "",
   disabled: d = !1,
-  ...x
+  ...g
 }) => {
-  const b = Fe(), g = x.id || b, m = [
+  const m = Be(), y = g.id || m, p = [
     "w-full",
     "rounded-lg",
     "bg-surface",
@@ -3772,45 +3791,45 @@ const gr = ({
     "duration-300",
     "focus:outline-none",
     d ? "cursor-not-allowed opacity-60" : "cursor-text"
-  ].join(" "), p = ($) => V($, oe.input), v = ($) => {
-    const k = p($);
-    return c && l ? `pl-10 pr-10 ${k}` : c ? `pl-10 pr-4 ${k}` : l ? `pl-4 pr-10 ${k}` : `px-4 ${k}`;
-  }, y = ($, k, L) => k ? "border-2 border-error shadow-error/30 hover:shadow-error focus:ring-2 focus:ring-error focus:shadow-error active:bg-base" : L ? {
+  ].join(" "), h = (_) => H(_, ae.input), w = (_) => {
+    const C = h(_);
+    return c && l ? `pl-10 pr-10 ${C}` : c ? `pl-10 pr-4 ${C}` : l ? `pl-4 pr-10 ${C}` : `px-4 ${C}`;
+  }, x = (_, C, z) => C ? "border-2 border-error shadow-error/30 hover:shadow-error focus:ring-2 focus:ring-error focus:shadow-error active:bg-base" : z ? {
     primary: "border-2 border-accent/20 shadow-none",
     secondary: "border-2 border-secondary/20 shadow-none",
     danger: "border-2 border-error/20 shadow-none",
     ghost: "border border-border-default shadow-none"
-  }[$] : {
+  }[_] : {
     primary: "border-2 border-accent shadow-input-accent hover:shadow-lg-accent focus:ring-2 focus:ring-accent focus:shadow-lg-accent active:bg-base",
     secondary: "border-2 border-secondary shadow-secondary/30 hover:shadow-secondary focus:ring-2 focus:ring-secondary focus:shadow-secondary active:bg-base",
     danger: "border-2 border-error shadow-error/30 hover:shadow-error focus:ring-2 focus:ring-error focus:shadow-error active:bg-base",
     ghost: "border border-border-default shadow-none hover:border-accent focus:ring-2 focus:ring-accent focus:border-accent active:bg-base"
-  }[$], w = ($) => ({
+  }[_], v = (_) => ({
     primary: "text-accent",
     secondary: "text-secondary",
     danger: "text-error",
     ghost: "text-muted"
-  })[$], A = T(m, v(r), y(e, !!n, d), i), C = w(e), _ = n ? `${g}-error` : s ? `${g}-help` : void 0;
+  })[_], A = $(p, w(r), x(e, !!n, d), i), N = v(e), T = n ? `${y}-error` : s ? `${y}-help` : void 0;
   return /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
-    a && /* @__PURE__ */ t.jsx("label", { htmlFor: g, className: "block text-sm font-medium text-default", children: a }),
+    a && /* @__PURE__ */ t.jsx("label", { htmlFor: y, className: "block text-sm font-medium text-default", children: a }),
     /* @__PURE__ */ t.jsxs("div", { className: "relative", children: [
-      c && /* @__PURE__ */ t.jsx("div", { className: `absolute inset-y-0 left-0 flex items-center pl-3 ${C}`, children: c }),
+      c && /* @__PURE__ */ t.jsx("div", { className: `absolute inset-y-0 left-0 flex items-center pl-3 ${N}`, children: c }),
       /* @__PURE__ */ t.jsx(
         "input",
         {
           className: A,
           disabled: d,
-          id: g,
+          id: y,
           "aria-invalid": !!n,
-          "aria-describedby": _,
-          ...x
+          "aria-describedby": T,
+          ...g
         }
       ),
-      l && /* @__PURE__ */ t.jsx("div", { className: `absolute inset-y-0 right-0 flex items-center pr-3 ${C}`, children: l })
+      l && /* @__PURE__ */ t.jsx("div", { className: `absolute inset-y-0 right-0 flex items-center pr-3 ${N}`, children: l })
     ] }),
-    (s || n) && /* @__PURE__ */ t.jsx("div", { id: n ? `${g}-error` : `${g}-help`, className: `text-xs font-mono ${n ? "text-error" : "text-muted"}`, children: n || s })
+    (s || n) && /* @__PURE__ */ t.jsx("div", { id: n ? `${y}-error` : `${y}-help`, className: `text-xs font-mono ${n ? "text-error" : "text-muted"}`, children: n || s })
   ] });
-}, wr = ({
+}, Sr = ({
   variant: e = "default",
   size: r = "md",
   title: a,
@@ -3819,19 +3838,19 @@ const gr = ({
   className: c = "",
   ...l
 }) => {
-  const i = (b) => V(b, oe.card), d = (b) => {
-    const g = i(r);
+  const i = (m) => H(m, ae.card), d = (m) => {
+    const y = i(r);
     return {
-      default: `bg-base border border-border-default rounded-xl ${g}`,
-      accent: `bg-surface border-2 border-accent rounded-xl shadow-input-accent/50 hover:shadow-lg-accent transition-all duration-300 transform ${g}`,
-      small: `bg-base rounded-lg border border-border-default ${g}`
-    }[b];
-  }, x = (b) => b ? "text-xl font-semibold text-secondary mb-4 border-b border-accent pb-2" : "text-xl font-semibold text-secondary mb-4";
-  return /* @__PURE__ */ t.jsxs("div", { className: T(d(e), c), ...l, children: [
-    a && /* @__PURE__ */ t.jsx("h3", { className: x(s), children: a }),
+      default: `bg-base border border-border-default rounded-xl text-primary ${y}`,
+      accent: `bg-surface border-2 border-accent rounded-xl shadow-input-accent/50 hover:shadow-lg-accent transition-all duration-300 transform text-primary ${y}`,
+      small: `bg-base rounded-lg border border-border-default text-primary ${y}`
+    }[m];
+  }, g = (m) => m ? "text-xl font-semibold text-secondary mb-4 border-b border-accent pb-2" : "text-xl font-semibold text-secondary mb-4";
+  return /* @__PURE__ */ t.jsxs("div", { className: $(d(e), c), ...l, children: [
+    a && /* @__PURE__ */ t.jsx("h3", { className: g(s), children: a }),
     n
   ] });
-}, kr = ({
+}, Er = ({
   variant: e = "primary",
   size: r = "md",
   children: a,
@@ -3842,25 +3861,25 @@ const gr = ({
   onClick: i,
   ...d
 }) => {
-  const x = (m) => V(m, oe.badge), b = (m) => ({
-    primary: "text-base bg-primary shadow-lg",
-    secondary: "text-base bg-secondary shadow-lg",
-    accent: "text-base bg-accent shadow-lg",
-    success: "text-base bg-success shadow-lg",
-    error: "text-base bg-error shadow-lg",
-    warning: "text-base bg-warning shadow-lg"
-  })[m], g = (m, p) => !p && !i ? "transition-shadow" : {
+  const g = (p) => H(p, ae.badge), m = (p) => ({
+    primary: "bg-primary shadow-lg",
+    secondary: "bg-secondary shadow-lg",
+    accent: "bg-accent shadow-lg",
+    success: "bg-success shadow-lg",
+    error: "bg-error shadow-lg",
+    warning: "bg-warning shadow-lg"
+  })[p], y = (p, h) => !h && !i ? "transition-shadow" : {
     primary: "hover:shadow-primary transition-shadow cursor-pointer",
     secondary: "hover:shadow-secondary transition-shadow cursor-pointer",
     accent: "hover:shadow-lg-accent transition-shadow cursor-pointer",
     success: "hover:shadow-success transition-shadow cursor-pointer",
     error: "hover:shadow-error transition-shadow cursor-pointer",
     warning: "hover:shadow-warning transition-shadow cursor-pointer"
-  }[m];
+  }[p];
   return /* @__PURE__ */ t.jsxs(
     "span",
     {
-      className: T("inline-flex items-center rounded-full font-semibold", x(r), b(e), g(e, l || !!i), s),
+      className: $("inline-flex items-center rounded-full font-semibold", g(r), m(e), y(e, l || !!i), s),
       onClick: i,
       ...d,
       children: [
@@ -3870,7 +3889,7 @@ const gr = ({
       ]
     }
   );
-}, jr = ({
+}, _r = ({
   label: e,
   size: r = "md",
   variant: a = "primary",
@@ -3881,34 +3900,34 @@ const gr = ({
   id: i,
   ...d
 }) => {
-  const x = (y) => {
-    l || c && c(y.target.checked);
-  }, b = (y) => V(y, {
+  const g = (x) => {
+    l || c && c(x.target.checked);
+  }, m = (x) => H(x, {
     sm: "w-10 h-5 after:h-4 after:w-4",
     md: "w-14 h-7 after:h-6 after:w-6",
     lg: "w-16 h-8 after:h-7 after:w-7"
-  }), g = (y, w) => {
-    if (w)
+  }), y = (x, v) => {
+    if (v)
       return "bg-gray-600 peer-checked:bg-gray-500 opacity-50 cursor-not-allowed";
     const A = {
       primary: "bg-gray-600 peer-checked:bg-linear-(--gradient-accent) peer-focus:ring-primary",
       secondary: "bg-gray-600 peer-checked:bg-secondary peer-focus:ring-secondary",
       accent: "bg-gray-600 peer-checked:bg-accent peer-focus:ring-accent"
     };
-    return A[y] || A.primary;
-  }, m = T(
+    return A[x] || A.primary;
+  }, p = $(
     "relative inline-flex items-center",
     l ? "cursor-not-allowed opacity-50" : "cursor-pointer"
-  ), p = T(
-    b(r),
-    g(a, l),
+  ), h = $(
+    m(r),
+    y(a, l),
     "peer-focus:outline-none rounded-full peer",
     "peer-checked:after:translate-x-full peer-checked:after:border-white",
     "after:content-[''] after:absolute after:top-[2px] after:left-[2px]",
     "after:bg-white after:rounded-full after:transition-all",
     "transition-colors duration-300"
-  ), v = T("flex items-center justify-between", e && "space-x-3", s);
-  return /* @__PURE__ */ t.jsxs("div", { className: v, children: [
+  ), w = $("flex items-center justify-between", e && "space-x-3", s);
+  return /* @__PURE__ */ t.jsxs("div", { className: w, children: [
     e && /* @__PURE__ */ t.jsx(
       "label",
       {
@@ -3917,23 +3936,23 @@ const gr = ({
         children: e
       }
     ),
-    /* @__PURE__ */ t.jsxs("label", { className: m, children: [
+    /* @__PURE__ */ t.jsxs("label", { className: p, children: [
       /* @__PURE__ */ t.jsx(
         "input",
         {
           type: "checkbox",
           className: "sr-only peer",
           checked: n,
-          onChange: x,
+          onChange: g,
           disabled: l,
           id: i,
           ...d
         }
       ),
-      /* @__PURE__ */ t.jsx("div", { className: p })
+      /* @__PURE__ */ t.jsx("div", { className: h })
     ] })
   ] });
-}, Nr = ({
+}, $r = ({
   label: e,
   size: r = "md",
   variant: a = "primary",
@@ -3943,53 +3962,58 @@ const gr = ({
   error: l,
   className: i = "",
   disabled: d = !1,
-  id: x,
-  name: b,
-  ...g
+  id: g,
+  name: m,
+  onValueChange: y,
+  onChange: p,
+  ...h
 }) => {
-  const m = Fe(), p = x || m, v = b || p, y = (k) => V(k, oe.input), w = (k, L, G) => {
-    if (L)
+  const w = (f) => {
+    p?.(f), y?.(f.target.value);
+  }, x = Be(), v = g || x, A = m || v, N = (f) => H(f, ae.input), T = (f, M, V) => {
+    if (M)
       return "bg-base border-2 border-border-default/30 text-muted/50 cursor-not-allowed opacity-50";
-    if (G)
+    if (V)
       return "bg-surface border-2 border-error text-default focus:ring-2 focus:ring-error focus:border-error shadow-error";
-    const h = {
+    const X = {
       primary: "bg-surface border-2 border-border-default text-default focus:ring-2 focus:ring-primary focus:border-primary shadow-primary",
       secondary: "bg-surface border-2 border-secondary text-default focus:ring-2 focus:ring-secondary focus:border-secondary shadow-secondary/30",
       danger: "bg-surface border-2 border-error text-default focus:ring-2 focus:ring-error focus:border-error shadow-error/30",
       ghost: "bg-base border-2 border-accent/20 text-default focus:ring-2 focus:ring-accent focus:border-accent shadow-secondary"
     };
-    return h[k] || h.primary;
-  }, A = T(
+    return X[f] || X.primary;
+  }, _ = $(
     "appearance-none w-full rounded-lg font-mono transition-all duration-300 focus:outline-none px-4 pr-10",
-    y(r),
-    w(a, d, !!l),
+    N(r),
+    T(a, d, !!l),
     i
-  ), C = "relative w-full", _ = T(
+  ), C = "relative w-full", z = $(
     "block text-sm font-medium mb-2 transition-colors duration-200",
     d ? "text-muted opacity-50" : l ? "text-error" : "text-default"
-  ), $ = T("mt-2 text-xs transition-colors duration-200", l ? "text-error" : "text-muted");
+  ), G = $("mt-2 text-xs transition-colors duration-200", l ? "text-error" : "text-muted");
   return /* @__PURE__ */ t.jsxs("div", { className: "w-full", children: [
-    e && /* @__PURE__ */ t.jsx("label", { htmlFor: p, className: _, children: e }),
+    e && /* @__PURE__ */ t.jsx("label", { htmlFor: v, className: z, children: e }),
     /* @__PURE__ */ t.jsxs("div", { className: C, children: [
       /* @__PURE__ */ t.jsxs(
         "select",
         {
-          className: A,
+          className: _,
           disabled: d,
-          id: p,
-          name: v,
-          ...g,
+          id: v,
+          name: A,
+          onChange: w,
+          ...h,
           children: [
             n && /* @__PURE__ */ t.jsx("option", { value: "", disabled: !0, children: n }),
-            s.map((k) => /* @__PURE__ */ t.jsx(
+            s.map((f) => /* @__PURE__ */ t.jsx(
               "option",
               {
-                value: k.value,
-                disabled: k.disabled,
+                value: f.value,
+                disabled: f.disabled,
                 className: "bg-surface text-default",
-                children: k.label
+                children: f.label
               },
-              k.value
+              f.value
             ))
           ]
         }
@@ -4009,9 +4033,9 @@ const gr = ({
         }
       )
     ] }),
-    (c || l) && /* @__PURE__ */ t.jsx("div", { className: $, children: l || c })
+    (c || l) && /* @__PURE__ */ t.jsx("div", { className: G, children: l || c })
   ] });
-}, Cr = ({
+}, Tr = ({
   variant: e = "text",
   size: r = "md",
   width: a,
@@ -4020,46 +4044,46 @@ const gr = ({
   lines: c = 3,
   animate: l = !0
 }) => {
-  const d = T("bg-gray-600", l && "animate-pulse", ((b) => V(b, oe.skeleton))(r), n), x = () => {
-    const b = {};
-    return a && (b.width = typeof a == "number" ? `${a}px` : a), s && (b.height = typeof s == "number" ? `${s}px` : s), b;
+  const d = $("bg-gray-600", l && "animate-pulse", ((m) => H(m, ae.skeleton))(r), n), g = () => {
+    const m = {};
+    return a && (m.width = typeof a == "number" ? `${a}px` : a), s && (m.height = typeof s == "number" ? `${s}px` : s), m;
   };
   if (e === "text")
-    return /* @__PURE__ */ t.jsx("div", { className: `space-y-3 ${n}`, children: Array.from({ length: c }).map((b, g) => {
-      const p = g === c - 1 ? "w-2/3" : g % 2 === 0 ? "w-full" : "w-5/6";
+    return /* @__PURE__ */ t.jsx("div", { className: `space-y-3 ${n}`, children: Array.from({ length: c }).map((m, y) => {
+      const h = y === c - 1 ? "w-2/3" : y % 2 === 0 ? "w-full" : "w-5/6";
       return /* @__PURE__ */ t.jsx(
         "div",
         {
-          className: `h-3 rounded ${d} ${p}`,
-          style: x()
+          className: `h-3 rounded ${d} ${h}`,
+          style: g()
         },
-        g
+        y
       );
     }) });
   if (e === "circular") {
-    const b = r === "sm" ? "h-12 w-12" : r === "lg" ? "h-20 w-20" : "h-16 w-16";
+    const m = r === "sm" ? "h-12 w-12" : r === "lg" ? "h-20 w-20" : "h-16 w-16";
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: `rounded-full ${d} ${b}`,
-        style: x()
+        className: `rounded-full ${d} ${m}`,
+        style: g()
       }
     );
   }
   if (e === "rectangular") {
-    const b = r === "sm" ? "h-20" : r === "lg" ? "h-40" : "h-32";
+    const m = r === "sm" ? "h-20" : r === "lg" ? "h-40" : "h-32";
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: `rounded-lg ${d} w-full ${b}`,
-        style: x()
+        className: `rounded-lg ${d} w-full ${m}`,
+        style: g()
       }
     );
   }
   if (e === "avatar-text") {
-    const b = r === "sm" ? "h-12 w-12" : r === "lg" ? "h-20 w-20" : "h-16 w-16";
+    const m = r === "sm" ? "h-12 w-12" : r === "lg" ? "h-20 w-20" : "h-16 w-16";
     return /* @__PURE__ */ t.jsxs("div", { className: `flex items-center space-x-4 ${n}`, children: [
-      /* @__PURE__ */ t.jsx("div", { className: `rounded-full ${d} ${b}` }),
+      /* @__PURE__ */ t.jsx("div", { className: `rounded-full ${d} ${m}` }),
       /* @__PURE__ */ t.jsxs("div", { className: "flex-1 space-y-3", children: [
         /* @__PURE__ */ t.jsx("div", { className: `h-4 rounded w-3/4 ${d}` }),
         /* @__PURE__ */ t.jsx("div", { className: `h-3 rounded w-1/2 ${d}` })
@@ -4067,18 +4091,18 @@ const gr = ({
     ] });
   }
   if (e === "button-group") {
-    const b = r === "sm" ? "h-8" : r === "lg" ? "h-12" : "h-10";
+    const m = r === "sm" ? "h-8" : r === "lg" ? "h-12" : "h-10";
     return /* @__PURE__ */ t.jsxs("div", { className: `flex space-x-4 ${n}`, children: [
-      /* @__PURE__ */ t.jsx("div", { className: `${b} rounded w-20 ${d}` }),
-      /* @__PURE__ */ t.jsx("div", { className: `${b} rounded w-24 ${d}` })
+      /* @__PURE__ */ t.jsx("div", { className: `${m} rounded w-20 ${d}` }),
+      /* @__PURE__ */ t.jsx("div", { className: `${m} rounded w-24 ${d}` })
     ] });
   }
   if (e === "card") {
-    const b = r === "sm" ? "p-4" : r === "lg" ? "p-8" : "p-6";
+    const m = r === "sm" ? "p-4" : r === "lg" ? "p-8" : "p-6";
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: `border border-border-default rounded-lg bg-surface ${b} space-y-4 ${n}`,
+        className: `border border-border-default rounded-lg bg-surface ${m} space-y-4 ${n}`,
         children: l && /* @__PURE__ */ t.jsxs("div", { className: "animate-pulse space-y-4", children: [
           /* @__PURE__ */ t.jsxs("div", { className: "flex items-center space-x-4", children: [
             /* @__PURE__ */ t.jsx("div", { className: `rounded-full ${d} h-16 w-16` }),
@@ -4104,14 +4128,14 @@ const gr = ({
     "div",
     {
       className: `h-4 rounded ${d} w-full`,
-      style: x()
+      style: g()
     }
   );
-}, lr = {
+}, mr = {
   openDuration: 50,
   closeDuration: 350,
   cyberpunkEffects: !0
-}, je = $e(
+}, je = _e(
   ({
     src: e,
     alt: r,
@@ -4122,35 +4146,35 @@ const gr = ({
     className: l = "",
     animation: i,
     eager: d = !1,
-    previewClassName: x = "",
-    onPreviewOpen: b,
-    onPreviewClose: g,
-    onLoad: m,
-    onError: p,
-    ...v
+    previewClassName: g = "",
+    onPreviewOpen: m,
+    onPreviewClose: y,
+    onLoad: p,
+    onError: h,
+    ...w
   }) => {
-    const y = { ...lr, ...i }, [w, A] = X(!1), [C, _] = X(!1), [$, k] = X(!1), [L, G] = X(!0), [h, z] = X(!1), [U, q] = X(!1), Q = te(null), re = te(null), ee = D(
-      (S) => V(S, oe.card),
+    const x = { ...mr, ...i }, [v, A] = Z(!1), [N, T] = Z(!1), [_, C] = Z(!1), [z, G] = Z(!0), [f, M] = Z(!1), [V, X] = Z(!1), Q = te(null), re = te(null), ee = D(
+      (S) => H(S, ae.card),
       []
-    ), B = D(
+    ), F = D(
       (S) => {
-        G(!1), z(!1), m?.(S);
+        G(!1), M(!1), p?.(S);
       },
-      [m]
-    ), H = D(
+      [p]
+    ), U = D(
       (S) => {
-        G(!1), n && !U ? (q(!0), z(!1)) : z(!0), p?.(S);
+        G(!1), n && !V ? (X(!0), M(!1)) : M(!0), h?.(S);
       },
-      [p, n, U]
-    ), Z = D(() => {
-      s && !h && (k(!0), A(!0), b?.(), setTimeout(() => {
-        k(!1);
-      }, y.openDuration));
-    }, [s, h, b, y.openDuration]), Y = D(() => {
-      _(!0), g?.(), setTimeout(() => {
-        A(!1), _(!1);
-      }, y.closeDuration);
-    }, [g, y.closeDuration]), K = D(
+      [h, n, V]
+    ), q = D(() => {
+      s && !f && (C(!0), A(!0), m?.(), setTimeout(() => {
+        C(!1);
+      }, x.openDuration));
+    }, [s, f, m, x.openDuration]), Y = D(() => {
+      T(!0), y?.(), setTimeout(() => {
+        A(!1), T(!1);
+      }, x.closeDuration);
+    }, [y, x.closeDuration]), K = D(
       (S) => {
         (S.target === Q.current || S.target === S.currentTarget) && Y();
       },
@@ -4161,43 +4185,43 @@ const gr = ({
       },
       [Y]
     );
-    ae(() => {
-      if (w) {
+    oe(() => {
+      if (v) {
         document.addEventListener("keydown", o);
-        const S = document.body.style.overflow, E = document.documentElement.style.scrollbarGutter, O = document.body.style.paddingRight, W = window.innerWidth - document.documentElement.clientWidth;
+        const S = document.body.style.overflow, E = document.documentElement.style.scrollbarGutter, I = document.body.style.paddingRight, W = window.innerWidth - document.documentElement.clientWidth;
         return document.body.style.overflow = "hidden", document.body.style.paddingRight = `${W}px`, document.documentElement.style.scrollbarGutter = "auto", () => {
-          document.removeEventListener("keydown", o), document.body.style.overflow = S, document.body.style.paddingRight = O, document.documentElement.style.scrollbarGutter = E;
+          document.removeEventListener("keydown", o), document.body.style.overflow = S, document.body.style.paddingRight = I, document.documentElement.style.scrollbarGutter = E;
         };
       }
-    }, [w, o]);
-    const u = be(
-      () => T(
+    }, [v, o]);
+    const u = pe(
+      () => $(
         "relative rounded-lg overflow-hidden border-2 border-accent/30 transition-all duration-300 ease-in-out transform flex justify-center content-center",
-        s && !h ? "cursor-pointer hover:scale-105 hover:border-accent hover:shadow-lg-accent focus:outline-none focus:ring-4 focus:ring-accent/50" : "",
+        s && !f ? "cursor-pointer hover:scale-105 hover:border-accent hover:shadow-lg-accent focus:outline-none focus:ring-4 focus:ring-accent/50" : "",
         ee(a),
         l
       ),
-      [s, h, ee, a, l]
-    ), f = be(
+      [s, f, ee, a, l]
+    ), b = pe(
       () => ({
         role: s ? "button" : "img",
-        tabIndex: s && !h ? 0 : -1,
+        tabIndex: s && !f ? 0 : -1,
         "aria-label": s ? `${r}. Click to enlarge` : r,
-        "aria-expanded": s ? w : void 0,
-        onKeyDown: s && !h ? (S) => {
-          (S.key === "Enter" || S.key === " ") && (S.preventDefault(), Z());
+        "aria-expanded": s ? v : void 0,
+        onKeyDown: s && !f ? (S) => {
+          (S.key === "Enter" || S.key === " ") && (S.preventDefault(), q());
         } : void 0
       }),
-      [s, h, r, w, Z]
-    ), R = be(
+      [s, f, r, v, q]
+    ), R = pe(
       () => /* @__PURE__ */ t.jsxs(
         "div",
         {
           className: u,
-          onClick: Z,
-          ...f,
+          onClick: q,
+          ...b,
           children: [
-            L && /* @__PURE__ */ t.jsx(
+            z && /* @__PURE__ */ t.jsx(
               "div",
               {
                 className: "absolute m-0 inset-0 flex items-center justify-center bg-surface border-2 border-accent/20",
@@ -4206,7 +4230,7 @@ const gr = ({
                 children: c || /* @__PURE__ */ t.jsx("div", { className: "animate-pulse bg-gradient-to-r from-accent/20 to-secondary/20 w-full h-full flex items-center justify-center", children: /* @__PURE__ */ t.jsx("div", { className: "text-muted text-sm", children: "Loading..." }) })
               }
             ),
-            h ? /* @__PURE__ */ t.jsx(
+            f ? /* @__PURE__ */ t.jsx(
               "div",
               {
                 className: "flex items-center justify-center bg-surface border-2 border-error/30 text-error p-4 rounded-lg min-h-[100px]",
@@ -4217,21 +4241,21 @@ const gr = ({
                   /* @__PURE__ */ t.jsx("div", { className: "text-sm", children: "Failed to load image" })
                 ] })
               }
-            ) : U ? /* @__PURE__ */ t.jsx(
+            ) : V ? /* @__PURE__ */ t.jsx(
               "img",
               {
                 ref: re,
                 src: n,
                 alt: `${r} (fallback)`,
                 className: "w-full h-full m-0 object-cover transition-opacity duration-300",
-                style: { opacity: L ? 0 : 1 },
-                onLoad: B,
+                style: { opacity: z ? 0 : 1 },
+                onLoad: F,
                 onError: () => {
-                  z(!0), q(!1);
+                  M(!0), X(!1);
                 },
                 loading: d ? "eager" : "lazy",
                 decoding: "async",
-                ...v
+                ...w
               }
             ) : /* @__PURE__ */ t.jsx(
               "img",
@@ -4240,15 +4264,15 @@ const gr = ({
                 src: e,
                 alt: r,
                 className: "w-full h-full m-0 object-cover transition-opacity duration-300",
-                style: { opacity: L ? 0 : 1 },
-                onLoad: B,
-                onError: H,
+                style: { opacity: z ? 0 : 1 },
+                onLoad: F,
+                onError: U,
                 loading: d ? "eager" : "lazy",
                 decoding: "async",
-                ...v
+                ...w
               }
             ),
-            s && !L && !h && /* @__PURE__ */ t.jsx(
+            s && !z && !f && /* @__PURE__ */ t.jsx(
               "div",
               {
                 className: "absolute inset-0 bg-black/0 hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 hover:opacity-100",
@@ -4261,30 +4285,30 @@ const gr = ({
       ),
       [
         u,
-        Z,
-        f,
-        L,
+        q,
+        b,
+        z,
         c,
-        h,
-        U,
+        f,
+        V,
         n,
         r,
-        B,
+        F,
         d,
-        v,
+        w,
         e,
-        H,
+        U,
         s
       ]
     );
     return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       R,
-      w && Be(
+      v && Fe(
         /* @__PURE__ */ t.jsxs(
           "div",
           {
             ref: Q,
-            className: `fixed z-50 flex items-center justify-center p-4 transition-all ease-out ${x} ${C ? "bg-black/0 backdrop-blur-none opacity-0 duration-300" : $ ? "bg-black/80 backdrop-blur-sm opacity-100 duration-500" : "bg-black/80 backdrop-blur-sm opacity-100 duration-300"}`,
+            className: `fixed z-50 flex items-center justify-center p-4 transition-all ease-out ${g} ${N ? "bg-black/0 backdrop-blur-none opacity-0 duration-300" : _ ? "bg-black/80 backdrop-blur-sm opacity-100 duration-500" : "bg-black/80 backdrop-blur-sm opacity-100 duration-300"}`,
             style: {
               top: 0,
               left: 0,
@@ -4297,10 +4321,10 @@ const gr = ({
             "aria-modal": "true",
             "aria-label": `Preview: ${r}`,
             children: [
-              y.cyberpunkEffects && /* @__PURE__ */ t.jsx(
+              x.cyberpunkEffects && /* @__PURE__ */ t.jsx(
                 "div",
                 {
-                  className: `absolute transition-opacity duration-300 ${C ? "opacity-0" : "opacity-20"}`,
+                  className: `absolute transition-opacity duration-300 ${N ? "opacity-0" : "opacity-20"}`,
                   style: {
                     top: 0,
                     left: 0,
@@ -4337,7 +4361,7 @@ const gr = ({
                       "button",
                       {
                         onClick: Y,
-                        className: `absolute top-4 right-4 text-white hover:text-accent/80 transition-all duration-300 font-bold z-20 rounded-full w-10 h-10 flex items-center justify-center cursor-pointer transform ${C ? "bg-black/0 scale-50 rotate-180 opacity-0" : $ ? "bg-black/50 scale-0 rotate-0 opacity-0 duration-500" : "bg-black/50 hover:bg-accent/20 scale-100 rotate-0 opacity-100 hover:scale-110"}`,
+                        className: `absolute top-4 right-4 text-white hover:text-accent/80 transition-all duration-300 font-bold z-20 rounded-full w-10 h-10 flex items-center justify-center cursor-pointer transform ${N ? "bg-black/0 scale-50 rotate-180 opacity-0" : _ ? "bg-black/50 scale-0 rotate-0 opacity-0 duration-500" : "bg-black/50 hover:bg-accent/20 scale-100 rotate-0 opacity-100 hover:scale-110"}`,
                         style: { lineHeight: "1" },
                         children: /* @__PURE__ */ t.jsxs(
                           "svg",
@@ -4377,20 +4401,20 @@ const gr = ({
                     /* @__PURE__ */ t.jsxs(
                       "div",
                       {
-                        className: `relative max-w-full max-h-full flex items-center justify-center transition-all ease-out ${C ? "scale-75 opacity-0 rotate-1 duration-300" : $ ? "scale-95 opacity-0 rotate-0 duration-500" : "scale-100 opacity-100 rotate-0 duration-300"}`,
+                        className: `relative max-w-full max-h-full flex items-center justify-center transition-all ease-out ${N ? "scale-75 opacity-0 rotate-1 duration-300" : _ ? "scale-95 opacity-0 rotate-0 duration-500" : "scale-100 opacity-100 rotate-0 duration-300"}`,
                         onClick: (S) => S.stopPropagation(),
                         children: [
-                          y.cyberpunkEffects && /* @__PURE__ */ t.jsx(
+                          x.cyberpunkEffects && /* @__PURE__ */ t.jsx(
                             "div",
                             {
-                              className: `absolute inset-0 rounded-lg border-2 transition-all duration-300 ${C ? "border-transparent shadow-none" : "border-accent shadow-lg-accent animate-pulse"}`,
+                              className: `absolute inset-0 rounded-lg border-2 transition-all duration-300 ${N ? "border-transparent shadow-none" : "border-accent shadow-lg-accent animate-pulse"}`,
                               "aria-hidden": "true"
                             }
                           ),
-                          y.cyberpunkEffects && /* @__PURE__ */ t.jsx(
+                          x.cyberpunkEffects && /* @__PURE__ */ t.jsx(
                             "div",
                             {
-                              className: `absolute inset-0 overflow-hidden rounded-lg transition-opacity duration-300 z-10 ${C ? "opacity-0" : "opacity-100"}`,
+                              className: `absolute inset-0 overflow-hidden rounded-lg transition-opacity duration-300 z-10 ${N ? "opacity-0" : "opacity-100"}`,
                               "aria-hidden": "true",
                               children: /* @__PURE__ */ t.jsxs("div", { className: "absolute top-0 left-0 w-full h-px animate-scan opacity-20", children: [
                                 /* @__PURE__ */ t.jsx("div", { className: "w-full h-full bg-gradient-to-r from-transparent via-accent to-transparent shadow-lg-accent opacity-80" }),
@@ -4401,9 +4425,9 @@ const gr = ({
                           /* @__PURE__ */ t.jsx(
                             "img",
                             {
-                              src: U ? n : e,
-                              alt: U ? `${r} (fallback)` : r,
-                              className: `max-w-[95vw] max-h-[95vh] w-auto h-auto object-contain rounded-lg transition-all duration-300 ease-out ${C ? "filter blur-sm brightness-50" : "filter blur-0 brightness-100"}`,
+                              src: V ? n : e,
+                              alt: V ? `${r} (fallback)` : r,
+                              className: `max-w-[95vw] max-h-[95vh] w-auto h-auto object-contain rounded-lg transition-all duration-300 ease-out ${N ? "filter blur-sm brightness-50" : "filter blur-0 brightness-100"}`,
                               style: {
                                 maxWidth: "95vw",
                                 maxHeight: "95vh",
@@ -4415,39 +4439,39 @@ const gr = ({
                           /* @__PURE__ */ t.jsx(
                             "div",
                             {
-                              className: `absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 via-black/40 to-transparent p-3 rounded-b-lg transition-all duration-300 ${C ? "translate-y-4 opacity-0" : "translate-y-0 opacity-100"}`,
+                              className: `absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 via-black/40 to-transparent p-3 rounded-b-lg transition-all duration-300 ${N ? "translate-y-4 opacity-0" : "translate-y-0 opacity-100"}`,
                               children: /* @__PURE__ */ t.jsxs("p", { className: "text-white text-sm font-medium truncate relative", children: [
-                                U ? `${r} (fallback)` : r,
-                                y.cyberpunkEffects && /* @__PURE__ */ t.jsx("span", { className: "absolute inset-0 text-accent opacity-20 animate-pulse", children: U ? `${r} (fallback)` : r })
+                                V ? `${r} (fallback)` : r,
+                                x.cyberpunkEffects && /* @__PURE__ */ t.jsx("span", { className: "absolute inset-0 text-accent opacity-20 animate-pulse", children: V ? `${r} (fallback)` : r })
                               ] })
                             }
                           ),
-                          y.cyberpunkEffects && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+                          x.cyberpunkEffects && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
                             /* @__PURE__ */ t.jsx(
                               "div",
                               {
-                                className: `absolute top-2 left-2 w-4 h-4 border-l-2 border-t-2 border-accent transition-all duration-300 ${C ? "opacity-0 scale-0" : "opacity-60 scale-100"}`,
+                                className: `absolute top-2 left-2 w-4 h-4 border-l-2 border-t-2 border-accent transition-all duration-300 ${N ? "opacity-0 scale-0" : "opacity-60 scale-100"}`,
                                 "aria-hidden": "true"
                               }
                             ),
                             /* @__PURE__ */ t.jsx(
                               "div",
                               {
-                                className: `absolute top-2 right-2 w-4 h-4 border-r-2 border-t-2 border-accent transition-all duration-300 ${C ? "opacity-0 scale-0" : "opacity-60 scale-100"}`,
+                                className: `absolute top-2 right-2 w-4 h-4 border-r-2 border-t-2 border-accent transition-all duration-300 ${N ? "opacity-0 scale-0" : "opacity-60 scale-100"}`,
                                 "aria-hidden": "true"
                               }
                             ),
                             /* @__PURE__ */ t.jsx(
                               "div",
                               {
-                                className: `absolute bottom-2 left-2 w-4 h-4 border-l-2 border-b-2 border-accent transition-all duration-300 ${C ? "opacity-0 scale-0" : "opacity-60 scale-100"}`,
+                                className: `absolute bottom-2 left-2 w-4 h-4 border-l-2 border-b-2 border-accent transition-all duration-300 ${N ? "opacity-0 scale-0" : "opacity-60 scale-100"}`,
                                 "aria-hidden": "true"
                               }
                             ),
                             /* @__PURE__ */ t.jsx(
                               "div",
                               {
-                                className: `absolute bottom-2 right-2 w-4 h-4 border-r-2 border-b-2 border-accent transition-all duration-300 ${C ? "opacity-0 scale-0" : "opacity-60 scale-100"}`,
+                                className: `absolute bottom-2 right-2 w-4 h-4 border-r-2 border-b-2 border-accent transition-all duration-300 ${N ? "opacity-0 scale-0" : "opacity-60 scale-100"}`,
                                 "aria-hidden": "true"
                               }
                             )
@@ -4467,7 +4491,7 @@ const gr = ({
   }
 );
 je.displayName = "CyberUI.Image";
-const ir = ({
+const fr = ({
   images: e,
   currentIndex: r,
   onChange: a,
@@ -4477,74 +4501,74 @@ const ir = ({
   infinite: l = !0,
   transition: i = "slide",
   objectFit: d = "cover",
-  showArrows: x = !0,
-  showIndicators: b = !0,
-  className: g = "",
-  disableImagePreview: m = !1,
-  glitchRate: p = 1,
-  onBeforeChange: v,
-  onAfterChange: y
+  showArrows: g = !0,
+  showIndicators: m = !0,
+  className: y = "",
+  disableImagePreview: p = !1,
+  glitchRate: h = 1,
+  onBeforeChange: w,
+  onAfterChange: x
 }) => {
-  const [w, A] = X(!1), [C, _] = X(n), [$, k] = X(!0), L = be(
-    () => V(s, oe.carousel),
+  const [v, A] = Z(!1), [N, T] = Z(n), [_, C] = Z(!0), z = pe(
+    () => H(s, ae.carousel),
     [s]
-  ), G = "w-full h-full", h = D(
+  ), G = "w-full h-full", f = D(
     (o) => {
-      if (o === r || w) return;
-      const u = i === "signal-glitch" && (typeof p == "boolean" ? p : Math.random() < p);
-      k(u), A(!0), v?.(r, o), setTimeout(() => {
-        a(o), A(!1), y?.(o);
+      if (o === r || v) return;
+      const u = i === "signal-glitch" && (typeof h == "boolean" ? h : Math.random() < h);
+      C(u), A(!0), w?.(r, o), setTimeout(() => {
+        a(o), A(!1), x?.(o);
       }, i === "slide" ? 0 : i === "signal-glitch" && u ? 600 : 250);
     },
     [
       r,
-      w,
-      a,
       v,
-      y,
+      a,
+      w,
+      x,
       i,
-      p
+      h
     ]
   );
-  ae(() => {
-    if (!C || e.length <= 1) return;
+  oe(() => {
+    if (!N || e.length <= 1) return;
     const o = setInterval(() => {
       const u = l ? (r + 1) % e.length : Math.min(r + 1, e.length - 1);
       if (!l && u === e.length - 1) {
-        _(!1);
+        T(!1);
         return;
       }
-      h(u);
+      f(u);
     }, c);
     return () => clearInterval(o);
   }, [
-    C,
+    N,
     r,
     e.length,
     l,
     c,
-    h
+    f
   ]);
-  const z = D(() => {
+  const M = D(() => {
     if (e.length <= 1) return;
     const o = l ? (r - 1 + e.length) % e.length : Math.max(r - 1, 0);
-    _(!1), h(o);
-  }, [r, e.length, l, h]), U = D(() => {
+    T(!1), f(o);
+  }, [r, e.length, l, f]), V = D(() => {
     if (e.length <= 1) return;
     const o = l ? (r + 1) % e.length : Math.min(r + 1, e.length - 1);
-    _(!1), h(o);
-  }, [r, e.length, l, h]), q = D(
+    T(!1), f(o);
+  }, [r, e.length, l, f]), X = D(
     (o) => {
-      _(!1), h(o);
+      T(!1), f(o);
     },
-    [h]
+    [f]
   );
-  ae(() => {
+  oe(() => {
     const o = (u) => {
-      u.key === "ArrowLeft" && z(), u.key === "ArrowRight" && U();
+      u.key === "ArrowLeft" && M(), u.key === "ArrowRight" && V();
     };
     return window.addEventListener("keydown", o), () => window.removeEventListener("keydown", o);
-  }, [z, U]);
+  }, [M, V]);
   const Q = () => /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -4561,25 +4585,25 @@ const ir = ({
           fallback: o.fallbackSrc,
           className: G,
           size: "lg",
-          preview: !m,
+          preview: !p,
           loading: u <= 1 ? "eager" : "lazy",
-          onPreviewOpen: () => _(!1),
-          onPreviewClose: () => _(n)
+          onPreviewOpen: () => T(!1),
+          onPreviewClose: () => T(n)
         }
       ) }, u))
     }
   ), re = () => /* @__PURE__ */ t.jsx(t.Fragment, { children: e.map((o, u) => {
-    const f = u === r, R = i === "fade" ? {
-      opacity: f ? 1 : 0,
+    const b = u === r, R = i === "fade" ? {
+      opacity: b ? 1 : 0,
       transition: "opacity 500ms ease-in-out",
       willChange: "opacity"
     } : i === "matrix" ? {
-      opacity: f ? 1 : 0,
-      transform: f ? "scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translateZ(0) skew(0deg) perspective(1000px)" : w ? "scale(0.6) rotateX(35deg) rotateY(15deg) rotateZ(-3deg) translateZ(-80px) skew(5deg, 2deg) perspective(1000px)" : "scale(0.92) rotateX(8deg) rotateY(2deg) translateZ(-20px) skew(1deg) perspective(1000px)",
-      filter: f ? "brightness(1) contrast(1) hue-rotate(0deg) saturate(1) drop-shadow(0 0 10px rgba(0, 255, 136, 0.3))" : w ? "brightness(0.1) contrast(4) hue-rotate(270deg) saturate(3) blur(2px) drop-shadow(0 0 20px rgba(255, 0, 93, 0.8)) drop-shadow(0 0 30px rgba(0, 255, 249, 0.6))" : "brightness(0.7) contrast(1.5) hue-rotate(120deg) saturate(1.4) drop-shadow(0 0 8px rgba(0, 255, 136, 0.4))",
+      opacity: b ? 1 : 0,
+      transform: b ? "scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translateZ(0) skew(0deg) perspective(1000px)" : v ? "scale(0.6) rotateX(35deg) rotateY(15deg) rotateZ(-3deg) translateZ(-80px) skew(5deg, 2deg) perspective(1000px)" : "scale(0.92) rotateX(8deg) rotateY(2deg) translateZ(-20px) skew(1deg) perspective(1000px)",
+      filter: b ? "brightness(1) contrast(1) hue-rotate(0deg) saturate(1) drop-shadow(0 0 10px rgba(0, 255, 136, 0.3))" : v ? "brightness(0.1) contrast(4) hue-rotate(270deg) saturate(3) blur(2px) drop-shadow(0 0 20px rgba(255, 0, 93, 0.8)) drop-shadow(0 0 30px rgba(0, 255, 249, 0.6))" : "brightness(0.7) contrast(1.5) hue-rotate(120deg) saturate(1.4) drop-shadow(0 0 8px rgba(0, 255, 136, 0.4))",
       transition: "all 1200ms cubic-bezier(0.175, 0.885, 0.32, 1.275)",
       willChange: "transform, opacity, filter",
-      boxShadow: f ? "0 0 30px rgba(0, 255, 136, 0.5), inset 0 0 30px rgba(0, 255, 136, 0.15), 0 0 60px rgba(0, 255, 136, 0.2)" : w ? "0 0 50px rgba(255, 0, 93, 1), 0 0 100px rgba(0, 255, 249, 0.8), 0 0 150px rgba(255, 251, 0, 0.6), inset 0 0 50px rgba(255, 0, 93, 0.3), inset 0 0 80px rgba(0, 255, 249, 0.2), 0 0 0 3px rgba(255, 0, 93, 0.8), 0 0 0 6px rgba(0, 255, 249, 0.6), 0 0 200px rgba(255, 251, 0, 0.3)" : "0 0 20px rgba(0, 255, 136, 0.4), inset 0 0 15px rgba(0, 255, 136, 0.1), 0 0 40px rgba(0, 255, 136, 0.2)"
+      boxShadow: b ? "0 0 30px rgba(0, 255, 136, 0.5), inset 0 0 30px rgba(0, 255, 136, 0.15), 0 0 60px rgba(0, 255, 136, 0.2)" : v ? "0 0 50px rgba(255, 0, 93, 1), 0 0 100px rgba(0, 255, 249, 0.8), 0 0 150px rgba(255, 251, 0, 0.6), inset 0 0 50px rgba(255, 0, 93, 0.3), inset 0 0 80px rgba(0, 255, 249, 0.2), 0 0 0 3px rgba(255, 0, 93, 0.8), 0 0 0 6px rgba(0, 255, 249, 0.6), 0 0 200px rgba(255, 251, 0, 0.3)" : "0 0 20px rgba(0, 255, 136, 0.4), inset 0 0 15px rgba(0, 255, 136, 0.1), 0 0 40px rgba(0, 255, 136, 0.2)"
     } : {};
     return /* @__PURE__ */ t.jsxs(
       "div",
@@ -4587,7 +4611,7 @@ const ir = ({
         className: "absolute inset-0 w-full h-full",
         style: {
           ...R,
-          pointerEvents: f ? "auto" : "none"
+          pointerEvents: b ? "auto" : "none"
         },
         children: [
           /* @__PURE__ */ t.jsx(
@@ -4598,30 +4622,30 @@ const ir = ({
               fallback: o.fallbackSrc,
               className: G,
               size: "lg",
-              preview: !m,
+              preview: !p,
               loading: u <= 1 ? "eager" : "lazy",
-              onPreviewOpen: () => _(!1),
-              onPreviewClose: () => _(n)
+              onPreviewOpen: () => T(!1),
+              onPreviewClose: () => T(n)
             }
           ),
-          i === "matrix" && B(f, w)
+          i === "matrix" && F(b, v)
         ]
       },
       u
     );
   }) }), ee = () => /* @__PURE__ */ t.jsx(t.Fragment, { children: e.map((o, u) => {
-    const f = u === r, R = u === (r - 1 + e.length) % e.length, S = w && i === "signal-glitch" && $ ? {
-      opacity: f ? 1 : R ? 0.8 : 0,
-      animation: f ? "signal-image-flicker-in 1s ease-out forwards" : R ? "signal-image-flicker-out 1s ease-out forwards" : "none",
+    const b = u === r, R = u === (r - 1 + e.length) % e.length, S = v && i === "signal-glitch" && _ ? {
+      opacity: b ? 1 : R ? 0.8 : 0,
+      animation: b ? "signal-image-flicker-in 1s ease-out forwards" : R ? "signal-image-flicker-out 1s ease-out forwards" : "none",
       willChange: "opacity",
-      pointerEvents: w && !f ? "none" : "auto",
-      transform: w ? "translateZ(0)" : "none"
+      pointerEvents: v && !b ? "none" : "auto",
+      transform: v ? "translateZ(0)" : "none"
       // Reduce jumping with hardware acceleration
     } : {
-      opacity: f ? 1 : 0,
+      opacity: b ? 1 : 0,
       transition: "opacity 250ms ease-in-out",
       willChange: "opacity",
-      pointerEvents: f ? "auto" : "none"
+      pointerEvents: b ? "auto" : "none"
     };
     return /* @__PURE__ */ t.jsxs(
       "div",
@@ -4637,24 +4661,24 @@ const ir = ({
               fallback: o.fallbackSrc,
               className: G,
               size: "lg",
-              preview: !m && !(w && i === "signal-glitch" && $),
+              preview: !p && !(v && i === "signal-glitch" && _),
               loading: u <= 1 ? "eager" : "lazy",
-              onPreviewOpen: () => _(!1),
-              onPreviewClose: () => _(n)
+              onPreviewOpen: () => T(!1),
+              onPreviewClose: () => T(n)
             }
           ),
-          i === "signal-glitch" && w && $ && H(f)
+          i === "signal-glitch" && v && _ && U(b)
         ]
       },
       u
     );
-  }) }), B = (o, u) => /* @__PURE__ */ t.jsx(t.Fragment, { children: u && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 overflow-hidden pointer-events-none", children: o ? (
+  }) }), F = (o, u) => /* @__PURE__ */ t.jsx(t.Fragment, { children: u && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 overflow-hidden pointer-events-none", children: o ? (
     // Active image gets subtle enhancement effects
     /* @__PURE__ */ t.jsx("div", { className: "w-full h-full bg-gradient-to-b from-primary/5 to-transparent opacity-30" })
   ) : (
     // Transitioning image gets more dramatic effects
     /* @__PURE__ */ t.jsx("div", { className: "w-full h-full bg-gradient-to-b from-primary/10 via-secondary/5 to-accent/10 opacity-50" })
-  ) }) }), H = (o) => /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+  ) }) }), U = (o) => /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
       "div",
       {
@@ -4785,12 +4809,12 @@ const ir = ({
         }
       )
     ] })
-  ] }), Z = () => x && e.length > 1 && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+  ] }), q = () => g && e.length > 1 && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
       "button",
       {
-        onClick: z,
-        disabled: !l && r === 0 || w && i === "signal-glitch" && $,
+        onClick: M,
+        disabled: !l && r === 0 || v && i === "signal-glitch" && _,
         className: "group absolute left-2 top-1/2 -translate-y-1/2 w-16 h-16 text-primary hover:text-accent cursor-pointer disabled:cursor-not-allowed disabled:opacity-30 focus:outline-none transition-all duration-300 flex items-center justify-center hover:scale-110",
         "aria-label": "Previous image",
         children: /* @__PURE__ */ t.jsxs(
@@ -4882,8 +4906,8 @@ const ir = ({
     /* @__PURE__ */ t.jsx(
       "button",
       {
-        onClick: U,
-        disabled: !l && r === e.length - 1 || w && i === "signal-glitch" && $,
+        onClick: V,
+        disabled: !l && r === e.length - 1 || v && i === "signal-glitch" && _,
         className: "group absolute right-2 top-1/2 -translate-y-1/2 w-16 h-16 text-primary hover:text-accent cursor-pointer disabled:cursor-not-allowed disabled:opacity-30 focus:outline-none transition-all duration-300 flex items-center justify-center hover:scale-110",
         "aria-label": "Next image",
         children: /* @__PURE__ */ t.jsxs(
@@ -4933,11 +4957,11 @@ const ir = ({
         )
       }
     )
-  ] }), Y = () => b && e.length > 1 && /* @__PURE__ */ t.jsx("div", { className: "flex justify-center mt-4 space-x-4", children: e.map((o, u) => /* @__PURE__ */ t.jsxs(
+  ] }), Y = () => m && e.length > 1 && /* @__PURE__ */ t.jsx("div", { className: "flex justify-center mt-4 space-x-4", children: e.map((o, u) => /* @__PURE__ */ t.jsxs(
     "button",
     {
-      onClick: () => q(u),
-      disabled: w && i === "signal-glitch" && $,
+      onClick: () => X(u),
+      disabled: v && i === "signal-glitch" && _,
       className: "group relative transition-all duration-300 hover:scale-110 focus:outline-none cursor-pointer disabled:cursor-not-allowed disabled:opacity-30",
       style: {
         width: "24px",
@@ -5004,16 +5028,16 @@ const ir = ({
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: T(L, "w-full bg-surface border border-accent rounded-lg flex items-center justify-center", g),
+        className: $(z, "w-full bg-surface border border-accent rounded-lg flex items-center justify-center", y),
         children: /* @__PURE__ */ t.jsx("p", { className: "text-muted", children: "No images to display" })
       }
     );
   const K = e[r];
-  return /* @__PURE__ */ t.jsxs("div", { className: T("relative w-full", g), children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: $("relative w-full", y), children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: `relative w-full overflow-hidden rounded-lg border border-accent bg-surface ${L}`,
+        className: `relative w-full overflow-hidden rounded-lg border border-accent bg-surface ${z}`,
         children: [
           /* @__PURE__ */ t.jsxs("div", { className: "absolute inset-0 pointer-events-none", children: [
             /* @__PURE__ */ t.jsx("div", { className: "absolute top-2 left-2 w-4 h-4 border-l-2 border-t-2 border-primary opacity-60" }),
@@ -5034,23 +5058,23 @@ const ir = ({
             }
           ),
           K.caption && /* @__PURE__ */ t.jsx("div", { className: "absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 to-transparent p-4", children: /* @__PURE__ */ t.jsx("p", { className: "text-white text-sm font-medium", children: K.caption }) }),
-          Z()
+          q()
         ]
       }
     ),
     Y()
   ] });
-}, Sr = $e(ir), cr = {
+}, Rr = _e(fr), pr = {
   openDuration: 600,
   closeDuration: 400,
   crtEffects: !0
-}, dr = {
+}, br = {
   sm: "max-w-md",
   md: "max-w-lg",
   lg: "max-w-2xl",
   xl: "max-w-4xl",
   fullscreen: "max-w-none w-full h-full"
-}, ur = $e(
+}, hr = _e(
   ({
     isOpen: e,
     onClose: r,
@@ -5061,78 +5085,78 @@ const ir = ({
     onConfirm: l,
     cancelText: i = "Cancel",
     confirmText: d = "Confirm",
-    confirmLoading: x = !1,
-    showCancel: b = !0,
-    showConfirm: g = !0,
-    size: m = "md",
-    variant: p = "default",
-    closeOnOverlayClick: v = !0,
-    closeOnEscape: y = !0,
-    animation: w,
+    confirmLoading: g = !1,
+    showCancel: m = !0,
+    showConfirm: y = !0,
+    size: p = "lg",
+    variant: h = "default",
+    closeOnOverlayClick: w = !0,
+    closeOnEscape: x = !0,
+    animation: v,
     className: A = "",
-    overlayClassName: C = "",
-    showCloseButton: _ = !0,
-    onOpen: $,
-    onCRTBootComplete: k
+    overlayClassName: N = "",
+    showCloseButton: T = !0,
+    onOpen: _,
+    onCRTBootComplete: C
   }) => {
-    const L = be(
-      () => ({ ...cr, ...w }),
-      [w]
-    ), [G, h] = X(!1), [z, U] = X(!0), q = te(null), Q = te(null), re = te(null), ee = te(`modal-title-${Math.random().toString(36).slice(2)}`), B = D(() => {
-      h(!0), setTimeout(() => {
-        h(!1), U(!0), r();
-      }, L.closeDuration);
-    }, [r, L.closeDuration]);
-    ae(() => {
-      e && !G && (re.current = document.activeElement || null, U(!0), $?.(), setTimeout(() => {
-        U(!1), k?.(), Q.current?.focus();
-      }, L.openDuration));
+    const z = pe(
+      () => ({ ...pr, ...v }),
+      [v]
+    ), [G, f] = Z(!1), [M, V] = Z(!0), X = te(null), Q = te(null), re = te(null), ee = te(`modal-title-${Math.random().toString(36).slice(2)}`), F = D(() => {
+      f(!0), setTimeout(() => {
+        f(!1), V(!0), r();
+      }, z.closeDuration);
+    }, [r, z.closeDuration]);
+    oe(() => {
+      e && !G && (re.current = document.activeElement || null, V(!0), _?.(), setTimeout(() => {
+        V(!1), C?.(), Q.current?.focus();
+      }, z.openDuration));
     }, [
       e,
       G,
-      $,
-      k,
-      L.openDuration
+      _,
+      C,
+      z.openDuration
     ]);
-    const H = D(() => {
-      c?.(), B();
-    }, [c, B]), Z = D(() => {
-      l?.(), B();
-    }, [l, B]), Y = D(
+    const U = D(() => {
+      c?.(), F();
+    }, [c, F]), q = D(() => {
+      l?.(), F();
+    }, [l, F]), Y = D(
       (u) => {
-        v && (u.target === q.current || u.target === u.currentTarget) && B();
+        w && (u.target === X.current || u.target === u.currentTarget) && F();
       },
-      [B, v]
+      [F, w]
     ), K = D(
       (u) => {
-        y && u.key === "Escape" && B();
+        x && u.key === "Escape" && F();
       },
-      [B, y]
+      [F, x]
     );
-    ae(() => {
+    oe(() => {
       if (e) {
         document.addEventListener("keydown", K);
-        const u = document.body.style.overflow, f = window.innerWidth - document.documentElement.clientWidth;
-        return document.body.style.overflow = "hidden", document.body.style.paddingRight = `${f}px`, () => {
+        const u = document.body.style.overflow, b = window.innerWidth - document.documentElement.clientWidth;
+        return document.body.style.overflow = "hidden", document.body.style.paddingRight = `${b}px`, () => {
           document.removeEventListener("keydown", K), document.body.style.overflow = u, document.body.style.paddingRight = "", re.current?.focus?.();
         };
       }
     }, [e, K]);
-    const o = be(() => {
-      const u = p === "danger", f = u ? "border-error" : "border-accent", R = u ? "shadow-error" : "shadow-lg-accent", S = u ? "shadow-error/50" : "shadow-input-accent/50", E = u ? "animate-danger-glow" : "animate-rgb-glow";
-      return T(
+    const o = pe(() => {
+      const u = h === "danger", b = u ? "border-error" : "border-accent", R = u ? "shadow-error" : "shadow-lg-accent", S = u ? "shadow-error/50" : "shadow-input-accent/50", E = u ? "animate-danger-glow" : "animate-rgb-glow";
+      return $(
         "relative bg-surface border-2 rounded-lg max-h-[90vh] overflow-hidden flex flex-col transform transition-all duration-300",
-        dr[m],
-        L.crtEffects && z ? `animate-crt-power-on ${f} ${R}` : L.crtEffects && G ? `animate-crt-power-off ${f} ${R}` : G ? `scale-95 opacity-0 ${f}/20` : z ? `scale-105 opacity-90 ${f} ${S}` : `scale-100 opacity-100 ${E}`,
+        br[p],
+        z.crtEffects && M ? `animate-crt-power-on ${b} ${R}` : z.crtEffects && G ? `animate-crt-power-off ${b} ${R}` : G ? `scale-95 opacity-0 ${b}/20` : M ? `scale-105 opacity-90 ${b} ${S}` : `scale-100 opacity-100 ${E}`,
         A
       );
-    }, [m, L.crtEffects, G, z, A, p]);
-    return e ? Be(
+    }, [p, z.crtEffects, G, M, A, h]);
+    return e ? Fe(
       /* @__PURE__ */ t.jsx(
         "div",
         {
-          ref: q,
-          className: `fixed z-50 flex items-center justify-center p-4 transition-all ease-out ${C} ${G ? "bg-black/0 backdrop-blur-none opacity-0 duration-800" : z ? "bg-black/30 backdrop-blur-md opacity-100 duration-500" : "bg-black/30 backdrop-blur-sm opacity-100 duration-300"}`,
+          ref: X,
+          className: `fixed z-50 flex items-center justify-center p-4 transition-all ease-out ${N} ${G ? "bg-black/0 backdrop-blur-none opacity-0 duration-800" : M ? "bg-black/30 backdrop-blur-md opacity-100 duration-500" : "bg-black/30 backdrop-blur-sm opacity-100 duration-300"}`,
           style: {
             top: 0,
             left: 0,
@@ -5152,11 +5176,11 @@ const ir = ({
               "aria-labelledby": a ? ee.current : void 0,
               tabIndex: -1,
               children: [
-                _ && /* @__PURE__ */ t.jsx(
+                T && /* @__PURE__ */ t.jsx(
                   "button",
                   {
-                    onClick: B,
-                    className: `absolute top-4 right-4 text-muted hover:text-accent transition-all duration-300 z-20 rounded-full w-8 h-8 flex items-center justify-center cursor-pointer transform ${G ? "scale-0 rotate-180 opacity-0" : z ? "scale-0 opacity-0" : "scale-100 opacity-100 hover:scale-110 hover:bg-accent/10"}`,
+                    onClick: F,
+                    className: `absolute top-4 right-4 text-muted hover:text-accent transition-all duration-300 z-20 rounded-full w-8 h-8 flex items-center justify-center cursor-pointer transform ${G ? "scale-0 rotate-180 opacity-0" : M ? "scale-0 opacity-0" : "scale-100 opacity-100 hover:scale-110 hover:bg-accent/10"}`,
                     "aria-label": "Close modal",
                     children: /* @__PURE__ */ t.jsx(
                       "svg",
@@ -5183,16 +5207,16 @@ const ir = ({
                 a && /* @__PURE__ */ t.jsx(
                   "div",
                   {
-                    className: T(
+                    className: $(
                       "px-6 py-4 border-b flex-shrink-0 transition-all duration-300",
-                      p === "danger" ? "border-error/20" : "border-accent/20",
-                      z ? "opacity-0 translate-y-2" : "opacity-100 translate-y-0"
+                      h === "danger" ? "border-error/20" : "border-accent/20",
+                      M ? "opacity-0 translate-y-2" : "opacity-100 translate-y-0"
                     ),
                     children: /* @__PURE__ */ t.jsx(
                       "h2",
                       {
                         id: ee.current,
-                        className: T("text-lg font-semibold", p === "danger" ? "text-error" : "text-primary"),
+                        className: $("text-lg font-semibold", h === "danger" ? "text-error" : "text-primary"),
                         children: a
                       }
                     )
@@ -5201,29 +5225,29 @@ const ir = ({
                 /* @__PURE__ */ t.jsx(
                   "div",
                   {
-                    className: `flex-1 overflow-auto p-6 transition-all duration-500 ${z ? "opacity-0 translate-y-4" : "opacity-100 translate-y-0"}`,
+                    className: `flex-1 overflow-auto p-6 transition-all duration-500 ${M ? "opacity-0 translate-y-4" : "opacity-100 translate-y-0"}`,
                     children: s
                   }
                 ),
                 (n || c || l) && /* @__PURE__ */ t.jsx(
                   "div",
                   {
-                    className: T(
+                    className: $(
                       "px-6 py-4 border-t flex-shrink-0 transition-all duration-300",
-                      p === "danger" ? "border-error/20" : "border-accent/20",
-                      z ? "opacity-0 translate-y-2" : "opacity-100 translate-y-0"
+                      h === "danger" ? "border-error/20" : "border-accent/20",
+                      M ? "opacity-0 translate-y-2" : "opacity-100 translate-y-0"
                     ),
                     children: n || /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col-reverse sm:flex-row justify-between items-center gap-3", children: [
                       /* @__PURE__ */ t.jsx("span", { className: "text-muted text-xs font-mono hidden sm:block", children: "> ESC to abort" }),
                       /* @__PURE__ */ t.jsxs("div", { className: "flex gap-3 w-full sm:w-auto", children: [
-                        b && c && /* @__PURE__ */ t.jsx(We, { variant: "ghost", size: "sm", onClick: H, className: "flex-1 sm:flex-none", children: i }),
-                        g && l && /* @__PURE__ */ t.jsx(
+                        m && c && /* @__PURE__ */ t.jsx(We, { variant: "ghost", size: "sm", onClick: U, className: "flex-1 sm:flex-none", children: i }),
+                        y && l && /* @__PURE__ */ t.jsx(
                           We,
                           {
-                            variant: p === "danger" ? "danger" : "primary",
+                            variant: h === "danger" ? "danger" : "primary",
                             size: "sm",
-                            onClick: Z,
-                            disabled: x,
+                            onClick: q,
+                            disabled: g,
                             className: "flex-1 sm:flex-none",
                             children: d
                           }
@@ -5241,8 +5265,8 @@ const ir = ({
     ) : null;
   }
 );
-ur.displayName = "CyberUI.Modal";
-const Er = ({
+hr.displayName = "CyberUI.Modal";
+const Ar = ({
   children: e,
   variant: r = "primary",
   as: a = "span",
@@ -5256,11 +5280,11 @@ const Er = ({
   return /* @__PURE__ */ t.jsx(
     a,
     {
-      className: T("bg-clip-text text-transparent inline-block", n(r), s),
+      className: $("bg-clip-text text-transparent inline-block", n(r), s),
       children: e
     }
   );
-}, $r = ({
+}, Mr = ({
   children: e,
   showLine: r = !0,
   size: a = "md",
@@ -5278,12 +5302,12 @@ const Er = ({
     sm: "gap-3",
     md: "gap-4",
     lg: "gap-5"
-  }, i = V(a, n), d = V(a, c), x = V(a, l), b = T("flex items-center", x, d), g = T("uppercase tracking-[0.2em] text-secondary font-bold whitespace-nowrap", i);
-  return /* @__PURE__ */ t.jsxs("div", { className: T(b, s), children: [
-    /* @__PURE__ */ t.jsx("h2", { className: g, children: e }),
+  }, i = H(a, n), d = H(a, c), g = H(a, l), m = $("flex items-center", g, d), y = $("uppercase tracking-[0.2em] text-secondary font-bold whitespace-nowrap", i);
+  return /* @__PURE__ */ t.jsxs("div", { className: $(m, s), children: [
+    /* @__PURE__ */ t.jsx("h2", { className: y, children: e }),
     r && /* @__PURE__ */ t.jsx("div", { className: "h-[1px] w-full bg-gradient-to-r from-secondary/50 to-transparent" })
   ] });
-}, Tr = ({
+}, Lr = ({
   events: e,
   size: r = "md",
   className: a = ""
@@ -5312,12 +5336,12 @@ const Er = ({
     sm: "gap-3",
     md: "gap-4",
     lg: "gap-5"
-  }, x = {
+  }, g = {
     sm: "space-y-4",
     md: "space-y-6",
     lg: "space-y-8"
-  }, b = V(r, s), g = V(r, n), m = V(r, c), p = V(r, l), v = V(r, i), y = V(r, d), w = V(r, x), A = (_) => {
-    const $ = {
+  }, m = H(r, s), y = H(r, n), p = H(r, c), h = H(r, l), w = H(r, i), x = H(r, d), v = H(r, g), A = (T) => {
+    const _ = {
       success: {
         border: "border-success bg-success/30 shadow-[0_0_10px_var(--color-success)]",
         background: "border-success bg-success/30 shadow-[0_0_10px_var(--color-success)]",
@@ -5339,109 +5363,109 @@ const Er = ({
         inner: "bg-info/60"
       }
     };
-    return $[_] || $.info;
-  }, C = "polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)";
-  return /* @__PURE__ */ t.jsx("div", { className: T(w, a), children: e.map((_, $) => {
-    const k = A(_.status);
-    return /* @__PURE__ */ t.jsxs("div", { className: T("flex", y, "group"), children: [
+    return _[T] || _.info;
+  }, N = "polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)";
+  return /* @__PURE__ */ t.jsx("div", { className: $(v, a), children: e.map((T, _) => {
+    const C = A(T.status);
+    return /* @__PURE__ */ t.jsxs("div", { className: $("flex", x, "group"), children: [
       /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col items-center", children: [
-        /* @__PURE__ */ t.jsxs("div", { className: T("relative flex-shrink-0 mt-1.5", b), children: [
+        /* @__PURE__ */ t.jsxs("div", { className: $("relative flex-shrink-0 mt-1.5", m), children: [
           /* @__PURE__ */ t.jsx(
             "div",
             {
-              className: T("absolute inset-0 border-2 transition-all duration-300", k.border),
-              style: { clipPath: C }
+              className: $("absolute inset-0 border-2 transition-all duration-300", C.border),
+              style: { clipPath: N }
             }
           ),
           /* @__PURE__ */ t.jsx(
             "div",
             {
-              className: T("absolute", g, k.inner),
-              style: { clipPath: C }
+              className: $("absolute", y, C.inner),
+              style: { clipPath: N }
             }
           )
         ] }),
-        $ < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "w-[2px] flex-1 bg-gradient-to-b from-secondary/50 to-transparent mt-2" })
+        _ < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "w-[2px] flex-1 bg-gradient-to-b from-secondary/50 to-transparent mt-2" })
       ] }),
       /* @__PURE__ */ t.jsxs("div", { className: "flex-1 pb-6", children: [
         /* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between mb-1", children: [
-          /* @__PURE__ */ t.jsx("h4", { className: T("font-semibold text-default group-hover:text-secondary transition-colors", m), children: _.title }),
-          /* @__PURE__ */ t.jsx("span", { className: T("text-muted whitespace-nowrap ml-4", v), children: _.time })
+          /* @__PURE__ */ t.jsx("h4", { className: $("font-semibold text-default group-hover:text-secondary transition-colors", p), children: T.title }),
+          /* @__PURE__ */ t.jsx("span", { className: $("text-muted whitespace-nowrap ml-4", w), children: T.time })
         ] }),
-        _.description && /* @__PURE__ */ t.jsx("p", { className: T("text-muted mt-1", p), children: _.description })
+        T.description && /* @__PURE__ */ t.jsx("p", { className: $("text-muted mt-1", h), children: T.description })
       ] })
-    ] }, $);
+    ] }, _);
   }) });
-}, _r = ({
+}, zr = ({
   items: e,
   current: r = 0,
   orientation: a = { base: "vertical", md: "horizontal" },
   className: s = ""
 }) => {
-  const c = Ve(a, "vertical") === "vertical", l = (m, p) => {
-    const v = m.status === "completed" || m.status === void 0 && p < r, y = m.status === "current" || m.status === void 0 && p === r && r < e.length, w = m.status === "error";
-    return { isCompleted: v, isCurrent: y, isError: w };
-  }, i = (m, p, v) => {
-    const y = T(
+  const c = Ve(a, "vertical") === "vertical", l = (p, h) => {
+    const w = p.status === "completed" || p.status === void 0 && h < r, x = p.status === "current" || p.status === void 0 && h === r && r < e.length, v = p.status === "error";
+    return { isCompleted: w, isCurrent: x, isError: v };
+  }, i = (p, h, w) => {
+    const x = $(
       "relative px-2 py-1 pb-2 font-bold text-sm transition-colors duration-200 whitespace-nowrap overflow-hidden",
       "after:content-[''] after:absolute after:left-0 after:right-0 after:bottom-0 after:h-[2px] after:w-full after:scale-x-0 after:origin-center after:transition-transform after:duration-300 after:ease-out",
       "before:content-[''] before:absolute before:left-1/2 before:-translate-x-1/2 before:-bottom-[3px] before:w-1.5 before:h-1.5 before:bg-accent before:rotate-45 before:rounded-[2px] before:opacity-0 before:transition-opacity before:duration-200"
     );
-    return m ? T(y, "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100") : p ? T(y, "text-secondary before:opacity-100") : v ? T(y, "text-error") : T(y, "text-muted");
-  }, d = (m, p, v, y) => ({
+    return p ? $(x, "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100") : h ? $(x, "text-secondary before:opacity-100") : w ? $(x, "text-error") : $(x, "text-muted");
+  }, d = (p, h, w, x) => ({
     color: "var(--color-primary)",
-    opacity: v ? 0.8 : 0.3,
-    filter: v ? "drop-shadow(0 0 4px color-mix(in srgb, var(--color-primary), transparent 40%))" : "none",
-    animation: p && m ? `chevronFlow 1.5s ease-in-out infinite ${y * 0.2}s` : "none"
-  }), x = T(c ? "flex flex-col items-start gap-0" : "flex items-center justify-center gap-4", s), b = (m, p, v) => m ? "text-secondary drop-shadow-[0_0_4px_var(--color-secondary)]" : p ? "text-accent drop-shadow-[0_0_6px_var(--color-accent)]" : v ? "text-error drop-shadow-[0_0_4px_var(--color-error)]" : "text-muted/50", g = (m, p, v) => {
-    const y = T(
+    opacity: w ? 0.8 : 0.3,
+    filter: w ? "drop-shadow(0 0 4px color-mix(in srgb, var(--color-primary), transparent 40%))" : "none",
+    animation: h && p ? `chevronFlow 1.5s ease-in-out infinite ${x * 0.2}s` : "none"
+  }), g = $(c ? "flex flex-col items-start gap-0" : "flex items-center justify-center gap-4", s), m = (p, h, w) => p ? "text-secondary drop-shadow-[0_0_4px_var(--color-secondary)]" : h ? "text-accent drop-shadow-[0_0_6px_var(--color-accent)]" : w ? "text-error drop-shadow-[0_0_4px_var(--color-error)]" : "text-muted/50", y = (p, h, w) => {
+    const x = $(
       "relative font-bold text-sm transition-colors duration-200 pb-1 w-fit",
       "after:content-[''] after:absolute after:left-0 after:right-0 after:bottom-0 after:h-[2px] after:w-full after:scale-x-0 after:origin-left after:transition-transform after:duration-300 after:ease-out"
     );
-    return m ? T(y, "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100") : p ? T(y, "text-secondary") : v ? T(y, "text-error") : T(y, "text-muted");
+    return p ? $(x, "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100") : h ? $(x, "text-secondary") : w ? $(x, "text-error") : $(x, "text-muted");
   };
-  return /* @__PURE__ */ t.jsx("div", { className: x, children: e.map((m, p) => {
-    const { isCompleted: v, isCurrent: y, isError: w } = l(m, p), A = p < e.length - 1 && (e[p + 1]?.status === "current" || e[p + 1]?.status === void 0 && p + 1 === r && r < e.length), C = p < e.length - 1 && (e[p + 1]?.status === "completed" || e[p + 1]?.status === void 0 && p + 1 < r);
+  return /* @__PURE__ */ t.jsx("div", { className: g, children: e.map((p, h) => {
+    const { isCompleted: w, isCurrent: x, isError: v } = l(p, h), A = h < e.length - 1 && (e[h + 1]?.status === "current" || e[h + 1]?.status === void 0 && h + 1 === r && r < e.length), N = h < e.length - 1 && (e[h + 1]?.status === "completed" || e[h + 1]?.status === void 0 && h + 1 < r);
     return /* @__PURE__ */ t.jsxs(Ee.Fragment, { children: [
       c ? (
         // Vertical layout: step row + chevrons below
         /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col w-full", children: [
           /* @__PURE__ */ t.jsxs("div", { className: "flex items-start gap-1.5", children: [
-            /* @__PURE__ */ t.jsx("span", { className: T("text-xs leading-5 flex-shrink-0", b(v, y, w)), children: "▸" }),
+            /* @__PURE__ */ t.jsx("span", { className: $("text-xs leading-5 flex-shrink-0", m(w, x, v)), children: "▸" }),
             /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col", children: [
-              /* @__PURE__ */ t.jsx("div", { className: g(v, y, w), children: m.title }),
-              m.description && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-muted mt-0.5 font-normal", children: m.description })
+              /* @__PURE__ */ t.jsx("div", { className: y(w, x, v), children: p.title }),
+              p.description && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-muted mt-0.5 font-normal", children: p.description })
             ] })
           ] }),
-          p < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "flex flex-col items-center py-0.5", children: [0, 1, 2].map((_) => /* @__PURE__ */ t.jsx(
+          h < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "flex flex-col items-center py-0.5", children: [0, 1, 2].map((T) => /* @__PURE__ */ t.jsx(
             "div",
             {
               className: "text-sm font-bold transition-all duration-300 rotate-90 leading-[0.6]",
-              style: d(v, A, C, _),
+              style: d(w, A, N, T),
               children: "›"
             },
-            _
+            T
           )) })
         ] })
       ) : (
         // Horizontal layout: title and description stacked with underline indicator
         /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col items-center", children: [
-          /* @__PURE__ */ t.jsx("div", { className: i(v, y, w), children: m.title }),
-          m.description && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-muted mt-1 font-normal", children: m.description })
+          /* @__PURE__ */ t.jsx("div", { className: i(w, x, v), children: p.title }),
+          p.description && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-muted mt-1 font-normal", children: p.description })
         ] })
       ),
-      !c && p < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "flex", children: [0, 1, 2].map((_) => /* @__PURE__ */ t.jsx(
+      !c && h < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "flex", children: [0, 1, 2].map((T) => /* @__PURE__ */ t.jsx(
         "div",
         {
           className: "text-2xl font-bold transition-all duration-300",
-          style: d(v, A, C, _),
+          style: d(w, A, N, T),
           children: "›"
         },
-        _
+        T
       )) })
-    ] }, p);
+    ] }, h);
   }) });
-}, Rr = ({
+}, Pr = ({
   variant: e = "gradient",
   orientation: r = "horizontal",
   className: a = ""
@@ -5450,13 +5474,13 @@ const Er = ({
     gradient: i === "horizontal" ? "bg-gradient-to-r from-transparent via-secondary/50 to-transparent" : "bg-gradient-to-b from-transparent via-secondary/50 to-transparent",
     solid: "bg-secondary/30",
     dashed: `border-dashed border-secondary/50 ${i === "horizontal" ? "border-t" : "border-l"}`
-  })[l], c = T(
+  })[l], c = $(
     s(r),
     n(e, r),
     a
   );
   return /* @__PURE__ */ t.jsx("div", { className: c });
-}, Ar = ({
+}, Ir = ({
   label: e,
   error: r,
   size: a = "md",
@@ -5467,34 +5491,34 @@ const Er = ({
   disabled: i,
   ...d
 }) => {
-  const [x, b] = Ee.useState(d.defaultChecked || !1), g = n !== void 0 ? n : x, m = (k) => {
-    i || (n === void 0 && b(k.target.checked), c?.(k), l?.(k.target.checked));
-  }, p = {
+  const [g, m] = Ee.useState(d.defaultChecked || !1), y = n !== void 0 ? n : g, p = (C) => {
+    i || (n === void 0 && m(C.target.checked), c?.(C), l?.(C.target.checked));
+  }, h = {
     sm: "w-4 h-4",
     md: "w-5 h-5",
     lg: "w-6 h-6"
-  }, v = {
+  }, w = {
     sm: "text-xs",
     md: "text-sm",
     lg: "text-base"
-  }, y = {
+  }, x = {
     sm: "ml-6",
     md: "ml-8",
     lg: "ml-9"
-  }, w = V(a, p), A = V(a, v), C = V(a, y), _ = (k) => i ? "stroke-muted/20" : T("transition-all duration-200 group-hover:stroke-secondary group-hover:stroke-[1.5]", k ? "stroke-secondary" : "stroke-secondary/50"), $ = (k) => {
-    const L = "transition-all duration-200";
-    return i ? T(L, k ? "fill-muted/20" : "fill-transparent") : T(L, k ? "fill-secondary" : "fill-transparent");
+  }, v = H(a, h), A = H(a, w), N = H(a, x), T = (C) => i ? "stroke-muted/20" : $("transition-all duration-200 group-hover:stroke-secondary group-hover:stroke-[1.5]", C ? "stroke-secondary" : "stroke-secondary/50"), _ = (C) => {
+    const z = "transition-all duration-200";
+    return i ? $(z, C ? "fill-muted/20" : "fill-transparent") : $(z, C ? "fill-secondary" : "fill-transparent");
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: T("flex flex-col gap-1", s, i && "opacity-50 cursor-not-allowed"), children: [
-    /* @__PURE__ */ t.jsxs("label", { className: T("flex items-center gap-3 group", i ? "cursor-not-allowed pointer-events-none" : "cursor-pointer"), children: [
-      /* @__PURE__ */ t.jsxs("div", { className: T("relative flex-shrink-0", w), children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: $("flex flex-col gap-1", s, i && "opacity-50 cursor-not-allowed"), children: [
+    /* @__PURE__ */ t.jsxs("label", { className: $("flex items-center gap-3 group", i ? "cursor-not-allowed pointer-events-none" : "cursor-pointer"), children: [
+      /* @__PURE__ */ t.jsxs("div", { className: $("relative flex-shrink-0", v), children: [
         /* @__PURE__ */ t.jsx(
           "input",
           {
             type: "checkbox",
             className: "absolute opacity-0 w-0 h-0",
-            checked: g,
-            onChange: m,
+            checked: y,
+            onChange: p,
             disabled: i,
             ...d
           }
@@ -5518,7 +5542,7 @@ const Er = ({
                 "path",
                 {
                   d: "M 1 1 L 19 1 L 19 15 L 15 19 L 1 19 Z",
-                  className: _(g),
+                  className: T(y),
                   strokeWidth: "1",
                   fill: "none"
                 }
@@ -5527,16 +5551,16 @@ const Er = ({
                 "path",
                 {
                   d: "M 4 4 L 16 4 L 16 13 L 13 16 L 4 16 Z",
-                  className: $(g)
+                  className: _(y)
                 }
               )
             ]
           }
         )
       ] }),
-      e && /* @__PURE__ */ t.jsx("span", { className: T("transition-colors", A, i ? "text-muted" : "text-muted group-hover:text-secondary"), children: e })
+      e && /* @__PURE__ */ t.jsx("span", { className: $("transition-colors", A, i ? "text-muted" : "text-muted group-hover:text-secondary"), children: e })
     ] }),
-    r && !i && /* @__PURE__ */ t.jsx("span", { className: T("text-xs text-error", C), children: r })
+    r && !i && /* @__PURE__ */ t.jsx("span", { className: $("text-xs text-error", N), children: r })
   ] });
 }, ne = {
   MOBILE_BREAKPOINT: 768,
@@ -5546,7 +5570,7 @@ const Er = ({
   DISTANCE_THRESHOLD: 100,
   MAX_ANIMATION_SPEED: 5,
   MIN_GLOW_DURATION: 150
-}, Mr = (e = {}) => {
+}, Or = (e = {}) => {
   const {
     glowColor: r = "primary",
     sensitivity: a = 2,
@@ -5554,20 +5578,20 @@ const Er = ({
     pageLevel: n,
     variant: c = "default",
     className: l = ""
-  } = e, i = te(null), d = te(null), x = te(Date.now()), b = te(0), g = te(void 0), m = te([]), p = te(void 0), [v, y] = X({
+  } = e, i = te(null), d = te(null), g = te(Date.now()), m = te(0), y = te(void 0), p = te([]), h = te(void 0), [w, x] = Z({
     isScrolling: !1,
     direction: null,
     velocity: 0,
     position: 0,
     scrollDistance: 0
-  }), [w, A] = X(!1), [C, _] = X(() => typeof window > "u" ? !1 : window.innerWidth >= ne.MOBILE_BREAKPOINT), $ = te(0), [k, L] = X(n ?? !1);
-  ae(() => {
+  }), [v, A] = Z(!1), [N, T] = Z(() => typeof window > "u" ? !1 : window.innerWidth >= ne.MOBILE_BREAKPOINT), _ = te(0), [C, z] = Z(n ?? !1);
+  oe(() => {
     if (n !== void 0)
-      L(n);
+      z(n);
     else {
       const u = setTimeout(() => {
-        const f = i.current !== null;
-        L(!f);
+        const b = i.current !== null;
+        z(!b);
       }, 0);
       return () => clearTimeout(u);
     }
@@ -5597,7 +5621,7 @@ const Er = ({
           boxShadow: "0 0 10px rgba(255, 0, 93, 0.3), inset 0 0 10px rgba(255, 0, 93, 0.1)"
         };
     }
-  }, []), h = D(() => {
+  }, []), f = D(() => {
     const u = window.innerWidth < ne.MOBILE_BREAKPOINT;
     return {
       isMobile: u,
@@ -5606,35 +5630,35 @@ const Er = ({
       lineSize: u ? 8 : 12,
       arrowGap: u ? 2 : 4
     };
-  }, []), z = D((u, f, R, S) => {
-    const E = (S + R) * 2, O = R * 4, I = (u - E - O) / 2;
-    return Math.floor(I / (f + R));
-  }, []), U = D((u) => {
-    if (k) {
+  }, []), M = D((u, b, R, S) => {
+    const E = (S + R) * 2, I = R * 4, O = (u - E - I) / 2;
+    return Math.floor(O / (b + R));
+  }, []), V = D((u) => {
+    if (C) {
       if (!document.querySelector("#cyber-page-scrollbar-styles")) {
-        const f = document.createElement("style");
-        f.id = "cyber-page-scrollbar-styles", f.textContent = `
+        const b = document.createElement("style");
+        b.id = "cyber-page-scrollbar-styles", b.textContent = `
           html::-webkit-scrollbar { display: none; }
           html { scrollbar-width: none; -ms-overflow-style: none; }
-        `, document.head.appendChild(f);
+        `, document.head.appendChild(b);
       }
     } else if (u) {
       if (u.style.scrollbarWidth = "none", u.style.msOverflowStyle = "none", !document.querySelector("#cyber-scrollbar-styles")) {
-        const f = document.createElement("style");
-        f.id = "cyber-scrollbar-styles", f.textContent = `
+        const b = document.createElement("style");
+        b.id = "cyber-scrollbar-styles", b.textContent = `
           .cyber-scrollbar-container::-webkit-scrollbar { display: none; }
-        `, document.head.appendChild(f);
+        `, document.head.appendChild(b);
       }
       u.classList.add("cyber-scrollbar-container");
     }
-  }, [k]), q = D((u, f, R, S) => {
-    const E = document.createElement("div"), O = u === "arrow";
-    O && f ? (E.className = `cyber-arrow cyber-arrow-${f} cyber-arrow-${R}`, E.innerHTML = f === "up" ? "▲" : "▼") : (E.className = `cyber-line cyber-line-${R}`, E.innerHTML = "=");
+  }, [C]), X = D((u, b, R, S) => {
+    const E = document.createElement("div"), I = u === "arrow";
+    I && b ? (E.className = `cyber-arrow cyber-arrow-${b} cyber-arrow-${R}`, E.innerHTML = b === "up" ? "▲" : "▼") : (E.className = `cyber-line cyber-line-${R}`, E.innerHTML = "=");
     const W = S.isMobile ? "none" : `drop-shadow(0 0 6px var(--color-${r}))
          drop-shadow(0 0 12px var(--color-${r}))
          drop-shadow(0 0 18px var(--color-${r}))`;
     return E.style.cssText = `
-      font-size: ${O ? S.arrowSize : S.lineSize}px;
+      font-size: ${I ? S.arrowSize : S.lineSize}px;
       color: var(--color-${r});
       opacity: 0;
       transition: all 0.2s ease;
@@ -5643,109 +5667,109 @@ const Er = ({
       font-weight: bold;
     `, E;
   }, [r]), Q = D(() => {
-    if (k)
+    if (C)
       return {
         height: window.innerHeight,
         top: 0,
         right: 0
       };
     {
-      const f = i.current.getBoundingClientRect();
+      const b = i.current.getBoundingClientRect();
       return {
-        height: f.height,
-        top: f.top,
-        right: window.innerWidth - f.right
+        height: b.height,
+        top: b.top,
+        right: window.innerWidth - b.right
       };
     }
-  }, [k]), re = D(() => {
-    if (s || !k && !i.current || (d.current && d.current.remove(), !(k ? document.body.scrollHeight > window.innerHeight : i.current.scrollHeight > i.current.clientHeight))) return;
-    const f = h(), R = Q(), S = z(R.height, f.arrowSize, f.arrowGap, f.lineSize);
-    U(k ? void 0 : i.current || void 0);
+  }, [C]), re = D(() => {
+    if (s || !C && !i.current || (d.current && d.current.remove(), !(C ? document.body.scrollHeight > window.innerHeight : i.current.scrollHeight > i.current.clientHeight))) return;
+    const b = f(), R = Q(), S = M(R.height, b.arrowSize, b.arrowGap, b.lineSize);
+    V(C ? void 0 : i.current || void 0);
     const E = document.createElement("div");
     E.className = `cyber-scrollbar ${l}`.trim();
-    const W = f.isMobile ? "transparent" : c, I = G(W);
+    const W = b.isMobile ? "transparent" : c, O = G(W);
     E.style.cssText = `
       position: fixed;
       top: ${R.top}px;
       right: ${R.right}px;
-      width: ${f.scrollbarWidth}px;
+      width: ${b.scrollbarWidth}px;
       height: ${R.height}px;
       pointer-events: none;
       z-index: 9999;
-      display: ${C ? "flex" : "none"};
+      display: ${N ? "flex" : "none"};
       flex-direction: column;
       align-items: center;
       justify-content: center;
-      gap: ${f.arrowGap}px;
-      background: ${I.background};
-      backdrop-filter: ${I.backdropFilter};
-      border-radius: ${k ? "4px 0 0 4px" : "4px"};
-      border: ${I.border};
-      box-shadow: ${I.boxShadow};
+      gap: ${b.arrowGap}px;
+      background: ${O.background};
+      backdrop-filter: ${O.backdropFilter};
+      border-radius: ${C ? "4px 0 0 4px" : "4px"};
+      border: ${O.border};
+      box-shadow: ${O.boxShadow};
     `;
-    for (let F = 0; F < S; F++)
-      E.appendChild(q("arrow", "up", F, f));
-    for (let F = 0; F < 2; F++)
-      E.appendChild(q("line", void 0, F, f));
-    for (let F = 0; F < S; F++)
-      E.appendChild(q("arrow", "down", F, f));
+    for (let B = 0; B < S; B++)
+      E.appendChild(X("arrow", "up", B, b));
+    for (let B = 0; B < 2; B++)
+      E.appendChild(X("line", void 0, B, b));
+    for (let B = 0; B < S; B++)
+      E.appendChild(X("arrow", "down", B, b));
     document.body.appendChild(E), d.current = E;
-    const M = k ? void 0 : () => {
-      const F = i.current;
-      if (F) {
-        const se = F.getBoundingClientRect();
+    const L = C ? void 0 : () => {
+      const B = i.current;
+      if (B) {
+        const se = B.getBoundingClientRect();
         E.style.top = `${se.top}px`, E.style.right = `${window.innerWidth - se.right}px`, E.style.height = `${se.height}px`;
       }
     };
-    return M && (window.addEventListener("resize", M), window.addEventListener("scroll", M)), () => {
-      E.remove(), !k && i.current && i.current.classList.remove("cyber-scrollbar-container"), M && (window.removeEventListener("resize", M), window.removeEventListener("scroll", M));
+    return L && (window.addEventListener("resize", L), window.addEventListener("scroll", L)), () => {
+      E.remove(), !C && i.current && i.current.classList.remove("cyber-scrollbar-container"), L && (window.removeEventListener("resize", L), window.removeEventListener("scroll", L));
     };
-  }, [s, k, C, U, Q, q, h, z, G, c, l]), ee = D((u, f) => {
-    const R = Math.max(1, Math.min(3, Math.ceil(u * 0.8))), S = Math.floor(f / ne.DISTANCE_THRESHOLD);
+  }, [s, C, N, V, Q, X, f, M, G, c, l]), ee = D((u, b) => {
+    const R = Math.max(1, Math.min(3, Math.ceil(u * 0.8))), S = Math.floor(b / ne.DISTANCE_THRESHOLD);
     return R + S;
-  }, []), B = D((u, f, R) => {
+  }, []), F = D((u, b, R) => {
     const S = Array.from(u).filter(
-      (O) => O.classList.contains(`cyber-arrow-${f}`)
+      (I) => I.classList.contains(`cyber-arrow-${b}`)
     ), E = Math.min(R, S.length);
-    return f === "up" ? S.slice(-E) : S.slice(0, E);
-  }, []), H = D((u, f, R) => {
-    const S = Math.min(f * a, ne.MAX_ANIMATION_SPEED), E = window.innerWidth < ne.MOBILE_BREAKPOINT, O = Math.max(300 / S, ne.MIN_GLOW_DURATION) * (E ? 1.5 : 1), W = Math.max(40, 80 / S) * (E ? 1.25 : 1), I = R === "up" ? [...u].reverse() : u;
-    I.forEach((M) => {
-      M.style.opacity = "0.3";
-    }), I.forEach((M, F) => {
-      const se = F * W, fe = setTimeout(() => {
-        M.style.opacity = "1";
-        const pe = setTimeout(() => {
-          M.style.opacity = "0.3";
-        }, O);
-        m.current.push(pe);
+    return b === "up" ? S.slice(-E) : S.slice(0, E);
+  }, []), U = D((u, b, R) => {
+    const S = Math.min(b * a, ne.MAX_ANIMATION_SPEED), E = window.innerWidth < ne.MOBILE_BREAKPOINT, I = Math.max(300 / S, ne.MIN_GLOW_DURATION) * (E ? 1.5 : 1), W = Math.max(40, 80 / S) * (E ? 1.25 : 1), O = R === "up" ? [...u].reverse() : u;
+    O.forEach((L) => {
+      L.style.opacity = "0.3";
+    }), O.forEach((L, B) => {
+      const se = B * W, fe = setTimeout(() => {
+        L.style.opacity = "1";
+        const be = setTimeout(() => {
+          L.style.opacity = "0.3";
+        }, I);
+        p.current.push(be);
       }, se);
-      m.current.push(fe);
+      p.current.push(fe);
     });
-  }, [a]), Z = D(() => {
+  }, [a]), q = D(() => {
     if (!d.current) return;
-    const { isScrolling: u, direction: f, velocity: R, scrollDistance: S } = v, E = d.current.querySelectorAll(".cyber-arrow"), O = d.current.querySelectorAll(".cyber-line");
-    if (u && f) {
-      O.forEach((I) => {
-        I.style.opacity = "0";
+    const { isScrolling: u, direction: b, velocity: R, scrollDistance: S } = w, E = d.current.querySelectorAll(".cyber-arrow"), I = d.current.querySelectorAll(".cyber-line");
+    if (u && b) {
+      I.forEach((O) => {
+        O.style.opacity = "0";
       });
       const W = ee(R, S);
-      if (W !== $.current) {
-        m.current.forEach((M) => clearTimeout(M)), m.current = [], E.forEach((M) => {
-          M.style.opacity = "0";
+      if (W !== _.current) {
+        p.current.forEach((L) => clearTimeout(L)), p.current = [], E.forEach((L) => {
+          L.style.opacity = "0";
         });
-        const I = B(Array.from(E), f, W);
-        H(I, R, f), $.current = W;
+        const O = F(Array.from(E), b, W);
+        U(O, R, b), _.current = W;
       }
     } else
-      m.current.forEach((W) => clearTimeout(W)), m.current = [], $.current = 0, E.forEach((W) => {
+      p.current.forEach((W) => clearTimeout(W)), p.current = [], _.current = 0, E.forEach((W) => {
         W.style.opacity = "0";
-      }), w && O.forEach((W) => {
+      }), v && I.forEach((W) => {
         W.style.opacity = "0.6";
       });
-  }, [v, w, H, ee, B]), Y = te(null), K = D(() => {
-    if (s || !k && !i.current) return;
-    const u = Date.now(), f = k ? {
+  }, [w, v, U, ee, F]), Y = te(null), K = D(() => {
+    if (s || !C && !i.current) return;
+    const u = Date.now(), b = C ? {
       currentScrollTop: window.scrollY,
       scrollHeight: document.body.scrollHeight,
       clientHeight: window.innerHeight
@@ -5753,130 +5777,141 @@ const Er = ({
       currentScrollTop: i.current.scrollTop,
       scrollHeight: i.current.scrollHeight,
       clientHeight: i.current.clientHeight
-    }, R = u - x.current, S = f.currentScrollTop - b.current, O = Math.abs(S) / Math.max(R, 1) * ne.VELOCITY_MULTIPLIER, W = S > 0 ? "down" : S < 0 ? "up" : null, I = f.currentScrollTop / (f.scrollHeight - f.clientHeight);
-    w || A(!0);
-    const M = window.innerWidth < ne.MOBILE_BREAKPOINT;
-    M && !C && _(!0), y((F) => ({
+    }, R = u - g.current, S = b.currentScrollTop - m.current, I = Math.abs(S) / Math.max(R, 1) * ne.VELOCITY_MULTIPLIER, W = S > 0 ? "down" : S < 0 ? "up" : null, O = b.currentScrollTop / (b.scrollHeight - b.clientHeight);
+    v || A(!0);
+    const L = window.innerWidth < ne.MOBILE_BREAKPOINT;
+    L && !N && T(!0), x((B) => ({
       isScrolling: !0,
       direction: W,
-      velocity: O,
-      position: I,
-      scrollDistance: F.direction !== W ? Math.abs(S) : F.scrollDistance + Math.abs(S)
-    })), g.current && clearTimeout(g.current), p.current && clearTimeout(p.current), g.current = setTimeout(() => {
-      m.current.forEach((F) => clearTimeout(F)), m.current = [], y((F) => ({
-        ...F,
+      velocity: I,
+      position: O,
+      scrollDistance: B.direction !== W ? Math.abs(S) : B.scrollDistance + Math.abs(S)
+    })), y.current && clearTimeout(y.current), h.current && clearTimeout(h.current), y.current = setTimeout(() => {
+      p.current.forEach((B) => clearTimeout(B)), p.current = [], x((B) => ({
+        ...B,
         isScrolling: !1,
         velocity: 0,
         scrollDistance: 0
-      })), M && (p.current = setTimeout(() => {
-        _(!1);
+      })), L && (h.current = setTimeout(() => {
+        T(!1);
       }, ne.MOBILE_HIDE_DELAY));
-    }, ne.STABLE_TIMEOUT), x.current = u, b.current = f.currentScrollTop;
-  }, [s, k, w, C]), o = D(() => {
+    }, ne.STABLE_TIMEOUT), g.current = u, m.current = b.currentScrollTop;
+  }, [s, C, v, N]), o = D(() => {
     Y.current === null && (Y.current = requestAnimationFrame(() => {
       Y.current = null, K();
     }));
   }, [K]);
-  return ae(() => {
-    if (s || !k && !i.current) return;
-    const u = re(), f = k ? window : i.current;
-    return f.addEventListener("scroll", o, { passive: !0 }), () => {
-      f.removeEventListener("scroll", o), g.current && clearTimeout(g.current), p.current && clearTimeout(p.current), m.current.forEach((R) => clearTimeout(R)), Y.current !== null && (cancelAnimationFrame(Y.current), Y.current = null), u?.();
+  return oe(() => {
+    if (s || !C && !i.current) return;
+    const u = re(), b = C ? window : i.current;
+    return b.addEventListener("scroll", o, { passive: !0 }), () => {
+      b.removeEventListener("scroll", o), y.current && clearTimeout(y.current), h.current && clearTimeout(h.current), p.current.forEach((R) => clearTimeout(R)), Y.current !== null && (cancelAnimationFrame(Y.current), Y.current = null), u?.();
     };
-  }, [re, o, s, k]), ae(() => {
-    Z();
-  }, [Z]), i;
-}, nt = lt(void 0), Lr = () => {
+  }, [re, o, s, C]), oe(() => {
+    q();
+  }, [q]), i;
+}, nt = lt(void 0), Dr = () => {
   const e = it(nt);
   if (e === void 0)
     throw new Error(
       "useCyberNotifications must be used within a CyberNotificationProvider"
     );
   return e;
-}, zr = ({ children: e, position: r = "top-right", defaultDuration: a = 2500 }) => {
-  const [s, n] = X([]), c = D(
-    (b, g, m, p = {}) => {
-      const v = Date.now().toString(), { autoHide: y = !0, duration: w = a } = p;
-      return n((A) => [...A, { id: v, type: b, title: g, message: m }]), y && setTimeout(() => {
+}, Gr = (e = {}) => {
+  const { min: r = 5, max: a = 95, speed: s = 30 } = e, [n, c] = Z(0), [l, i] = Z(1);
+  return oe(() => {
+    const d = setInterval(() => {
+      c((g) => {
+        let m = g + l;
+        return m >= a ? (m = a, i(-1)) : m <= r && (m = r, i(1)), m;
+      });
+    }, s);
+    return () => clearInterval(d);
+  }, [l, r, a, s]), n;
+}, Wr = ({ children: e, position: r = "top-right", defaultDuration: a = 2500 }) => {
+  const [s, n] = Z([]), c = D(
+    (m, y, p, h = {}) => {
+      const w = Date.now().toString(), { autoHide: x = !0, duration: v = a } = h;
+      return n((A) => [...A, { id: w, type: m, title: y, message: p }]), x && setTimeout(() => {
         n(
-          (A) => A.map((C) => C.id === v ? { ...C, isClosing: !0 } : C)
+          (A) => A.map((N) => N.id === w ? { ...N, isClosing: !0 } : N)
         ), setTimeout(() => {
-          n((A) => A.filter((C) => C.id !== v));
+          n((A) => A.filter((N) => N.id !== w));
         }, 500);
-      }, w), v;
+      }, v), w;
     },
     [a]
-  ), l = D((b) => {
+  ), l = D((m) => {
     n(
-      (g) => g.map((m) => m.id === b ? { ...m, isClosing: !0 } : m)
+      (y) => y.map((p) => p.id === m ? { ...p, isClosing: !0 } : p)
     ), setTimeout(() => {
-      n((g) => g.filter((m) => m.id !== b));
+      n((y) => y.filter((p) => p.id !== m));
     }, 500);
   }, []), i = D(() => {
     n([]);
-  }, []), d = D((b, g) => {
+  }, []), d = D((m, y) => {
     n(
-      (m) => m.map((p) => p.id === b ? { ...p, width: g } : p)
+      (p) => p.map((h) => h.id === m ? { ...h, width: y } : h)
     );
-  }, []), x = {
+  }, []), g = {
     notifications: s,
     showNotification: c,
     hideNotification: l,
     clearAllNotifications: i
   };
-  return /* @__PURE__ */ t.jsxs(nt.Provider, { value: x, children: [
+  return /* @__PURE__ */ t.jsxs(nt.Provider, { value: g, children: [
     e,
     s.length > 0 && /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: `fixed z-50 ${mr(r)}`,
+        className: `fixed z-50 ${gr(r)}`,
         "aria-live": "polite",
         "aria-relevant": "additions text",
         "aria-atomic": "true",
-        children: s.map((b, g) => /* @__PURE__ */ t.jsx(
+        children: s.map((m, y) => /* @__PURE__ */ t.jsx(
           "div",
           {
             className: "absolute",
             style: {
               right: r.includes("right") ? 0 : void 0,
               left: r.includes("left") ? 0 : void 0,
-              top: `${g * 70}px`,
-              width: b.width ? `${b.width}px` : "auto"
+              top: `${y * 70}px`,
+              width: m.width ? `${m.width}px` : "auto"
             },
             children: /* @__PURE__ */ t.jsx(
               "div",
               {
-                className: `transform transition-all duration-500 ease-out scale-75 opacity-90 w-full ${r.includes("right") ? "flex justify-end" : "flex justify-start"} ${b.isClosing ? `${r.includes("right") ? "translate-x-full" : "-translate-x-full"} opacity-0` : "translate-x-0 opacity-90"}`,
+                className: `transform transition-all duration-500 ease-out scale-75 opacity-90 w-full ${r.includes("right") ? "flex justify-end" : "flex justify-start"} ${m.isClosing ? `${r.includes("right") ? "translate-x-full" : "-translate-x-full"} opacity-0` : "translate-x-0 opacity-90"}`,
                 style: {
                   whiteSpace: "nowrap",
                   transformOrigin: r.includes("right") ? "right center" : "left center",
-                  transform: b.isClosing ? `translateX(${r.includes("right") ? "100%" : "-100%"}) scale(0.75)` : `translateX(${b.width ? "0px" : r.includes("right") ? "100%" : "-100%"}) scale(0.75)`
+                  transform: m.isClosing ? `translateX(${r.includes("right") ? "100%" : "-100%"}) scale(0.75)` : `translateX(${m.width ? "0px" : r.includes("right") ? "100%" : "-100%"}) scale(0.75)`
                 },
-                ref: (m) => {
-                  if (m && !b.width) {
-                    const p = m.scrollWidth;
-                    d(b.id, p);
+                ref: (p) => {
+                  if (p && !m.width) {
+                    const h = p.scrollWidth;
+                    d(m.id, h);
                   }
                 },
                 children: /* @__PURE__ */ t.jsx(
-                  nr,
+                  ur,
                   {
-                    type: b.type,
-                    title: b.title,
-                    message: b.message,
-                    onClose: () => l(b.id),
+                    type: m.type,
+                    title: m.title,
+                    message: m.message,
+                    onClose: () => l(m.id),
                     size: "sm"
                   }
                 )
               }
             )
           },
-          b.id
+          m.id
         ))
       }
     )
   ] });
-}, mr = (e) => {
+}, gr = (e) => {
   const r = {
     "top-right": "top-4 right-4",
     "top-left": "top-4 left-4",
@@ -5884,36 +5919,50 @@ const Er = ({
     "bottom-left": "bottom-4 left-4"
   };
   return r[e] || r["top-right"];
-}, Pr = "2.1.1";
+}, Br = "2.3.0";
+if (typeof window < "u") {
+  const e = () => {
+    getComputedStyle(document.documentElement).getPropertyValue("--color-primary").trim() || console.warn(
+      `[cyberui-2045] Stylesheet not detected.
+Add this line to your app entry file (e.g. main.tsx / index.tsx):
+
+  import 'cyberui-2045/styles.css';
+
+Without it all components lose colors, backgrounds, and animations.`
+    );
+  };
+  document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", e, { once: !0 }) : e();
+}
 export {
-  kr as Badge,
+  Er as Badge,
   We as Button,
-  wr as Card,
-  Sr as Carousel,
-  Ar as Checkbox,
-  gr as CircularProgress,
-  zr as CyberNotificationProvider,
-  Rr as Divider,
-  Er as GradientText,
+  Sr as Card,
+  Rr as Carousel,
+  Ir as Checkbox,
+  kr as CircularProgress,
+  Wr as CyberNotificationProvider,
+  Pr as Divider,
+  Ar as GradientText,
   je as Image,
-  vr as Input,
-  yr as LinearProgress,
-  ur as Modal,
-  nr as Notification,
-  oe as RESPONSIVE_SIZE_MAPS,
-  $r as SectionTitle,
-  xr as SegmentedProgress,
-  Nr as Select,
-  Cr as Skeleton,
-  _r as Steps,
-  hr as TabNavigation,
-  Tr as Timeline,
-  jr as Toggle,
-  T as cn,
-  pr as combineResponsiveClasses,
-  V as getResponsiveClasses,
-  Lr as useCyberNotifications,
-  Mr as useCyberScrollbar,
-  Pr as version
+  Cr as Input,
+  Nr as LinearProgress,
+  hr as Modal,
+  ur as Notification,
+  ae as RESPONSIVE_SIZE_MAPS,
+  Mr as SectionTitle,
+  jr as SegmentedProgress,
+  $r as Select,
+  Tr as Skeleton,
+  zr as Steps,
+  wr as TabNavigation,
+  Lr as Timeline,
+  _r as Toggle,
+  $ as cn,
+  vr as combineResponsiveClasses,
+  H as getResponsiveClasses,
+  Gr as useAnimatedProgress,
+  Dr as useCyberNotifications,
+  Or as useCyberScrollbar,
+  Br as version
 };
 //# sourceMappingURL=index.es.js.map