@mova-ui/react 0.4.6 → 0.4.7

package/dist/index.js

@@ -4172,18 +4172,599 @@ function AnimatedSidebar({
   ] });
 }
 
+// .generated/ui/cards/balance-bar-chart-card.tsx
+import * as React from "react";
+import { ArrowDownRight, ArrowUpRight } from "lucide-react";
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+var periodsDefault = [
+  { id: "week", label: "Week", balance: 12480.5, change: "+8.2%", detail: "+ $940.20 this week", points: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"].map((label, i) => ({ label, value: [640, 920, 760, 1180, 960, 1380, 1140][i] })) },
+  { id: "month", label: "Month", balance: 12480.5, change: "+12.8%", detail: "+ $1,416.23 this month", points: ["1\u20134", "5\u20138", "9\u201312", "13\u201316", "17\u201320", "21\u201324", "25\u201331"].map((label, i) => ({ label, value: [2800, 3400, 2100, 3900, 3200, 4600, 5100][i] })) },
+  { id: "year", label: "Year", balance: 12480.5, change: "+24.6%", detail: "+ $2,464.05 this year", points: ["Jan", "Mar", "May", "Jul", "Sep", "Nov", "Dec"].map((label, i) => ({ label, value: [5200, 6800, 6100, 8400, 9200, 11400, 12480][i] })) }
+];
+function BalanceBarChartCard({ periods = periodsDefault, defaultPeriod = "week", currency = "USD", locale = "en-US", onPeriodChange, theme = "light", className = "", style } = {}) {
+  const [selected, setSelected] = React.useState(defaultPeriod);
+  const [active, setActive] = React.useState(null);
+  const period = periods.find((item) => item.id === selected) ?? periods[0];
+  const money = new Intl.NumberFormat(locale, { style: "currency", currency });
+  const max = Math.max(1, ...period?.points.map((point) => Math.abs(point.value)) ?? []);
+  const tipId = React.useId();
+  const signed = period?.points.some((point) => point.value < 0) ?? false;
+  const negativeChange = period?.change.trim().startsWith("-");
+  return /* @__PURE__ */ jsxs13("section", { className: `mova-balance ${className}`, "data-theme": theme, style, "aria-label": "Balance chart", children: [
+    /* @__PURE__ */ jsx13("style", { children: css }),
+    /* @__PURE__ */ jsx13("div", { className: "mbc-label", children: "Balance" }),
+    /* @__PURE__ */ jsxs13("div", { className: "mbc-summary", children: [
+      /* @__PURE__ */ jsx13("strong", { children: money.format(period?.balance ?? 0) }),
+      period && /* @__PURE__ */ jsxs13("span", { className: "mbc-change", "data-negative": negativeChange, children: [
+        negativeChange ? /* @__PURE__ */ jsx13(ArrowDownRight, { size: 11, "aria-hidden": "true" }) : /* @__PURE__ */ jsx13(ArrowUpRight, { size: 11, "aria-hidden": "true" }),
+        period.change
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx13("p", { className: "mbc-detail", children: period?.detail ?? "No balance data" }),
+    /* @__PURE__ */ jsxs13("div", { className: "mbc-chart", onMouseLeave: () => setActive(null), children: [
+      period?.points.map((point, index) => /* @__PURE__ */ jsxs13("button", { type: "button", className: "mbc-column", "aria-label": `${point.label}: ${money.format(point.value)}`, "aria-describedby": active === index ? tipId : void 0, onFocus: () => setActive(index), onBlur: () => setActive(null), onMouseEnter: () => setActive(index), onClick: () => setActive(index), "data-active": active === index || active === null && index === period.points.length - 1, children: [
+        /* @__PURE__ */ jsx13("span", { className: "mbc-track", "data-signed": signed, children: /* @__PURE__ */ jsx13("span", { className: "mbc-bar", style: { height: `${Math.max(1, Math.abs(point.value) / max * (signed ? 50 : 100))}%`, ...signed ? point.value < 0 ? { top: "50%", bottom: "auto", borderRadius: "0 0 3px 3px" } : { bottom: "50%" } : {} } }) }),
+        /* @__PURE__ */ jsx13("span", { className: "mbc-axis", children: period.id === "week" ? point.label[0] : point.label })
+      ] }, `${period.id}-${index}`)),
+      active !== null && period?.points[active] && /* @__PURE__ */ jsxs13("div", { id: tipId, role: "tooltip", className: "mbc-tooltip", children: [
+        period.points[active].label,
+        " \xB7 ",
+        money.format(period.points[active].value)
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx13("div", { className: "mbc-periods", role: "group", "aria-label": "Chart period", children: periods.map((item) => /* @__PURE__ */ jsx13("button", { type: "button", "aria-pressed": period?.id === item.id, onClick: () => {
+      setSelected(item.id);
+      setActive(null);
+      onPeriodChange?.(item);
+    }, children: item.label }, item.id)) })
+  ] });
+}
+var css = `
+.mova-balance{--mbc-bg:#fff;--mbc-fg:#202124;--mbc-muted:#737373;--mbc-bar:#e6e6e8;--mbc-chip:#f4f4f5;box-sizing:border-box;width:300px;max-width:100%;padding:24px;border-radius:24px;border:1px solid #88888818;background:var(--mbc-bg);color:var(--mbc-fg);font:400 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;box-shadow:0 8px 32px -4px #0000000c}.mova-balance[data-theme=dark]{--mbc-bg:#1d1d1d;--mbc-fg:#f2f2f2;--mbc-muted:#aaa;--mbc-bar:#3b3b3e;--mbc-chip:#29292b;color-scheme:dark}.mova-balance *{box-sizing:border-box}.mbc-label{font-size:13px;color:var(--mbc-muted)}.mbc-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}.mbc-summary>strong{font-size:28px;line-height:34px;font-weight:500;letter-spacing:-1px;font-variant-numeric:tabular-nums}.mbc-change{display:inline-flex;align-items:center;background:#e5f6ed;color:#267151;font-size:10px;line-height:17px;padding:0 5px;border-radius:20px}.mova-balance[data-theme=dark] .mbc-change{background:#243d31;color:#8bd8b0}.mbc-detail{margin:4px 0 0;color:var(--mbc-muted);font-size:12px}.mbc-chart{display:flex;position:relative;gap:8px;margin-top:24px}.mova-balance button{border:0;font:inherit;cursor:pointer;color:inherit}.mova-balance button:focus-visible{outline:2px solid #7e9be9;outline-offset:3px}.mbc-column{background:transparent;min-width:0;flex:1;padding:0 0 4px;display:flex;flex-direction:column;gap:8px;align-items:center;border-radius:4px}.mbc-track{position:relative;height:112px;width:100%;display:flex;align-items:flex-end;justify-content:center}.mbc-track[data-signed=true]:after{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:#8885}.mbc-track[data-signed=true] .mbc-bar{position:absolute}.mbc-change[data-negative=true]{background:#fbe9e9;color:#ad3c3c}.mova-balance[data-theme=dark] .mbc-change[data-negative=true]{background:#4c2b2b;color:#ffaaaa}.mbc-bar{width:100%;max-width:24px;border-radius:3px 3px 0 0;background:var(--mbc-bar);transform-origin:bottom;animation:mbc-rise 350ms ease-out;transition:height 250ms,background 150ms}.mbc-column[data-active=true] .mbc-bar{background:var(--mbc-fg)}.mbc-axis{font-size:10px;line-height:16px;color:var(--mbc-muted)}.mbc-tooltip{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:var(--mbc-fg);color:var(--mbc-bg);padding:4px 8px;border-radius:7px;max-width:100%;width:max-content;overflow-wrap:anywhere;text-align:center;font-size:11px;pointer-events:none}.mbc-periods{display:flex;gap:4px;background:var(--mbc-chip);padding:4px;border-radius:24px;margin-top:20px}.mbc-periods button{background:transparent;flex:1;min-width:0;overflow-wrap:anywhere;padding:6px 4px;border-radius:20px;font-size:12px;color:var(--mbc-muted);transition:background 180ms,color 180ms}.mbc-periods button[aria-pressed=true]{color:var(--mbc-fg);background:var(--mbc-bg);box-shadow:0 1px 3px #00000012}@keyframes mbc-rise{from{transform:scaleY(.05);opacity:.4}to{transform:scaleY(1);opacity:1}}@media(prefers-reduced-motion:reduce){.mova-balance *{animation:none!important;transition:none!important}}
+`;
+
+// .generated/ui/cards/calendar-day-card.tsx
+import * as React2 from "react";
+import { ChevronLeft, ChevronRight as ChevronRight3 } from "lucide-react";
+import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+var weekdays = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"];
+var meetingTitles = [["Weekly planning", "Design critique"], ["Roadmap review", "Lunch with Priya", "Hiring sync"], ["Customer call", "Sprint demo"], ["Standup", "Product review", "1:1 with Maya"], ["Retro", "Team drinks"]];
+var meetingTimes = [["9:30 \u2013 10:15", "14:00 \u2013 15:00"], ["10:00 \u2013 11:00", "13:30 \u2013 14:30", "16:00 \u2013 16:30"], ["11:00 \u2013 11:30", "15:00 \u2013 16:00"], ["9:00 \u2013 9:15", "11:30 \u2013 12:30", "16:00 \u2013 16:30"], ["10:00 \u2013 10:45", "15:30 \u2013 16:30"]];
+var defaultDays = weekdays.map((weekday, index) => ({ id: `${index + 11}`, weekday, day: index + 11, dateLabel: `March ${index + 11}`, events: meetingTitles[index].map((title, event) => ({ id: `${index}-${event}`, title, time: meetingTimes[index][event], location: ["Zoom", "Room 2", "Caf\xE9"][event], color: ["#7894e3", "#d7a265", "#b18ad1"][event] })) }));
+function CalendarDayCard({ days = defaultDays, defaultSelectedDay = "14", onDayChange, onEventClick, theme = "light", className = "", style } = {}) {
+  const [selected, setSelected] = React2.useState(defaultSelectedDay);
+  const currentIndex = Math.max(0, days.findIndex((day) => day.id === selected));
+  const current = days[currentIndex];
+  const labelId = React2.useId();
+  function select(index) {
+    const day = days[index];
+    if (day) {
+      setSelected(day.id);
+      onDayChange?.(day);
+    }
+  }
+  return /* @__PURE__ */ jsxs14("section", { className: `mova-calendar ${className}`, "data-theme": theme, style, "aria-label": "Calendar day", children: [
+    /* @__PURE__ */ jsx14("style", { children: css2 }),
+    /* @__PURE__ */ jsxs14("header", { children: [
+      /* @__PURE__ */ jsxs14("div", { children: [
+        /* @__PURE__ */ jsx14("h2", { id: labelId, children: current?.weekday ?? "Your calendar" }),
+        /* @__PURE__ */ jsx14("p", { children: current ? `${current.dateLabel} \xB7 ${current.events.length} ${current.events.length === 1 ? "meeting" : "meetings"}` : "No days available" })
+      ] }),
+      /* @__PURE__ */ jsxs14("div", { className: "mcd-arrows", children: [
+        /* @__PURE__ */ jsx14("button", { type: "button", "aria-label": "Previous day", disabled: !current || currentIndex === 0, onClick: () => select(currentIndex - 1), children: /* @__PURE__ */ jsx14(ChevronLeft, { size: 16 }) }),
+        /* @__PURE__ */ jsx14("button", { type: "button", "aria-label": "Next day", disabled: !current || currentIndex === days.length - 1, onClick: () => select(currentIndex + 1), children: /* @__PURE__ */ jsx14(ChevronRight3, { size: 16 }) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx14("div", { className: "mcd-days", role: "group", "aria-label": "Select a day", children: days.map((day, index) => /* @__PURE__ */ jsxs14("button", { type: "button", "aria-pressed": current?.id === day.id, "aria-label": `${day.weekday}, ${day.dateLabel}`, onClick: () => select(index), children: [
+      /* @__PURE__ */ jsx14("span", { children: day.weekday.slice(0, 3) }),
+      /* @__PURE__ */ jsx14("strong", { children: day.day })
+    ] }, day.id)) }),
+    /* @__PURE__ */ jsx14("div", { className: "mcd-agenda", "aria-labelledby": labelId, "aria-live": "polite", children: current?.events.length ? current.events.map((event) => /* @__PURE__ */ jsxs14("button", { type: "button", className: "mcd-event", onClick: () => onEventClick?.(event), disabled: !onEventClick, style: { "--mcd-event": event.color ?? "#7894e3" }, children: [
+      /* @__PURE__ */ jsx14("span", { className: "mcd-event-line", "aria-hidden": "true" }),
+      /* @__PURE__ */ jsxs14("span", { children: [
+        /* @__PURE__ */ jsx14("strong", { children: event.title }),
+        /* @__PURE__ */ jsxs14("small", { children: [
+          event.time,
+          event.location ? ` \xB7 ${event.location}` : ""
+        ] })
+      ] })
+    ] }, event.id)) : /* @__PURE__ */ jsx14("p", { className: "mcd-empty", children: "Nothing scheduled. Enjoy your day." }) }, current?.id)
+  ] });
+}
+var css2 = `
+.mova-calendar{--mcd-bg:#fff;--mcd-fg:#222;--mcd-muted:#737373;--mcd-chip:#f4f4f4;width:300px;max-width:100%;box-sizing:border-box;padding:24px;border-radius:24px;color:var(--mcd-fg);background:var(--mcd-bg);font:400 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;border:1px solid #88888818;box-shadow:0 8px 32px -4px #0000000c}.mova-calendar[data-theme=dark]{--mcd-bg:#1d1d1d;--mcd-fg:#f2f2f2;--mcd-muted:#aaa;--mcd-chip:#2b2b2b;color-scheme:dark}.mova-calendar *{box-sizing:border-box}.mova-calendar h2,.mova-calendar p{margin:0}.mova-calendar h2{font-size:16px;line-height:22px;font-weight:500}.mova-calendar header{display:flex;align-items:center;gap:8px}.mova-calendar header>div:first-child{min-width:0;flex:1}.mova-calendar header p{font-size:12px;color:var(--mcd-muted);margin-top:2px}.mova-calendar button{font:inherit;color:inherit;border:0;background:transparent;cursor:pointer}.mova-calendar button:focus-visible{outline:2px solid #6d8ee6;outline-offset:3px}.mcd-arrows{display:flex;flex:none}.mcd-arrows button{width:28px;height:32px;display:grid;place-items:center;border-radius:8px}.mcd-arrows button:hover{background:var(--mcd-chip)}.mcd-arrows button:disabled{opacity:.3;cursor:default}.mcd-days{display:flex;gap:4px;margin:20px 0 16px;overflow:auto;padding:3px}.mcd-days button{min-width:38px;flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;border-radius:12px;transition:background 180ms,color 180ms}.mcd-days span{font-size:11px;color:var(--mcd-muted)}.mcd-days strong{font-size:16px;font-weight:500}.mcd-days button[aria-pressed=true]{background:var(--mcd-fg);color:var(--mcd-bg)}.mcd-days button[aria-pressed=true] span{color:inherit;opacity:.75}.mcd-days button:not([aria-pressed=true]):hover{background:var(--mcd-chip)}.mcd-agenda{border-top:1px solid #88888820;padding-top:12px;min-height:174px;animation:mcd-enter 220ms ease-out}.mcd-event{width:100%;display:flex;gap:12px;padding:8px 0!important;text-align:left;border-radius:5px}.mcd-event:disabled{opacity:1;cursor:default}.mcd-event-line{width:3px;align-self:stretch;background:var(--mcd-event);border-radius:4px;flex:none}.mcd-event>span:last-child{min-width:0}.mcd-event strong{display:block;font-size:13px;font-weight:500;overflow-wrap:anywhere}.mcd-event small{display:block;font-size:12px;color:var(--mcd-muted)}.mcd-empty{padding-top:12px;color:var(--mcd-muted)}@keyframes mcd-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.mova-calendar *{animation:none!important;transition:none!important}}
+`;
+
+// .generated/ui/cards/day-trading-order-ticket.tsx
+import * as React3 from "react";
+import { Check as Check2, Minus, Plus as Plus2 } from "lucide-react";
+import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
+function DayTradingOrderTicket({ symbol = "NOVA", company = "Novaline Robotics", quote = 184.2, change = "+1.24%", initialShares = 10, onSubmit, theme = "light", className = "", style } = {}) {
+  const [side, setSide] = React3.useState("buy");
+  const [type, setType] = React3.useState("limit");
+  const [shares, setShares] = React3.useState(String(initialShares));
+  const [price, setPrice] = React3.useState(quote.toFixed(2));
+  const [error, setError] = React3.useState("");
+  const [busy, setBusy] = React3.useState(false);
+  const [done, setDone] = React3.useState(null);
+  const guard = React3.useRef(false);
+  const alive = React3.useRef(true);
+  const heading = React3.useRef(null);
+  const shareInput = React3.useRef(null);
+  const id = React3.useId();
+  const refocus = React3.useRef(false);
+  React3.useEffect(() => {
+    alive.current = true;
+    return () => {
+      alive.current = false;
+    };
+  }, []);
+  React3.useEffect(() => {
+    if (done) heading.current?.focus();
+    else if (refocus.current) {
+      shareInput.current?.focus();
+      refocus.current = false;
+    }
+  }, [done]);
+  const count = Number(shares);
+  const effectivePrice = type === "market" ? quote : Number(price);
+  const total = Number.isFinite(count * effectivePrice) && count > 0 && effectivePrice > 0 ? count * effectivePrice : 0;
+  const money = (value) => new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }).format(value);
+  async function submit(event) {
+    event.preventDefault();
+    if (guard.current) return;
+    if (!Number.isInteger(count) || count < 1 || count > 9999) {
+      setError("Enter between 1 and 9,999 whole shares.");
+      shareInput.current?.focus();
+      return;
+    }
+    if (!Number.isFinite(effectivePrice) || effectivePrice <= 0) {
+      setError("Enter a price greater than zero.");
+      return;
+    }
+    const draft = { symbol, side, type, shares: count, price: effectivePrice, estimatedTotal: total };
+    guard.current = true;
+    setBusy(true);
+    setError("");
+    try {
+      await onSubmit?.(draft);
+      if (alive.current) setDone(draft);
+    } catch {
+      if (alive.current) setError("The order could not be submitted. Please try again.");
+    } finally {
+      guard.current = false;
+      if (alive.current) setBusy(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs15("section", { className: `mova-order ${className}`, "data-theme": theme, style, "aria-label": "Trading order ticket", children: [
+    /* @__PURE__ */ jsx15("style", { children: css3 }),
+    done ? /* @__PURE__ */ jsxs15("div", { className: "mot-done", children: [
+      /* @__PURE__ */ jsx15("span", { className: "mot-check", children: /* @__PURE__ */ jsx15(Check2, { size: 24 }) }),
+      /* @__PURE__ */ jsx15("h2", { ref: heading, tabIndex: -1, children: onSubmit ? "Order submitted" : "Order preview ready" }),
+      /* @__PURE__ */ jsxs15("p", { children: [
+        done.side === "buy" ? "Buy" : "Sell",
+        " ",
+        done.shares,
+        " ",
+        done.symbol,
+        " \xB7 ",
+        done.type,
+        " order"
+      ] }),
+      /* @__PURE__ */ jsxs15("div", { className: "mot-total", children: [
+        /* @__PURE__ */ jsx15("span", { children: "Est. total" }),
+        /* @__PURE__ */ jsx15("strong", { children: money(done.estimatedTotal) })
+      ] }),
+      /* @__PURE__ */ jsx15("button", { type: "button", className: "mot-submit", onClick: () => {
+        refocus.current = true;
+        setDone(null);
+      }, children: "New order" })
+    ] }) : /* @__PURE__ */ jsxs15("form", { onSubmit: (event) => void submit(event), noValidate: true, children: [
+      /* @__PURE__ */ jsxs15("header", { children: [
+        /* @__PURE__ */ jsxs15("div", { children: [
+          /* @__PURE__ */ jsx15("h2", { children: symbol }),
+          /* @__PURE__ */ jsx15("p", { children: company })
+        ] }),
+        /* @__PURE__ */ jsxs15("div", { className: "mot-quote", children: [
+          /* @__PURE__ */ jsx15("span", { children: money(quote) }),
+          /* @__PURE__ */ jsx15("small", { "data-negative": change.trim().startsWith("-"), children: change })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx15("div", { className: "mot-side", role: "group", "aria-label": "Order side", children: ["buy", "sell"].map((value) => /* @__PURE__ */ jsx15("button", { type: "button", "aria-pressed": value === side, disabled: busy, onClick: () => setSide(value), children: value === "buy" ? "Buy" : "Sell" }, value)) }),
+      /* @__PURE__ */ jsxs15("label", { className: "mot-type", htmlFor: `${id}-type`, children: [
+        /* @__PURE__ */ jsx15("span", { children: "Order type" }),
+        /* @__PURE__ */ jsxs15("select", { id: `${id}-type`, value: type, disabled: busy, onChange: (event) => {
+          setType(event.target.value);
+          setError("");
+        }, children: [
+          /* @__PURE__ */ jsx15("option", { value: "market", children: "Market order" }),
+          /* @__PURE__ */ jsx15("option", { value: "limit", children: "Limit order" }),
+          /* @__PURE__ */ jsx15("option", { value: "stop", children: "Stop order" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs15("label", { className: "mot-field", htmlFor: `${id}-shares`, children: [
+        /* @__PURE__ */ jsx15("span", { children: "Shares" }),
+        /* @__PURE__ */ jsxs15("span", { className: "mot-input", children: [
+          /* @__PURE__ */ jsx15("button", { type: "button", "aria-label": "One share less", disabled: busy || count <= 1, onClick: () => {
+            setShares(String(Math.max(1, (Number(shares) || 1) - 1)));
+            setError("");
+          }, children: /* @__PURE__ */ jsx15(Minus, { size: 15 }) }),
+          /* @__PURE__ */ jsx15("input", { ref: shareInput, id: `${id}-shares`, inputMode: "numeric", value: shares, disabled: busy, "aria-describedby": error ? `${id}-error` : void 0, onChange: (event) => {
+            setShares(event.target.value.replace(/[^0-9]/g, "").slice(0, 4));
+            setError("");
+          } }),
+          /* @__PURE__ */ jsx15("button", { type: "button", "aria-label": "One share more", disabled: busy || count >= 9999, onClick: () => {
+            setShares(String(Math.min(9999, (Number(shares) || 0) + 1)));
+            setError("");
+          }, children: /* @__PURE__ */ jsx15(Plus2, { size: 15 }) })
+        ] })
+      ] }),
+      type !== "market" && /* @__PURE__ */ jsxs15("label", { className: "mot-field mot-price", htmlFor: `${id}-price`, children: [
+        /* @__PURE__ */ jsx15("span", { children: type === "stop" ? "Stop price" : "Limit price" }),
+        /* @__PURE__ */ jsxs15("span", { className: "mot-input", children: [
+          /* @__PURE__ */ jsx15("span", { "aria-hidden": "true", children: "$" }),
+          /* @__PURE__ */ jsx15("input", { id: `${id}-price`, inputMode: "decimal", value: price, disabled: busy, "aria-describedby": error ? `${id}-error` : void 0, onChange: (event) => {
+            setPrice(event.target.value);
+            setError("");
+          } })
+        ] })
+      ] }),
+      error && /* @__PURE__ */ jsx15("p", { id: `${id}-error`, className: "mot-error", role: "alert", children: error }),
+      /* @__PURE__ */ jsxs15("div", { className: "mot-total", children: [
+        /* @__PURE__ */ jsx15("span", { children: "Est. total" }),
+        /* @__PURE__ */ jsx15("strong", { children: money(total) }, total)
+      ] }),
+      /* @__PURE__ */ jsx15("button", { type: "submit", className: "mot-submit", disabled: busy, "aria-busy": busy, children: busy ? "Submitting\u2026" : `${side === "buy" ? "Buy" : "Sell"} ${symbol}` }),
+      !onSubmit && /* @__PURE__ */ jsx15("p", { className: "mot-note", children: "Interactive preview \xB7 no real order" })
+    ] })
+  ] });
+}
+var css3 = `
+.mova-order{--mot-bg:#fff;--mot-fg:#232323;--mot-muted:#777;--mot-chip:#f4f4f4;box-sizing:border-box;width:300px;max-width:100%;padding:24px;border-radius:24px;background:var(--mot-bg);color:var(--mot-fg);border:1px solid #88888818;box-shadow:0 8px 32px -4px #0000000c;font:400 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.mova-order[data-theme=dark]{--mot-bg:#1d1d1d;--mot-fg:#f2f2f2;--mot-muted:#aaa;--mot-chip:#2c2c2c;color-scheme:dark}.mova-order *{box-sizing:border-box}.mova-order h2,.mova-order p{margin:0}.mova-order h2{font-size:16px;line-height:22px;font-weight:500}.mova-order button,.mova-order input,.mova-order select{font:inherit;color:inherit}.mova-order button{border:0;cursor:pointer}.mova-order button:disabled{cursor:default;opacity:.5}.mova-order :focus-visible{outline:2px solid #7696e9;outline-offset:3px}.mova-order header{display:flex;align-items:flex-start;gap:8px}.mova-order header>div:first-child{min-width:0;flex:1}.mova-order header p{font-size:12px;color:var(--mot-muted);overflow-wrap:anywhere}.mot-quote{display:flex;flex-direction:column;align-items:flex-end;flex:none;font-variant-numeric:tabular-nums}.mot-quote small{padding:0 6px;font-size:10px;line-height:18px;border-radius:20px;background:#e7f8ef;color:#327b59}.mova-order[data-theme=dark] .mot-quote small{background:#254636;color:#a1dbb9}.mot-quote small[data-negative=true]{background:#fbe9e9;color:#ad3c3c}.mova-order[data-theme=dark] .mot-quote small[data-negative=true]{background:#4c2b2b;color:#ffaaaa}.mot-side{display:flex;gap:4px;background:var(--mot-chip);padding:4px;border-radius:24px;margin:18px 0}.mot-side button{background:none;flex:1;padding:7px;border-radius:20px;color:var(--mot-muted);transition:background 180ms}.mot-side button[aria-pressed=true]{background:var(--mot-bg);color:var(--mot-fg);box-shadow:0 1px 3px #0002}.mot-type{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:14px;color:var(--mot-muted)}.mot-type select{min-width:0;max-width:65%;background:transparent;border:0;cursor:pointer;font-size:12px}.mot-type option{background:var(--mot-bg)}.mot-field{display:flex;flex-direction:column;gap:7px;margin-top:12px;font-size:12px;color:var(--mot-muted)}.mot-input{display:flex;align-items:center;border-radius:10px;background:var(--mot-chip);padding:5px;min-height:38px;color:var(--mot-fg)}.mot-input>span{padding-left:8px}.mot-input button{width:28px;height:28px;display:grid;place-items:center;flex:none;border-radius:6px;background:none}.mot-input button:hover{background:#88888820}.mot-input input{width:100%;min-width:0;text-align:center;background:none;border:0;padding:3px;outline:none;font-variant-numeric:tabular-nums}.mot-price input{text-align:right;padding-right:8px}.mot-input:focus-within{outline:2px solid #7696e9;outline-offset:2px}.mot-total{display:flex;justify-content:space-between;gap:8px;border-top:1px solid #88888820;padding-top:16px;margin-top:20px}.mot-total>span{color:var(--mot-muted)}.mot-total strong{font-size:16px;font-weight:500;font-variant-numeric:tabular-nums;animation:mot-appear 200ms ease-out}.mot-submit{display:block;width:100%;margin-top:18px;padding:11px 12px;border-radius:24px;background:var(--mot-fg);color:var(--mot-bg)!important;transition:opacity 150ms,transform 150ms}.mot-submit:active{transform:scale(.98)}.mot-note{color:var(--mot-muted);font-size:10px;text-align:center;margin-top:8px!important}.mot-error{font-size:12px;color:#d34c4c;margin-top:12px!important}.mot-done{min-height:276px;display:flex;flex-direction:column;justify-content:center;animation:mot-appear 240ms ease-out}.mot-check{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--mot-chip);margin-bottom:16px}.mot-done>p{font-size:12px;color:var(--mot-muted);margin-top:6px}.mot-done h2:focus{outline:none}@keyframes mot-appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.mova-order *{animation:none!important;transition:none!important}}
+`;
+
+// .generated/ui/cards/imessage-chat.tsx
+import * as React4 from "react";
+import { ArrowUp, RotateCcw, Video } from "lucide-react";
+import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
+var conversation = [
+  { id: "1", text: "Are we still on for Saturday?", direction: "incoming" },
+  { id: "2", text: "Yes! Trail at 9?", direction: "outgoing" },
+  { id: "3", text: "Perfect. I'll bring coffee", direction: "incoming" },
+  { id: "4", text: "The good kind this time", direction: "incoming" },
+  { id: "5", text: "You're the best", direction: "outgoing" }
+];
+function IMessageChat({ name = "Maya Chen", avatar, deliveryStatus, initialMessages = conversation, onSend, onVideoCall, theme = "light", className = "", style } = {}) {
+  const [messages, setMessages] = React4.useState(initialMessages);
+  const [draft, setDraft] = React4.useState("");
+  const [status, setStatus] = React4.useState("Read");
+  const thread = React4.useRef(null);
+  const sequence = React4.useRef(0);
+  const instanceId = React4.useId();
+  React4.useEffect(() => {
+    if (thread.current) thread.current.scrollTop = thread.current.scrollHeight;
+  }, [messages]);
+  function send(event) {
+    event.preventDefault();
+    const text = draft.trim();
+    if (!text) return;
+    setMessages((current) => [...current, { id: `${instanceId}-sent-${++sequence.current}`, text, direction: "outgoing" }]);
+    setDraft("");
+    setStatus("Sent");
+    onSend?.(text);
+  }
+  return /* @__PURE__ */ jsxs16("section", { className: `mova-imessage ${className}`, "data-theme": theme, style, "aria-label": `Conversation with ${name}`, children: [
+    /* @__PURE__ */ jsx16("style", { children: css4 }),
+    /* @__PURE__ */ jsxs16("header", { children: [
+      /* @__PURE__ */ jsx16("span", { className: "mic-avatar", children: avatar ? /* @__PURE__ */ jsx16("img", { src: avatar, alt: "" }) : name.split(" ").map((word) => word[0]).slice(0, 2).join("") }),
+      /* @__PURE__ */ jsxs16("div", { className: "mic-person", children: [
+        /* @__PURE__ */ jsx16("strong", { children: name }),
+        /* @__PURE__ */ jsx16("span", { children: "iMessage" })
+      ] }),
+      /* @__PURE__ */ jsx16("button", { type: "button", "aria-label": "Restart conversation", title: "Restart conversation", onClick: () => {
+        setMessages(initialMessages);
+        setStatus("Read");
+      }, children: /* @__PURE__ */ jsx16(RotateCcw, { size: 16 }) }),
+      onVideoCall && /* @__PURE__ */ jsx16("button", { type: "button", "aria-label": `Video call ${name}`, onClick: onVideoCall, children: /* @__PURE__ */ jsx16(Video, { size: 17 }) })
+    ] }),
+    /* @__PURE__ */ jsx16("div", { className: "mic-thread", ref: thread, role: "log", "aria-label": "Messages", "aria-relevant": "additions", children: /* @__PURE__ */ jsxs16("div", { className: "mic-messages", children: [
+      /* @__PURE__ */ jsx16("div", { className: "mic-time", children: "Today 9:41 AM" }),
+      messages.map((message) => /* @__PURE__ */ jsx16("div", { className: `mic-bubble mic-${message.direction}`, children: message.text }, message.id)),
+      /* @__PURE__ */ jsx16("div", { className: "mic-status", role: "status", children: deliveryStatus ?? status })
+    ] }) }),
+    /* @__PURE__ */ jsxs16("form", { onSubmit: send, children: [
+      /* @__PURE__ */ jsx16("input", { "aria-label": "Message", placeholder: "iMessage", value: draft, maxLength: 2e3, onChange: (event) => setDraft(event.target.value) }),
+      /* @__PURE__ */ jsx16("button", { type: "submit", "aria-label": "Send message", disabled: !draft.trim(), children: /* @__PURE__ */ jsx16(ArrowUp, { size: 18 }) })
+    ] })
+  ] });
+}
+var css4 = `
+.mova-imessage{--mic-bg:#fff;--mic-fg:#202124;--mic-muted:#727479;--mic-soft:#f0f0f2;--mic-line:#dfdfe3;box-sizing:border-box;width:300px;max-width:100%;border-radius:24px;background:var(--mic-bg);color:var(--mic-fg);font:400 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;box-shadow:0 1px 3px #0000000a,0 8px 32px -4px #00000010;border:1px solid #88888818;overflow:hidden}
+.mova-imessage[data-theme=dark]{--mic-bg:#1d1d1d;--mic-fg:#f2f2f2;--mic-muted:#a2a2a8;--mic-soft:#313133;--mic-line:#49494c;color-scheme:dark}
+.mova-imessage *{box-sizing:border-box}.mova-imessage button,.mova-imessage input{font:inherit}.mova-imessage button{border:0;cursor:pointer;display:grid;place-items:center;flex:none;background:transparent;color:inherit;width:32px;height:32px;border-radius:50%;transition:background 160ms,transform 160ms}.mova-imessage button:hover{background:var(--mic-soft)}.mova-imessage button:active{transform:scale(.95)}.mova-imessage :focus-visible{outline:2px solid #3478f6;outline-offset:3px}.mova-imessage header{display:flex;gap:10px;align-items:center;padding:16px;border-bottom:1px solid #88888814}.mic-avatar{display:grid;place-items:center;width:32px;height:32px;flex:none;border-radius:50%;background:#c7b0a1;color:#433b37;font-size:11px;font-weight:600;overflow:hidden}.mic-avatar img{width:100%;height:100%;object-fit:cover}.mic-person{flex:1;min-width:0;display:flex;flex-direction:column}.mic-person strong{font-size:15px;font-weight:500;overflow-wrap:anywhere}.mic-person span,.mic-time,.mic-status{font-size:12px;line-height:16px;color:var(--mic-muted)}.mic-thread{height:252px;overflow:auto;padding:12px 16px;overscroll-behavior:contain}.mic-messages{min-height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:4px}.mic-time{align-self:center;margin-bottom:8px}.mic-bubble{max-width:82%;padding:8px 12px;border-radius:18px;overflow-wrap:anywhere;animation:mic-enter 240ms ease-out both}.mic-incoming{align-self:flex-start;background:var(--mic-soft);border-bottom-left-radius:5px}.mic-outgoing{align-self:flex-end;background:#2767f4;color:#fff;border-bottom-right-radius:5px}.mic-status{align-self:flex-end;margin-top:2px}.mova-imessage form{margin:12px 16px 16px;border:1px solid var(--mic-line);border-radius:24px;display:flex;align-items:center;padding:3px;gap:4px}.mova-imessage input{min-width:0;width:100%;border:0;outline:none;background:transparent;color:inherit;padding:4px 8px}.mova-imessage form:focus-within{outline:2px solid #3478f6;outline-offset:2px}.mova-imessage form button{background:#2767f4;color:#fff;width:28px;height:28px}.mova-imessage form button:hover{background:#1759e1}.mova-imessage form button:disabled{background:var(--mic-soft);color:var(--mic-muted);cursor:default}@keyframes mic-enter{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.mova-imessage *{animation:none!important;transition:none!important}}
+`;
+
+// .generated/ui/cards/liquid-glass-sheet.tsx
+import * as React5 from "react";
+import { Check as Check3, Copy, Heart, Link, Play, Share2, X } from "lucide-react";
+import { jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
+function LiquidGlassSheet({ title = "Autumn forest", subtitle = "Liquid glass sheet", backgroundImage, link = "https://mova-ui.com", defaultOpen = true, onOpenChange, onSaveChange, onPlay, onShare, theme = "light", className = "", style } = {}) {
+  const [open, setOpen] = React5.useState(defaultOpen);
+  const [saved, setSaved] = React5.useState(false);
+  const [status, setStatus] = React5.useState("");
+  const [drag, setDrag] = React5.useState(0);
+  const start = React5.useRef(null);
+  const trigger = React5.useRef(null);
+  const panel = React5.useRef(null);
+  const titleId = React5.useId();
+  const wasOpened = React5.useRef(false);
+  function changeOpen(value) {
+    setOpen(value);
+    setDrag(0);
+    onOpenChange?.(value);
+    if (!value) trigger.current?.focus();
+  }
+  React5.useEffect(() => {
+    if (open && wasOpened.current) panel.current?.querySelector("button")?.focus();
+    wasOpened.current = true;
+  }, [open]);
+  async function copy() {
+    try {
+      await navigator.clipboard.writeText(link);
+      setStatus("Link copied");
+    } catch {
+      setStatus("Copy unavailable. Select the link below.");
+    }
+  }
+  function keys(event) {
+    if (event.key === "Escape") {
+      event.preventDefault();
+      changeOpen(false);
+    }
+    if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+      const buttons = Array.from(panel.current?.querySelectorAll("button") ?? []);
+      const at = buttons.indexOf(document.activeElement);
+      event.preventDefault();
+      buttons[(at + (event.key === "ArrowDown" ? 1 : -1) + buttons.length) % buttons.length]?.focus();
+    }
+  }
+  return /* @__PURE__ */ jsxs17("section", { className: `mova-glass-sheet ${className}`, "data-theme": theme, style: { ...style, ...backgroundImage ? { backgroundImage: `url(${JSON.stringify(backgroundImage)})` } : {} }, "aria-label": title, children: [
+    /* @__PURE__ */ jsx17("style", { children: css5 }),
+    /* @__PURE__ */ jsxs17("div", { className: "mgs-forest", "aria-hidden": "true", children: [
+      /* @__PURE__ */ jsx17("i", {}),
+      /* @__PURE__ */ jsx17("i", {}),
+      /* @__PURE__ */ jsx17("i", {}),
+      /* @__PURE__ */ jsx17("i", {}),
+      /* @__PURE__ */ jsx17("i", {}),
+      /* @__PURE__ */ jsx17("i", {})
+    ] }),
+    /* @__PURE__ */ jsx17("button", { type: "button", className: "mgs-trigger", ref: trigger, "aria-expanded": open, "aria-controls": `${titleId}-sheet`, onClick: () => changeOpen(!open), children: open ? "Close sheet" : "Open sheet" }),
+    open && /* @__PURE__ */ jsxs17("section", { className: "mgs-panel", ref: panel, id: `${titleId}-sheet`, "aria-labelledby": titleId, onKeyDown: keys, style: { transform: `translateY(${drag}px)` }, children: [
+      /* @__PURE__ */ jsx17("div", { className: "mgs-grab", onPointerDown: (event) => {
+        start.current = event.clientY;
+        event.currentTarget.setPointerCapture(event.pointerId);
+      }, onPointerMove: (event) => {
+        if (start.current !== null) setDrag(Math.max(0, event.clientY - start.current));
+      }, onPointerUp: () => {
+        start.current = null;
+        if (drag > 60) changeOpen(false);
+        else setDrag(0);
+      }, onPointerCancel: () => {
+        start.current = null;
+        setDrag(0);
+      }, "aria-hidden": "true", children: /* @__PURE__ */ jsx17("span", {}) }),
+      /* @__PURE__ */ jsxs17("header", { children: [
+        /* @__PURE__ */ jsxs17("div", { children: [
+          /* @__PURE__ */ jsx17("h2", { id: titleId, children: title }),
+          /* @__PURE__ */ jsx17("p", { children: subtitle })
+        ] }),
+        /* @__PURE__ */ jsx17("button", { type: "button", className: "mgs-close", "aria-label": "Close sheet", onClick: () => changeOpen(false), children: /* @__PURE__ */ jsx17(X, { size: 15 }) })
+      ] }),
+      /* @__PURE__ */ jsxs17("button", { type: "button", className: "mgs-row", onClick: () => {
+        onPlay?.();
+        setStatus("Preview selected");
+      }, children: [
+        /* @__PURE__ */ jsx17(Play, { size: 16 }),
+        /* @__PURE__ */ jsx17("span", { children: "Play preview" })
+      ] }),
+      /* @__PURE__ */ jsxs17("button", { type: "button", className: "mgs-row", onClick: () => {
+        onShare?.();
+        if (!onShare) void copy();
+        else setStatus("Share selected");
+      }, children: [
+        /* @__PURE__ */ jsx17(Share2, { size: 16 }),
+        /* @__PURE__ */ jsx17("span", { children: "Share" })
+      ] }),
+      /* @__PURE__ */ jsxs17("button", { type: "button", className: "mgs-row", "aria-pressed": saved, onClick: () => {
+        setSaved(!saved);
+        onSaveChange?.(!saved);
+      }, children: [
+        saved ? /* @__PURE__ */ jsx17(Check3, { size: 16 }) : /* @__PURE__ */ jsx17(Heart, { size: 16 }),
+        /* @__PURE__ */ jsx17("span", { children: saved ? "Saved to favorites" : "Save to favorites" })
+      ] }),
+      /* @__PURE__ */ jsxs17("button", { type: "button", className: "mgs-row", onClick: () => void copy(), children: [
+        /* @__PURE__ */ jsx17(Link, { size: 16 }),
+        /* @__PURE__ */ jsx17("span", { children: status === "Link copied" ? status : "Copy link" }),
+        /* @__PURE__ */ jsx17(Copy, { size: 14 })
+      ] }),
+      status && /* @__PURE__ */ jsxs17("p", { className: "mgs-status", role: "status", children: [
+        status,
+        status.startsWith("Copy unavailable") && /* @__PURE__ */ jsx17("input", { "aria-label": "Link to copy", readOnly: true, value: link, onFocus: (event) => event.currentTarget.select() })
+      ] })
+    ] })
+  ] });
+}
+var css5 = `
+.mova-glass-sheet{box-sizing:border-box;position:relative;width:320px;max-width:100%;height:380px;isolation:isolate;border-radius:24px;overflow:hidden;background:radial-gradient(ellipse at 68% 10%,#d6b85a44,transparent 50%),linear-gradient(160deg,#687349,#293e26 45%,#8a5c2f);background-size:cover;background-position:center;color:white;font:400 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;box-shadow:0 8px 32px #00000018}.mova-glass-sheet *{box-sizing:border-box}.mgs-forest{position:absolute;inset:0;z-index:-1;overflow:hidden;opacity:.75;background:radial-gradient(ellipse at 65% 12%,#f4d57388,transparent 40%),radial-gradient(ellipse at 20% 70%,#8d633199,transparent 40%)}.mgs-forest i{position:absolute;top:-10%;bottom:-10%;width:12px;background:linear-gradient(90deg,#16251c,#35402c,#1b291f);transform:rotate(-8deg);left:10%;box-shadow:25px 0 60px #13261f55}.mgs-forest i:nth-child(2){left:29%;width:20px;transform:rotate(8deg)}.mgs-forest i:nth-child(3){left:48%;width:8px}.mgs-forest i:nth-child(4){left:68%;width:24px;transform:rotate(5deg)}.mgs-forest i:nth-child(5){left:91%;width:18px}.mgs-forest i:nth-child(6){left:80%;width:5px;opacity:.7}.mova-glass-sheet button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}.mova-glass-sheet button:focus-visible{outline:2px solid #fff;outline-offset:-3px}.mgs-trigger{position:absolute;top:24px;left:50%;transform:translateX(-50%);border:1px solid #ffffff60!important;background:#ffffff20!important;backdrop-filter:blur(10px);padding:10px 20px;border-radius:22px;white-space:nowrap;box-shadow:inset 0 1px #ffffff60,0 3px 10px #0002}.mgs-panel{position:absolute;left:8px;right:8px;bottom:8px;max-height:calc(100% - 82px);overflow:auto;border:1px solid #ffffff50;border-radius:28px;padding:0 8px 8px;background:#43513966;backdrop-filter:blur(14px) saturate(1.5);box-shadow:inset 0 1px 1px #ffffffa0,inset 0 -1px 1px #ffffff40,0 20px 44px #0004;animation:mgs-enter 300ms cubic-bezier(.2,.8,.2,1);transition:transform 180ms ease-out}.mgs-grab{height:24px;display:grid;place-items:center;touch-action:none;cursor:grab}.mgs-grab span{width:36px;height:5px;border-radius:5px;background:#ffffffb0}.mgs-panel header{display:flex;align-items:center;padding:0 12px 8px;gap:8px}.mgs-panel header>div{flex:1;min-width:0}.mgs-panel h2{margin:0;font-size:16px;line-height:22px;font-weight:500;overflow-wrap:anywhere}.mgs-panel header p{margin:0;opacity:.85;font-size:12px}.mgs-close{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;flex:none}.mgs-row{display:flex;align-items:center;text-align:left;gap:10px;width:100%;min-height:42px;border-radius:15px;padding:10px!important;transition:background 160ms}.mgs-row span{flex:1;min-width:0;overflow-wrap:anywhere}.mgs-row svg{flex:none}.mgs-row:hover,.mgs-row:focus-visible,.mgs-close:hover{background:#ffffff26}.mgs-status{font-size:11px;margin:4px 12px;line-height:16px}.mgs-status input{width:100%;background:#0004;color:#fff;border:1px solid #fff8;border-radius:4px;padding:4px;font:inherit}@keyframes mgs-enter{from{opacity:0;translate:0 32px}to{opacity:1;translate:0 0}}@media(prefers-reduced-motion:reduce){.mova-glass-sheet *{animation:none!important;transition:none!important}}@media(prefers-reduced-transparency:reduce){.mgs-panel{background:#3c4a35;backdrop-filter:none}}
+`;
+
+// .generated/ui/cards/voice-assistant-card.tsx
+import * as React6 from "react";
+import { ArrowUp as ArrowUp2, ImagePlus, Menu, Plus as Plus3, X as X2 } from "lucide-react";
+import { Fragment as Fragment7, jsx as jsx18, jsxs as jsxs18 } from "react/jsx-runtime";
+var recentChats = [{ id: "cafe", title: "Quiet caf\xE9 nearby", preview: "A little room to think", time: "Now" }, { id: "trip", title: "A weekend away", preview: "Plan a slow Sunday", time: "Yesterday" }, { id: "ideas", title: "Ideas for the studio", preview: "A fresh perspective", time: "Monday" }];
+function VoiceAssistantCard({ name = "Aria", chats = recentChats, simulatedTranscript = "Find me a quiet caf\xE9 nearby with good wifi for this afternoon", onSend, onChatChange, theme = "light", className = "", style } = {}) {
+  const [list, setList] = React6.useState(false);
+  const [chatId, setChatId] = React6.useState(chats[0]?.id);
+  const [draft, setDraft] = React6.useState("");
+  const [transcript, setTranscript] = React6.useState("");
+  const [phase, setPhase] = React6.useState("idle");
+  const [attachment, setAttachment] = React6.useState();
+  const [imageUrl, setImageUrl] = React6.useState("");
+  const fileInput = React6.useRef(null);
+  const input = React6.useRef(null);
+  const generation = React6.useRef(0);
+  const sending = React6.useRef(false);
+  const menu = React6.useRef(null);
+  const listRef = React6.useRef(null);
+  const pendingFocus = React6.useRef(false);
+  const currentChat = chats.find((chat) => chat.id === chatId);
+  React6.useEffect(() => {
+    if (!attachment) {
+      setImageUrl("");
+      return;
+    }
+    const url = URL.createObjectURL(attachment);
+    setImageUrl(url);
+    return () => URL.revokeObjectURL(url);
+  }, [attachment]);
+  React6.useEffect(() => () => {
+    generation.current++;
+  }, []);
+  React6.useEffect(() => {
+    if (phase !== "listening") return;
+    let index = 0;
+    const words = simulatedTranscript.split(/\s+/).filter(Boolean);
+    const timer = window.setInterval(() => {
+      index++;
+      setTranscript(words.slice(0, index).join(" "));
+      if (index >= words.length) {
+        window.clearInterval(timer);
+        setDraft(simulatedTranscript);
+        setPhase("idle");
+      }
+    }, 160);
+    return () => window.clearInterval(timer);
+  }, [phase, simulatedTranscript]);
+  React6.useEffect(() => {
+    if (list) listRef.current?.querySelector("button")?.focus();
+    else if (pendingFocus.current) {
+      input.current?.focus();
+      pendingFocus.current = false;
+    }
+  }, [list]);
+  async function send(event) {
+    event?.preventDefault();
+    if (!draft.trim() && !attachment || sending.current) return;
+    const text = draft.trim();
+    const run = ++generation.current;
+    sending.current = true;
+    setTranscript(text);
+    setPhase("sending");
+    try {
+      await onSend?.(text, attachment);
+      if (generation.current === run) {
+        setDraft("");
+        setPhase("sent");
+      }
+    } catch {
+      if (generation.current === run) setPhase("error");
+    } finally {
+      sending.current = false;
+    }
+  }
+  function reset() {
+    pendingFocus.current = true;
+    setChatId(void 0);
+    generation.current++;
+    setDraft("");
+    setTranscript("");
+    setAttachment(void 0);
+    setPhase("idle");
+    setList(false);
+  }
+  const caption = { idle: "Type, or try the voice preview", listening: "Voice preview \xB7 listening\u2026", sending: "Sending\u2026", sent: onSend ? "Message sent" : "Message preview ready", error: "Could not send. Please try again." }[phase];
+  return /* @__PURE__ */ jsxs18("section", { className: `mova-voice ${className}`, "data-theme": theme, "data-listening": phase === "listening", style, "aria-label": `${name} voice assistant`, children: [
+    /* @__PURE__ */ jsx18("style", { children: css6 }),
+    /* @__PURE__ */ jsxs18("header", { children: [
+      /* @__PURE__ */ jsx18("button", { ref: menu, type: "button", "aria-label": list ? "Close conversations" : "Open conversations", "aria-expanded": list, disabled: phase === "sending", onClick: () => {
+        setList(!list);
+        if (phase === "listening") setPhase("idle");
+      }, children: list ? /* @__PURE__ */ jsx18(X2, { size: 17 }) : /* @__PURE__ */ jsx18(Menu, { size: 17 }) }),
+      /* @__PURE__ */ jsxs18("div", { children: [
+        /* @__PURE__ */ jsx18("strong", { children: name }),
+        /* @__PURE__ */ jsx18("small", { children: list ? "Your conversations" : currentChat?.title ?? "New conversation" })
+      ] })
+    ] }),
+    list ? /* @__PURE__ */ jsxs18("div", { className: "mvc-list", ref: listRef, onKeyDown: (event) => {
+      if (event.key === "Escape") {
+        setList(false);
+        menu.current?.focus();
+      }
+    }, children: [
+      /* @__PURE__ */ jsxs18("button", { type: "button", className: "mvc-new", onClick: reset, children: [
+        /* @__PURE__ */ jsx18(Plus3, { size: 16 }),
+        "New conversation"
+      ] }),
+      chats.map((chat) => /* @__PURE__ */ jsxs18("button", { type: "button", className: "mvc-chat", onClick: () => {
+        reset();
+        setChatId(chat.id);
+        onChatChange?.(chat);
+      }, children: [
+        /* @__PURE__ */ jsxs18("span", { children: [
+          /* @__PURE__ */ jsx18("strong", { children: chat.title }),
+          /* @__PURE__ */ jsx18("small", { children: chat.preview })
+        ] }),
+        /* @__PURE__ */ jsx18("small", { children: chat.time })
+      ] }, chat.id))
+    ] }) : /* @__PURE__ */ jsxs18(Fragment7, { children: [
+      /* @__PURE__ */ jsxs18("div", { className: "mvc-body", children: [
+        /* @__PURE__ */ jsx18("p", { className: "mvc-greeting", children: "How can I help you today?" }),
+        /* @__PURE__ */ jsxs18("div", { className: "mvc-transcript", role: "status", "aria-live": phase === "listening" ? "off" : "polite", children: [
+          imageUrl && /* @__PURE__ */ jsx18("img", { src: imageUrl, alt: "Attached image preview" }),
+          transcript && /* @__PURE__ */ jsx18("p", { children: transcript })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs18("footer", { children: [
+        /* @__PURE__ */ jsx18("div", { className: "mvc-caption", role: "status", children: caption }),
+        /* @__PURE__ */ jsxs18("form", { onSubmit: (event) => void send(event), children: [
+          /* @__PURE__ */ jsx18("button", { type: "button", "aria-label": attachment ? "Remove image" : "Attach image", disabled: phase === "sending", onClick: () => attachment ? setAttachment(void 0) : fileInput.current?.click(), children: attachment ? /* @__PURE__ */ jsx18(X2, { size: 16 }) : /* @__PURE__ */ jsx18(ImagePlus, { size: 16 }) }),
+          /* @__PURE__ */ jsx18("input", { ref: fileInput, hidden: true, type: "file", accept: "image/*", onChange: (event) => {
+            const file = event.target.files?.[0];
+            if (file?.type.startsWith("image/") && file.size <= 10 * 1024 * 1024) setAttachment(file);
+            event.target.value = "";
+          } }),
+          /* @__PURE__ */ jsx18("input", { ref: input, type: "text", "aria-label": `Message ${name}`, placeholder: `Ask ${name} anything`, value: draft, disabled: phase === "listening" || phase === "sending", maxLength: 2e3, onChange: (event) => setDraft(event.target.value) }),
+          draft.trim() || attachment ? /* @__PURE__ */ jsx18("button", { type: "submit", className: "mvc-action", "aria-label": "Send message", disabled: phase === "sending", children: /* @__PURE__ */ jsx18(ArrowUp2, { size: 17 }) }) : /* @__PURE__ */ jsx18("button", { type: "button", className: "mvc-action", "aria-label": phase === "listening" ? "Stop voice preview" : "Start voice preview", "aria-pressed": phase === "listening", onClick: () => {
+            if (phase === "listening") {
+              setDraft(transcript);
+              setPhase("idle");
+            } else {
+              setTranscript("");
+              setPhase("listening");
+            }
+          }, children: /* @__PURE__ */ jsx18("span", { className: "mvc-wave", "aria-hidden": "true", children: [8, 13, 19, 11, 6].map((height, index) => /* @__PURE__ */ jsx18("i", { style: { height, animationDelay: `${index * 90}ms` } }, index)) }) })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+var css6 = `
+.mova-voice{--mvc-bg:#fff;--mvc-fg:#252525;--mvc-muted:#777;--mvc-chip:#f0f0f0;position:relative;box-sizing:border-box;width:360px;max-width:100%;height:340px;border-radius:24px;border:1px solid #8888881a;background:var(--mvc-bg);color:var(--mvc-fg);font:400 13px/20px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;display:flex;flex-direction:column;box-shadow:0 8px 32px -4px #0000000c;isolation:isolate}.mova-voice[data-theme=dark]{--mvc-bg:#1d1d1d;--mvc-fg:#f2f2f2;--mvc-muted:#999;--mvc-chip:#303030;color-scheme:dark}.mova-voice:after{content:"";position:absolute;z-index:-1;bottom:-1px;left:18%;right:18%;height:2px;background:linear-gradient(90deg,transparent,#b9dbbc,#b294ce,#efaf84,transparent);filter:blur(5px);opacity:.7;transition:opacity 250ms,filter 250ms}.mova-voice[data-listening=true]:after{opacity:1;filter:blur(7px);height:6px}.mova-voice *{box-sizing:border-box}.mova-voice button,.mova-voice input{font:inherit;color:inherit}.mova-voice button{border:0;background:none;cursor:pointer}.mova-voice button:disabled{opacity:.5;cursor:default}.mova-voice :focus-visible{outline:2px solid #7898e8;outline-offset:2px}.mova-voice header{padding:12px;display:flex;gap:8px;align-items:center;border-bottom:1px solid #88888818;flex:none}.mova-voice header>button{width:30px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none}.mova-voice header>div{min-width:0}.mova-voice header strong{display:block;font-size:16px;line-height:22px;font-weight:500}.mova-voice header small{display:block;font-size:12px;line-height:16px;color:var(--mvc-muted);overflow-wrap:anywhere}.mvc-body{flex:1;min-height:0;overflow:auto;padding:20px 24px}.mvc-greeting{margin:0;padding:8px 12px;background:var(--mvc-chip);border-radius:18px 18px 18px 4px;display:inline-block}.mvc-transcript{margin-top:16px}.mvc-transcript p{margin:0;overflow-wrap:anywhere;animation:mvc-in 200ms ease-out}.mvc-transcript img{width:40px;height:40px;object-fit:cover;border-radius:8px;margin-bottom:8px}.mova-voice footer{padding:0 12px 12px}.mvc-caption{text-align:center;min-height:20px;font-size:11px;color:var(--mvc-muted);margin-bottom:6px}.mova-voice form{display:flex;align-items:center;gap:6px;padding:4px;border:1px solid #88888830;border-radius:24px}.mova-voice form>button{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center}.mova-voice button:hover{background:var(--mvc-chip)}.mova-voice form>input[type=text]{min-width:0;width:100%;border:0;background:none;outline:none;padding:4px 2px;font-size:12px}.mova-voice form:focus-within{outline:2px solid #7898e8;outline-offset:2px}.mova-voice .mvc-action{background:var(--mvc-chip)}.mvc-wave{height:20px;display:flex;align-items:center;gap:2px}.mvc-wave i{display:block;width:2px;background:currentColor;border-radius:2px}.mova-voice[data-listening=true] .mvc-wave i{animation:mvc-wave 700ms ease-in-out infinite alternate}.mvc-list{padding:12px;overflow:auto;flex:1}.mvc-new{display:flex;gap:8px;align-items:center;width:100%;padding:10px;border-radius:10px}.mvc-chat{display:flex;align-items:center;gap:8px;text-align:left;width:100%;padding:12px 10px;border-radius:12px}.mvc-chat>span{flex:1;min-width:0}.mvc-chat strong{display:block;font-size:13px;font-weight:500;overflow-wrap:anywhere}.mvc-chat small{display:block;color:var(--mvc-muted);font-size:11px}.mvc-chat>small{flex:none;font-size:10px}@keyframes mvc-wave{to{transform:scaleY(.35)}}@keyframes mvc-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.mova-voice *,.mova-voice:after{animation:none!important;transition:none!important}}
+`;
+
 // .generated/ui/cursor/cursor-trail.tsx
-import { useEffect as useEffect10, useState as useState14 } from "react";
+import { useEffect as useEffect14, useState as useState20 } from "react";
 import { motion as motion7, useSpring } from "framer-motion";
-import { Fragment as Fragment7, jsx as jsx13 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx19 } from "react/jsx-runtime";
 function CursorTrail({
   color = "bg-blue-500",
   size = 8,
   count = 6
 }) {
-  const [coords, setCoords] = useState14({ x: 0, y: 0 });
-  const [isVisible, setIsVisible] = useState14(false);
-  useEffect10(() => {
+  const [coords, setCoords] = useState20({ x: 0, y: 0 });
+  const [isVisible, setIsVisible] = useState20(false);
+  useEffect14(() => {
     const handleMouseMove = (e) => {
       setCoords({ x: e.clientX, y: e.clientY });
       if (!isVisible) setIsVisible(true);
@@ -4198,13 +4779,13 @@ function CursorTrail({
       document.removeEventListener("mouseleave", handleMouseLeave);
     };
   }, [isVisible]);
-  return /* @__PURE__ */ jsx13(Fragment7, { children: isVisible && Array.from({ length: count }).map((_, index) => {
+  return /* @__PURE__ */ jsx19(Fragment8, { children: isVisible && Array.from({ length: count }).map((_, index) => {
     const springConfig = {
       stiffness: 300 - index * 30,
       damping: 25 + index * 2,
       mass: 0.2 + index * 0.1
     };
-    return /* @__PURE__ */ jsx13(
+    return /* @__PURE__ */ jsx19(
       TrailDot,
       {
         index,
@@ -4228,13 +4809,13 @@ function TrailDot({
 }) {
   const x = useSpring(coords.x, springConfig);
   const y = useSpring(coords.y, springConfig);
-  useEffect10(() => {
+  useEffect14(() => {
     x.set(coords.x);
     y.set(coords.y);
   }, [coords, x, y]);
   const dotSize = size * (1 - index / count);
   const opacity = 1 - index / count;
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx19(
     motion7.div,
     {
       style: {
@@ -4252,19 +4833,19 @@ function TrailDot({
 }
 
 // .generated/ui/cursor/mouse-follow.tsx
-import { useEffect as useEffect11, useState as useState15 } from "react";
+import { useEffect as useEffect15, useState as useState21 } from "react";
 import { motion as motion8, useSpring as useSpring2 } from "framer-motion";
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 function MouseFollow({
   children,
   stiffness = 180,
   damping = 20,
   className = ""
 }) {
-  const [isVisible, setIsVisible] = useState15(false);
+  const [isVisible, setIsVisible] = useState21(false);
   const x = useSpring2(0, { stiffness, damping });
   const y = useSpring2(0, { stiffness, damping });
-  useEffect11(() => {
+  useEffect15(() => {
     const handleMouseMove = (e) => {
       x.set(e.clientX);
       y.set(e.clientY);
@@ -4281,7 +4862,7 @@ function MouseFollow({
     };
   }, [x, y, isVisible]);
   if (!isVisible) return null;
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx20(
     motion8.div,
     {
       style: {
@@ -4291,24 +4872,24 @@ function MouseFollow({
         translateY: "-50%"
       },
       className: `fixed top-0 left-0 pointer-events-none z-[9998] ${className}`,
-      children: children || /* @__PURE__ */ jsx14("div", { className: "w-6 h-6 rounded-full border border-blue-500/50 bg-blue-500/10" })
+      children: children || /* @__PURE__ */ jsx20("div", { className: "w-6 h-6 rounded-full border border-blue-500/50 bg-blue-500/10" })
     }
   );
 }
 
 // .generated/ui/cursor/spotlight.tsx
-import { useRef as useRef7, useState as useState16 } from "react";
+import { useRef as useRef11, useState as useState22 } from "react";
 import { motion as motion9 } from "framer-motion";
-import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
 function Spotlight({
   children,
   className = "",
   glowColor = "rgba(255, 255, 255, 0.08)",
   glowSize = 250
 }) {
-  const containerRef = useRef7(null);
-  const [coords, setCoords] = useState16({ x: 0, y: 0 });
-  const [opacity, setOpacity] = useState16(0);
+  const containerRef = useRef11(null);
+  const [coords, setCoords] = useState22({ x: 0, y: 0 });
+  const [opacity, setOpacity] = useState22(0);
   const handleMouseMove = (e) => {
     if (!containerRef.current) return;
     const rect = containerRef.current.getBoundingClientRect();
@@ -4317,7 +4898,7 @@ function Spotlight({
       y: e.clientY - rect.top
     });
   };
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs19(
     "div",
     {
       ref: containerRef,
@@ -4326,7 +4907,7 @@ function Spotlight({
       onMouseLeave: () => setOpacity(0),
       className: `relative overflow-hidden bg-neutral-950 border border-neutral-900 rounded-2xl p-6 ${className}`,
       children: [
-        /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx21(
           motion9.div,
           {
             className: "pointer-events-none absolute -inset-px opacity-0 transition-opacity duration-300",
@@ -4336,7 +4917,7 @@ function Spotlight({
             }
           }
         ),
-        /* @__PURE__ */ jsx15("div", { className: "relative z-10", children })
+        /* @__PURE__ */ jsx21("div", { className: "relative z-10", children })
       ]
     }
   );
@@ -4344,7 +4925,7 @@ function Spotlight({
 
 // .generated/ui/entrance/fade-down.tsx
 import { motion as motion10 } from "framer-motion";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function FadeDown({
   children,
   duration = 0.6,
@@ -4352,7 +4933,7 @@ function FadeDown({
   yOffset = -20,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx22(
     motion10.div,
     {
       initial: { opacity: 0, y: yOffset },
@@ -4371,14 +4952,14 @@ function FadeDown({
 
 // .generated/ui/entrance/fade-in.tsx
 import { motion as motion11 } from "framer-motion";
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 function FadeIn({
   children,
   duration = 0.5,
   delay = 0,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx23(
     motion11.div,
     {
       initial: { opacity: 0 },
@@ -4397,7 +4978,7 @@ function FadeIn({
 
 // .generated/ui/entrance/fade-up.tsx
 import { motion as motion12 } from "framer-motion";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 function FadeUp({
   children,
   duration = 0.6,
@@ -4405,7 +4986,7 @@ function FadeUp({
   yOffset = 20,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx24(
     motion12.div,
     {
       initial: { opacity: 0, y: yOffset },
@@ -4424,7 +5005,7 @@ function FadeUp({
 
 // .generated/ui/entrance/scale-in.tsx
 import { motion as motion13 } from "framer-motion";
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx25 } from "react/jsx-runtime";
 function ScaleIn({
   children,
   duration = 0.5,
@@ -4432,7 +5013,7 @@ function ScaleIn({
   initialScale = 0.92,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx25(
     motion13.div,
     {
       initial: { opacity: 0, scale: initialScale },
@@ -4451,7 +5032,7 @@ function ScaleIn({
 
 // .generated/ui/entrance/slide-left.tsx
 import { motion as motion14 } from "framer-motion";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx26 } from "react/jsx-runtime";
 function SlideLeft({
   children,
   duration = 0.6,
@@ -4459,7 +5040,7 @@ function SlideLeft({
   xOffset = 40,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx26(
     motion14.div,
     {
       initial: { opacity: 0, x: xOffset },
@@ -4478,7 +5059,7 @@ function SlideLeft({
 
 // .generated/ui/entrance/slide-right.tsx
 import { motion as motion15 } from "framer-motion";
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx27 } from "react/jsx-runtime";
 function SlideRight({
   children,
   duration = 0.6,
@@ -4486,7 +5067,7 @@ function SlideRight({
   xOffset = -40,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx27(
     motion15.div,
     {
       initial: { opacity: 0, x: xOffset },
@@ -4505,7 +5086,7 @@ function SlideRight({
 
 // .generated/ui/entrance/zoom-in.tsx
 import { motion as motion16 } from "framer-motion";
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { jsx as jsx28 } from "react/jsx-runtime";
 function ZoomIn({
   children,
   duration = 0.7,
@@ -4514,7 +5095,7 @@ function ZoomIn({
   initialBlur = "12px",
   className = ""
 }) {
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx28(
     motion16.div,
     {
       initial: { opacity: 0, scale: initialScale, filter: `blur(${initialBlur})` },
@@ -4532,16 +5113,16 @@ function ZoomIn({
 }
 
 // .generated/ui/hover/card-hover.tsx
-import { useState as useState17 } from "react";
+import { useState as useState23 } from "react";
 import { motion as motion17, AnimatePresence as AnimatePresence6 } from "framer-motion";
-import { jsx as jsx23, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs20 } from "react/jsx-runtime";
 function CardHover({
   items: items2,
   className = "",
   cardClassName = ""
 }) {
-  const [hoveredIndex, setHoveredIndex] = useState17(null);
-  return /* @__PURE__ */ jsx23("div", { className: `grid grid-cols-1 md:grid-cols-3 gap-4 w-full ${className}`, children: items2.map((item, idx) => /* @__PURE__ */ jsxs14(
+  const [hoveredIndex, setHoveredIndex] = useState23(null);
+  return /* @__PURE__ */ jsx29("div", { className: `grid grid-cols-1 md:grid-cols-3 gap-4 w-full ${className}`, children: items2.map((item, idx) => /* @__PURE__ */ jsxs20(
     "a",
     {
       href: item.link || "#",
@@ -4549,7 +5130,7 @@ function CardHover({
       onMouseEnter: () => setHoveredIndex(idx),
       onMouseLeave: () => setHoveredIndex(null),
       children: [
-        /* @__PURE__ */ jsx23(AnimatePresence6, { children: hoveredIndex === idx && /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsx29(AnimatePresence6, { children: hoveredIndex === idx && /* @__PURE__ */ jsx29(
           motion17.span,
           {
             className: "absolute inset-0 h-full w-full bg-neutral-200 dark:bg-zinc-800/[0.8] block rounded-3xl -z-10",
@@ -4565,13 +5146,13 @@ function CardHover({
             }
           }
         ) }),
-        /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsx29(
           "div",
           {
             className: `rounded-2xl h-full w-full p-5 overflow-hidden bg-white dark:bg-black border border-neutral-200 dark:border-zinc-800 group-hover:border-slate-350 dark:group-hover:border-zinc-700 relative z-20 transition-colors duration-200 ${cardClassName}`,
-            children: /* @__PURE__ */ jsxs14("div", { className: "relative z-50", children: [
-              /* @__PURE__ */ jsx23("h4", { className: "text-zinc-900 dark:text-zinc-100 font-bold tracking-wide mt-2", children: item.title }),
-              /* @__PURE__ */ jsx23("p", { className: "mt-2 text-zinc-500 dark:text-zinc-400 tracking-wide leading-relaxed text-sm", children: item.description })
+            children: /* @__PURE__ */ jsxs20("div", { className: "relative z-50", children: [
+              /* @__PURE__ */ jsx29("h4", { className: "text-zinc-900 dark:text-zinc-100 font-bold tracking-wide mt-2", children: item.title }),
+              /* @__PURE__ */ jsx29("p", { className: "mt-2 text-zinc-500 dark:text-zinc-400 tracking-wide leading-relaxed text-sm", children: item.description })
             ] })
           }
         )
@@ -4582,9 +5163,9 @@ function CardHover({
 }
 
 // .generated/ui/hover/glow-button.tsx
-import { useRef as useRef8, useState as useState18 } from "react";
+import { useRef as useRef12, useState as useState24 } from "react";
 import { motion as motion18 } from "framer-motion";
-import { jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs21 } from "react/jsx-runtime";
 function GlowButton({
   children,
   className = "",
@@ -4592,9 +5173,9 @@ function GlowButton({
   // Light blue default
   onClick
 }) {
-  const containerRef = useRef8(null);
-  const [coords, setCoords] = useState18({ x: 0, y: 0 });
-  const [opacity, setOpacity] = useState18(0);
+  const containerRef = useRef12(null);
+  const [coords, setCoords] = useState24({ x: 0, y: 0 });
+  const [opacity, setOpacity] = useState24(0);
   const handleMouseMove = (e) => {
     if (!containerRef.current) return;
     const rect = containerRef.current.getBoundingClientRect();
@@ -4603,7 +5184,7 @@ function GlowButton({
       y: e.clientY - rect.top
     });
   };
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs21(
     "button",
     {
       ref: containerRef,
@@ -4613,7 +5194,7 @@ function GlowButton({
       onClick,
       className: `relative overflow-hidden inline-flex items-center justify-center rounded-xl bg-neutral-900 border border-neutral-800 text-white font-medium text-sm h-11 px-6 shadow-md transition-colors hover:border-neutral-700 cursor-pointer ${className}`,
       children: [
-        /* @__PURE__ */ jsx24(
+        /* @__PURE__ */ jsx30(
           motion18.div,
           {
             className: "pointer-events-none absolute -inset-px rounded-xl opacity-0 transition-opacity duration-300",
@@ -4623,14 +5204,14 @@ function GlowButton({
             }
           }
         ),
-        /* @__PURE__ */ jsx24("span", { className: "relative z-10", children })
+        /* @__PURE__ */ jsx30("span", { className: "relative z-10", children })
       ]
     }
   );
 }
 
 // .generated/ui/hover/inset-button.tsx
-import { Fragment as Fragment8, jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx31, jsxs as jsxs22 } from "react/jsx-runtime";
 var insetButtonStyles = `
 .mova-inset-button {
   --surface-elevated: oklch(0.996 0.001 95);
@@ -4703,9 +5284,9 @@ var insetButtonStyles = `
 }
 `;
 function InsetButton({ variant = "text", theme = "dark", children, className = "", type = "button", ...props }) {
-  return /* @__PURE__ */ jsxs16(Fragment8, { children: [
-    /* @__PURE__ */ jsx25("style", { children: insetButtonStyles }),
-    /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsxs22(Fragment9, { children: [
+    /* @__PURE__ */ jsx31("style", { children: insetButtonStyles }),
+    /* @__PURE__ */ jsx31(
       "button",
       {
         type,
@@ -4714,16 +5295,16 @@ function InsetButton({ variant = "text", theme = "dark", children, className = "
         "data-theme": theme,
         "data-variant": variant,
         className: `mova-inset-button ${className}`,
-        children: variant === "create" ? /* @__PURE__ */ jsx25("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx25("path", { d: "M12 5v14M5 12h14" }) }) : children
+        children: variant === "create" ? /* @__PURE__ */ jsx31("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx31("path", { d: "M12 5v14M5 12h14" }) }) : children
       }
     )
   ] });
 }
 
 // .generated/ui/hover/magnetic-button.tsx
-import { useRef as useRef9, useState as useState19 } from "react";
+import { useRef as useRef13, useState as useState25 } from "react";
 import { motion as motion19, useSpring as useSpring3 } from "framer-motion";
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx32 } from "react/jsx-runtime";
 function MagneticButton({
   children,
   range = 45,
@@ -4731,8 +5312,8 @@ function MagneticButton({
   className = "",
   onClick
 }) {
-  const ref = useRef9(null);
-  const [position, setPosition] = useState19({ x: 0, y: 0 });
+  const ref = useRef13(null);
+  const [position, setPosition] = useState25({ x: 0, y: 0 });
   const springConfig = { stiffness: 150, damping: 15, mass: 0.6 };
   const x = useSpring3(0, springConfig);
   const y = useSpring3(0, springConfig);
@@ -4757,7 +5338,7 @@ function MagneticButton({
     x.set(0);
     y.set(0);
   };
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx32(
     motion19.button,
     {
       ref,
@@ -4766,23 +5347,23 @@ function MagneticButton({
       onClick,
       style: { x, y },
       className: `relative inline-flex items-center justify-center rounded-full bg-neutral-900 dark:bg-white text-white dark:text-black font-semibold text-sm h-11 px-6 shadow hover:scale-[1.03] transition-all cursor-pointer select-none border-0 ${className}`,
-      children: /* @__PURE__ */ jsx26("span", { className: "relative z-10 block pointer-events-none", children })
+      children: /* @__PURE__ */ jsx32("span", { className: "relative z-10 block pointer-events-none", children })
     }
   );
 }
 
 // .generated/ui/hover/tilt-card.tsx
-import { useRef as useRef10, useState as useState20 } from "react";
+import { useRef as useRef14, useState as useState26 } from "react";
 import { motion as motion20, useMotionValue, useSpring as useSpring4, useTransform } from "framer-motion";
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 function TiltCard({
   children,
   maxTilt = 15,
   className = "",
   cardClassName = ""
 }) {
-  const cardRef = useRef10(null);
-  const [isHovered, setIsHovered] = useState20(false);
+  const cardRef = useRef14(null);
+  const [isHovered, setIsHovered] = useState26(false);
   const x = useMotionValue(0);
   const y = useMotionValue(0);
   const springConfig = { damping: 20, stiffness: 200, mass: 0.5 };
@@ -4801,7 +5382,7 @@ function TiltCard({
     x.set(0);
     y.set(0);
   };
-  return /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx33(
     "div",
     {
       ref: cardRef,
@@ -4810,7 +5391,7 @@ function TiltCard({
       onMouseLeave: handleMouseLeave,
       className: `relative w-full aspect-[4/3] max-w-[320px] cursor-pointer ${className}`,
       style: { perspective: "800px" },
-      children: /* @__PURE__ */ jsx27(
+      children: /* @__PURE__ */ jsx33(
         motion20.div,
         {
           style: {
@@ -4819,7 +5400,7 @@ function TiltCard({
             transformStyle: "preserve-3d"
           },
           className: `w-full h-full rounded-2xl bg-gradient-to-br from-neutral-100 to-neutral-250 dark:from-neutral-850 dark:to-neutral-900 border border-neutral-200/20 shadow-lg flex items-center justify-center p-6 select-none ${cardClassName}`,
-          children: /* @__PURE__ */ jsx27("div", { style: { transform: "translateZ(40px)", transformStyle: "preserve-3d" }, className: "w-full h-full flex flex-col justify-center items-center", children })
+          children: /* @__PURE__ */ jsx33("div", { style: { transform: "translateZ(40px)", transformStyle: "preserve-3d" }, className: "w-full h-full flex flex-col justify-center items-center", children })
         }
       )
     }
@@ -4828,9 +5409,9 @@ function TiltCard({
 
 // .generated/ui/loading/accordion-loader.tsx
 import { motion as motion21 } from "framer-motion";
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 var AccordionLoader = () => {
-  return /* @__PURE__ */ jsx28("div", { className: "flex flex-col space-y-1.5 w-10 h-10 justify-center", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx34("div", { className: "flex flex-col space-y-1.5 w-10 h-10 justify-center", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx34(
     motion21.div,
     {
       className: "w-full h-1 bg-zinc-800 dark:bg-white rounded-full origin-left",
@@ -4843,7 +5424,7 @@ var AccordionLoader = () => {
 
 // .generated/ui/loading/analyzing-image.tsx
 import { motion as motion22 } from "framer-motion";
-import { jsx as jsx29, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs23 } from "react/jsx-runtime";
 var transition = {
   duration: 2.5,
   ease: [0.175, 0.885, 0.32, 1],
@@ -4856,7 +5437,7 @@ function AnalyzingImage({
   className = "",
   ...props
 }) {
-  return /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs23(
     "div",
     {
       role: "status",
@@ -4864,7 +5445,7 @@ function AnalyzingImage({
       className: `mova-analyzing-image relative isolate shrink-0 ${className}`,
       ...props,
       children: [
-        /* @__PURE__ */ jsx29(
+        /* @__PURE__ */ jsx35(
           motion22.div,
           {
             initial: { clipPath: "inset(0% 0% 0% 0%)" },
@@ -4881,7 +5462,7 @@ function AnalyzingImage({
             style: {
               background: "var(--loading-ui-analyzing-image-background, var(--mova-loader-surface, #000))"
             },
-            children: /* @__PURE__ */ jsx29(
+            children: /* @__PURE__ */ jsx35(
               "svg",
               {
                 viewBox: "0 0 24 24",
@@ -4889,7 +5470,7 @@ function AnalyzingImage({
                 xmlns: "http://www.w3.org/2000/svg",
                 className: "w-full h-full",
                 "aria-hidden": "true",
-                children: /* @__PURE__ */ jsx29(
+                children: /* @__PURE__ */ jsx35(
                   "path",
                   {
                     d: "M4.27209 20.7279L10.8686 14.1314C11.2646 13.7354 11.4627 13.5373 11.691 13.4632C11.8918 13.3979 12.1082 13.3979 12.309 13.4632C12.5373 13.5373 12.7354 13.7354 13.1314 14.1314L19.6839 20.6839M14 15L16.8686 12.1314C17.2646 11.7354 17.4627 11.5373 17.691 11.4632C17.8918 11.3979 18.1082 11.3979 18.309 11.4632C18.5373 11.5373 18.7354 11.7354 19.1314 12.1314L22 15M10 9C10 10.1046 9.10457 11 8 11C6.89543 11 6 10.1046 6 9C6 7.89543 6.89543 7 8 7C9.10457 7 10 7.89543 10 9ZM6.8 21H17.2C18.8802 21 19.7202 21 20.362 20.673C20.9265 20.3854 21.3854 19.9265 21.673 19.362C22 18.7202 22 17.8802 22 16.2V7.8C22 6.11984 22 5.27976 21.673 4.63803C21.3854 4.07354 20.9265 3.6146 20.362 3.32698C19.7202 3 18.8802 3 17.2 3H6.8C5.11984 3 4.27976 3 3.63803 3.32698C3.07354 3.6146 2.6146 4.07354 2.32698 4.63803C2 5.27976 2 6.11984 2 7.8V16.2C2 17.8802 2 18.7202 2.32698 19.362C2.6146 19.9265 3.07354 20.3854 3.63803 20.673C4.27976 21 5.11984 21 6.8 21Z",
@@ -4903,7 +5484,7 @@ function AnalyzingImage({
             )
           }
         ),
-        /* @__PURE__ */ jsx29(
+        /* @__PURE__ */ jsx35(
           motion22.div,
           {
             initial: { transform: "translateX(1400%)" },
@@ -4919,7 +5500,7 @@ function AnalyzingImage({
             className: "absolute z-10 h-full w-[7%] rounded-full bg-current"
           }
         ),
-        /* @__PURE__ */ jsxs17(
+        /* @__PURE__ */ jsxs23(
           "svg",
           {
             viewBox: "0 0 24 24",
@@ -4928,7 +5509,7 @@ function AnalyzingImage({
             className: "absolute inset-0 w-full h-full",
             "aria-hidden": "true",
             children: [
-              /* @__PURE__ */ jsx29(
+              /* @__PURE__ */ jsx35(
                 "path",
                 {
                   d: "M6.8 21H17.2C18.8802 21 19.7202 21 20.362 20.673C20.9265 20.3854 21.3854 19.9265 21.673 19.362C22 18.7202 22 17.8802 22 16.2V7.8C22 6.11984 22 5.27976 21.673 4.63803C21.3854 4.07354 20.9265 3.6146 20.362 3.32698C19.7202 3 18.8802 3 17.2 3H6.8C5.11984 3 4.27976 3 3.63803 3.32698C3.07354 3.6146 2.6146 4.07354 2.32698 4.63803C2 5.27976 2 6.11984 2 7.8V16.2C2 17.8802 2 18.7202 2.32698 19.362C2.6146 19.9265 3.07354 20.3854 3.63803 20.673C4.27976 21 5.11984 21 6.8 21Z",
@@ -4938,68 +5519,68 @@ function AnalyzingImage({
                   strokeLinejoin: "round"
                 }
               ),
-              /* @__PURE__ */ jsx29("rect", { x: "6", y: "19", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "7", y: "18", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "7", y: "19", width: "3", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "9", y: "18", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "14", y: "19", width: "3", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "15", y: "18", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "5", y: "18", width: "2", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "5", y: "17", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "10", y: "19", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "7", y: "17", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "11", y: "19", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "10", y: "18", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "17", y: "19", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "15", y: "4", width: "2", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "3", y: "9", width: "1", height: "3", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "4", y: "10", width: "1", height: "2", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "6", y: "9", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "15", y: "5", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "20", y: "8", width: "1", height: "3", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "19", y: "9", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "7", y: "13", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "9", y: "11", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "16", y: "12", width: "1", height: "2", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "13", y: "14", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "12", y: "11", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "10", y: "9", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "10", y: "15", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "10", y: "13", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "15", y: "9", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "13", y: "10", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "12", y: "14", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "5", y: "4", width: "3", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "6", y: "5", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "7", y: "14", width: "1", height: "2", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "6", y: "14", width: "3", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "16", y: "8", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "8", y: "9", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "20", y: "16", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "12", y: "12", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "8", y: "8", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "14", y: "12", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "17", y: "16", width: "2", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "14", y: "17", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "11", y: "5", width: "3", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "12", y: "4", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "12", y: "7", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "7", y: "11", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "15", y: "15", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "11", y: "11", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "13", y: "9", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "12", y: "15", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "9", y: "12", width: "2", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "19", y: "13", width: "2", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "9", y: "6", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "20", y: "4", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "19", y: "4", width: "1", height: "1", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "3", y: "15", width: "1", height: "2", fill: "currentColor" }),
-              /* @__PURE__ */ jsx29("rect", { x: "3", y: "19", width: "1", height: "1", fill: "currentColor" })
+              /* @__PURE__ */ jsx35("rect", { x: "6", y: "19", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "7", y: "18", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "7", y: "19", width: "3", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "9", y: "18", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "14", y: "19", width: "3", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "15", y: "18", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "5", y: "18", width: "2", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "5", y: "17", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "10", y: "19", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "7", y: "17", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "11", y: "19", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "10", y: "18", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "17", y: "19", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "15", y: "4", width: "2", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "3", y: "9", width: "1", height: "3", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "4", y: "10", width: "1", height: "2", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "6", y: "9", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "15", y: "5", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "20", y: "8", width: "1", height: "3", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "19", y: "9", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "7", y: "13", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "9", y: "11", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "16", y: "12", width: "1", height: "2", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "13", y: "14", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "12", y: "11", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "10", y: "9", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "10", y: "15", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "10", y: "13", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "15", y: "9", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "13", y: "10", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "12", y: "14", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "5", y: "4", width: "3", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "6", y: "5", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "7", y: "14", width: "1", height: "2", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "6", y: "14", width: "3", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "16", y: "8", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "8", y: "9", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "20", y: "16", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "12", y: "12", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "8", y: "8", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "14", y: "12", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "17", y: "16", width: "2", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "14", y: "17", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "11", y: "5", width: "3", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "12", y: "4", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "12", y: "7", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "7", y: "11", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "15", y: "15", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "11", y: "11", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "13", y: "9", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "12", y: "15", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "9", y: "12", width: "2", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "19", y: "13", width: "2", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "9", y: "6", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "20", y: "4", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "19", y: "4", width: "1", height: "1", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "3", y: "15", width: "1", height: "2", fill: "currentColor" }),
+              /* @__PURE__ */ jsx35("rect", { x: "3", y: "19", width: "1", height: "1", fill: "currentColor" })
             ]
           }
         ),
-        /* @__PURE__ */ jsx29("span", { className: "sr-only", children: "Analyzing image" })
+        /* @__PURE__ */ jsx35("span", { className: "sr-only", children: "Analyzing image" })
       ]
     }
   );
@@ -5007,9 +5588,9 @@ function AnalyzingImage({
 
 // .generated/ui/loading/app-icon-load.tsx
 import { motion as motion23 } from "framer-motion";
-import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime";
-var AppIconLoad = () => /* @__PURE__ */ jsx30("div", { className: "relative w-12 h-12 bg-zinc-200 dark:bg-zinc-800 rounded-[12px] flex items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsxs18("svg", { className: "w-8 h-8 absolute", viewBox: "0 0 50 50", children: [
-  /* @__PURE__ */ jsx30(
+import { jsx as jsx36, jsxs as jsxs24 } from "react/jsx-runtime";
+var AppIconLoad = () => /* @__PURE__ */ jsx36("div", { className: "relative w-12 h-12 bg-zinc-200 dark:bg-zinc-800 rounded-[12px] flex items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsxs24("svg", { className: "w-8 h-8 absolute", viewBox: "0 0 50 50", children: [
+  /* @__PURE__ */ jsx36(
     "circle",
     {
       cx: "25",
@@ -5019,7 +5600,7 @@ var AppIconLoad = () => /* @__PURE__ */ jsx30("div", { className: "relative w-12
       strokeWidth: "4"
     }
   ),
-  /* @__PURE__ */ jsx30(
+  /* @__PURE__ */ jsx36(
     motion23.circle,
     {
       cx: "25",
@@ -5037,11 +5618,11 @@ var AppIconLoad = () => /* @__PURE__ */ jsx30("div", { className: "relative w-12
 
 // .generated/ui/loading/apple-breathe.tsx
 import { motion as motion24 } from "framer-motion";
-import { jsx as jsx31 } from "react/jsx-runtime";
+import { jsx as jsx37 } from "react/jsx-runtime";
 var AppleBreathe = () => {
-  return /* @__PURE__ */ jsx31("div", { className: "relative flex items-center justify-center w-12 h-12", children: [0, 60, 120, 180, 240, 300].map((angle, idx) => {
+  return /* @__PURE__ */ jsx37("div", { className: "relative flex items-center justify-center w-12 h-12", children: [0, 60, 120, 180, 240, 300].map((angle, idx) => {
     const bgClass = idx % 2 === 0 ? "bg-teal-400/35 dark:bg-teal-400/40" : "bg-cyan-400/35 dark:bg-cyan-400/40";
-    return /* @__PURE__ */ jsx31(
+    return /* @__PURE__ */ jsx37(
       motion24.div,
       {
         className: `absolute w-3.5 h-3.5 rounded-full ${bgClass}`,
@@ -5064,8 +5645,8 @@ var AppleBreathe = () => {
 
 // .generated/ui/loading/apple-equalizer.tsx
 import { motion as motion25 } from "framer-motion";
-import { jsx as jsx32 } from "react/jsx-runtime";
-var AppleEqualizer = () => /* @__PURE__ */ jsx32("div", { className: "flex space-x-1 h-8 items-end", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx32(
+import { jsx as jsx38 } from "react/jsx-runtime";
+var AppleEqualizer = () => /* @__PURE__ */ jsx38("div", { className: "flex space-x-1 h-8 items-end", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx38(
   motion25.div,
   {
     className: "w-1.5 bg-zinc-800 dark:bg-white rounded-t-sm",
@@ -5077,8 +5658,8 @@ var AppleEqualizer = () => /* @__PURE__ */ jsx32("div", { className: "flex space
 
 // .generated/ui/loading/apple-icon-morph.tsx
 import { motion as motion26 } from "framer-motion";
-import { jsx as jsx33 } from "react/jsx-runtime";
-var AppleIconMorph = () => /* @__PURE__ */ jsx33(
+import { jsx as jsx39 } from "react/jsx-runtime";
+var AppleIconMorph = () => /* @__PURE__ */ jsx39(
   motion26.div,
   {
     className: "w-8 h-8 bg-zinc-800 dark:bg-white",
@@ -5092,8 +5673,8 @@ var AppleIconMorph = () => /* @__PURE__ */ jsx33(
 
 // .generated/ui/loading/apple-pulse-dots.tsx
 import { motion as motion27 } from "framer-motion";
-import { jsx as jsx34 } from "react/jsx-runtime";
-var ApplePulseDots = () => /* @__PURE__ */ jsx34("div", { className: "flex space-x-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx34(
+import { jsx as jsx40 } from "react/jsx-runtime";
+var ApplePulseDots = () => /* @__PURE__ */ jsx40("div", { className: "flex space-x-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx40(
   motion27.div,
   {
     className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -5105,9 +5686,9 @@ var ApplePulseDots = () => /* @__PURE__ */ jsx34("div", { className: "flex space
 
 // .generated/ui/loading/apple-scale-pulse.tsx
 import { motion as motion28 } from "framer-motion";
-import { jsx as jsx35, jsxs as jsxs19 } from "react/jsx-runtime";
-var AppleScalePulse = () => /* @__PURE__ */ jsxs19("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
-  /* @__PURE__ */ jsx35(
+import { jsx as jsx41, jsxs as jsxs25 } from "react/jsx-runtime";
+var AppleScalePulse = () => /* @__PURE__ */ jsxs25("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
+  /* @__PURE__ */ jsx41(
     motion28.div,
     {
       className: "absolute w-full h-full bg-zinc-200 dark:bg-zinc-800 rounded-full",
@@ -5115,7 +5696,7 @@ var AppleScalePulse = () => /* @__PURE__ */ jsxs19("div", { className: "relative
       transition: { duration: 1.5, repeat: Infinity, ease: "easeOut" }
     }
   ),
-  /* @__PURE__ */ jsx35(
+  /* @__PURE__ */ jsx41(
     motion28.div,
     {
       className: "absolute w-full h-full bg-zinc-200 dark:bg-zinc-800 rounded-full",
@@ -5123,13 +5704,13 @@ var AppleScalePulse = () => /* @__PURE__ */ jsxs19("div", { className: "relative
       transition: { duration: 1.5, repeat: Infinity, delay: 0.5, ease: "easeOut" }
     }
   ),
-  /* @__PURE__ */ jsx35("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full z-10" })
+  /* @__PURE__ */ jsx41("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full z-10" })
 ] });
 
 // .generated/ui/loading/apple-sound-wave.tsx
 import { motion as motion29 } from "framer-motion";
-import { jsx as jsx36 } from "react/jsx-runtime";
-var AppleSoundWave = () => /* @__PURE__ */ jsx36("div", { className: "flex space-x-1 h-8 items-center", children: [1, 2, 3, 2, 1].map((val, i) => /* @__PURE__ */ jsx36(
+import { jsx as jsx42 } from "react/jsx-runtime";
+var AppleSoundWave = () => /* @__PURE__ */ jsx42("div", { className: "flex space-x-1 h-8 items-center", children: [1, 2, 3, 2, 1].map((val, i) => /* @__PURE__ */ jsx42(
   motion29.div,
   {
     className: "w-1 bg-zinc-800 dark:bg-white rounded-full",
@@ -5141,8 +5722,8 @@ var AppleSoundWave = () => /* @__PURE__ */ jsx36("div", { className: "flex space
 
 // .generated/ui/loading/apple-text-reveal.tsx
 import { motion as motion30 } from "framer-motion";
-import { jsx as jsx37 } from "react/jsx-runtime";
-var AppleTextReveal = () => /* @__PURE__ */ jsx37("div", { className: "font-medium text-lg text-zinc-900 dark:text-white overflow-hidden h-6 relative", children: /* @__PURE__ */ jsx37(
+import { jsx as jsx43 } from "react/jsx-runtime";
+var AppleTextReveal = () => /* @__PURE__ */ jsx43("div", { className: "font-medium text-lg text-zinc-900 dark:text-white overflow-hidden h-6 relative", children: /* @__PURE__ */ jsx43(
   motion30.div,
   {
     animate: { y: ["100%", "0%", "-100%"] },
@@ -5153,12 +5734,12 @@ var AppleTextReveal = () => /* @__PURE__ */ jsx37("div", { className: "font-medi
 
 // .generated/ui/loading/apple-unlock.tsx
 import { motion as motion31 } from "framer-motion";
-import { jsx as jsx38, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs26 } from "react/jsx-runtime";
 var AppleUnlock = ({ theme = "light" }) => {
   const isDark = theme === "dark";
-  return /* @__PURE__ */ jsxs20("div", { className: "relative font-medium text-sm tracking-wide select-none", children: [
-    /* @__PURE__ */ jsx38("span", { className: "text-zinc-400 dark:text-zinc-600", children: "Slide to unlock" }),
-    /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsxs26("div", { className: "relative font-medium text-sm tracking-wide select-none", children: [
+    /* @__PURE__ */ jsx44("span", { className: "text-zinc-400 dark:text-zinc-600", children: "Slide to unlock" }),
+    /* @__PURE__ */ jsx44(
       motion31.div,
       {
         className: "absolute inset-0 text-zinc-950 dark:text-white bg-clip-text text-transparent bg-gradient-to-r from-transparent via-current to-transparent",
@@ -5175,11 +5756,11 @@ var AppleUnlock = ({ theme = "light" }) => {
 
 // .generated/ui/loading/arc-tracer.tsx
 import { motion as motion32 } from "framer-motion";
-import { jsx as jsx39, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx45, jsxs as jsxs27 } from "react/jsx-runtime";
 var ArcTracer = () => {
-  return /* @__PURE__ */ jsxs21("svg", { className: "w-10 h-10", viewBox: "0 0 50 50", children: [
-    /* @__PURE__ */ jsx39("circle", { cx: "25", cy: "25", r: "20", className: "stroke-zinc-200 dark:stroke-zinc-800 fill-none", strokeWidth: "4" }),
-    /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsxs27("svg", { className: "w-10 h-10", viewBox: "0 0 50 50", children: [
+    /* @__PURE__ */ jsx45("circle", { cx: "25", cy: "25", r: "20", className: "stroke-zinc-200 dark:stroke-zinc-800 fill-none", strokeWidth: "4" }),
+    /* @__PURE__ */ jsx45(
       motion32.circle,
       {
         cx: "25",
@@ -5198,9 +5779,9 @@ var ArcTracer = () => {
 
 // .generated/ui/loading/bar-cascade.tsx
 import { motion as motion33 } from "framer-motion";
-import { jsx as jsx40 } from "react/jsx-runtime";
+import { jsx as jsx46 } from "react/jsx-runtime";
 var BarCascade = () => {
-  return /* @__PURE__ */ jsx40("div", { className: "flex space-x-1 items-center h-8", children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsx46("div", { className: "flex space-x-1 items-center h-8", children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx46(
     motion33.div,
     {
       className: "w-1.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -5213,9 +5794,9 @@ var BarCascade = () => {
 
 // .generated/ui/loading/bar-sweep.tsx
 import { motion as motion34 } from "framer-motion";
-import { jsx as jsx41 } from "react/jsx-runtime";
+import { jsx as jsx47 } from "react/jsx-runtime";
 var BarSweep = () => {
-  return /* @__PURE__ */ jsx41("div", { className: "w-12 h-6 border-2 border-zinc-800 dark:border-zinc-700 rounded-full p-1 relative flex items-center overflow-hidden", children: /* @__PURE__ */ jsx41(
+  return /* @__PURE__ */ jsx47("div", { className: "w-12 h-6 border-2 border-zinc-800 dark:border-zinc-700 rounded-full p-1 relative flex items-center overflow-hidden", children: /* @__PURE__ */ jsx47(
     motion34.div,
     {
       className: "w-4 h-4 bg-zinc-800 dark:bg-white rounded-full absolute",
@@ -5227,9 +5808,9 @@ var BarSweep = () => {
 
 // .generated/ui/loading/bobbing-dots.tsx
 import { motion as motion35 } from "framer-motion";
-import { jsx as jsx42 } from "react/jsx-runtime";
+import { jsx as jsx48 } from "react/jsx-runtime";
 var BobbingDots = () => {
-  return /* @__PURE__ */ jsx42("div", { className: "flex space-x-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx48("div", { className: "flex space-x-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx48(
     motion35.div,
     {
       className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full",
@@ -5242,7 +5823,7 @@ var BobbingDots = () => {
 
 // .generated/ui/loading/border-trail-loading.tsx
 import { motion as motion36, useReducedMotion as useReducedMotion8 } from "framer-motion";
-import { jsx as jsx43, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs28 } from "react/jsx-runtime";
 function BorderTrail({
   className = "",
   size = 100,
@@ -5255,12 +5836,12 @@ function BorderTrail({
     duration: 5,
     ease: "linear"
   };
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx49(
     "div",
     {
       "aria-hidden": "true",
       className: "pointer-events-none absolute inset-0 rounded-[inherit] border border-transparent [mask-clip:padding-box,border-box] [mask-composite:intersect] [mask-image:linear-gradient(transparent,transparent),linear-gradient(#000,#000)]",
-      children: /* @__PURE__ */ jsx43(
+      children: /* @__PURE__ */ jsx49(
         motion36.div,
         {
           className: "absolute aspect-square bg-zinc-500 " + className,
@@ -5290,14 +5871,14 @@ function BorderTrailLoading({
   const reducedMotion = useReducedMotion8();
   const isDark = theme === "dark";
   const motionTransition = reducedMotion ? { duration: 0, repeat: 0 } : trailTransition;
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs28(
     "div",
     {
       className: "relative flex aspect-[3/2] h-auto min-h-0 w-[300px] max-w-full flex-col items-center justify-center rounded-md px-5 py-2 " + (isDark ? "bg-zinc-800" : "bg-zinc-200") + " " + className,
       style,
       ...props,
       children: [
-        /* @__PURE__ */ jsx43(
+        /* @__PURE__ */ jsx49(
           BorderTrail,
           {
             size: trailSize,
@@ -5307,18 +5888,18 @@ function BorderTrailLoading({
             }
           }
         ),
-        /* @__PURE__ */ jsxs22(
+        /* @__PURE__ */ jsxs28(
           "div",
           {
             className: "flex h-full animate-pulse motion-reduce:animate-none flex-col items-start justify-center space-y-2",
             role: "status",
             "aria-label": "Loading...",
             children: [
-              /* @__PURE__ */ jsx43("div", { className: "h-1 w-4 rounded-[4px] bg-zinc-600" }),
-              /* @__PURE__ */ jsx43("div", { className: "h-1 w-10 rounded-[4px] bg-zinc-600" }),
-              /* @__PURE__ */ jsx43("div", { className: "h-1 w-12 rounded-[4px] bg-zinc-600" }),
-              /* @__PURE__ */ jsx43("div", { className: "h-1 w-12 rounded-[4px] bg-zinc-600" }),
-              /* @__PURE__ */ jsx43("div", { className: "h-1 w-12 rounded-[4px] bg-zinc-600" })
+              /* @__PURE__ */ jsx49("div", { className: "h-1 w-4 rounded-[4px] bg-zinc-600" }),
+              /* @__PURE__ */ jsx49("div", { className: "h-1 w-10 rounded-[4px] bg-zinc-600" }),
+              /* @__PURE__ */ jsx49("div", { className: "h-1 w-12 rounded-[4px] bg-zinc-600" }),
+              /* @__PURE__ */ jsx49("div", { className: "h-1 w-12 rounded-[4px] bg-zinc-600" }),
+              /* @__PURE__ */ jsx49("div", { className: "h-1 w-12 rounded-[4px] bg-zinc-600" })
             ]
           }
         )
@@ -5329,9 +5910,9 @@ function BorderTrailLoading({
 
 // .generated/ui/loading/bounce-dots.tsx
 import { motion as motion37 } from "framer-motion";
-import { jsx as jsx44 } from "react/jsx-runtime";
+import { jsx as jsx50 } from "react/jsx-runtime";
 var BounceDots = () => {
-  return /* @__PURE__ */ jsx44("div", { className: "flex space-x-1.5", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx50("div", { className: "flex space-x-1.5", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx50(
     motion37.div,
     {
       className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -5349,9 +5930,9 @@ var BounceDots = () => {
 
 // .generated/ui/loading/bouncing-bars.tsx
 import { motion as motion38 } from "framer-motion";
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { jsx as jsx51 } from "react/jsx-runtime";
 var BouncingBars = () => {
-  return /* @__PURE__ */ jsx45("div", { className: "flex space-x-1.5 h-8 items-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx51("div", { className: "flex space-x-1.5 h-8 items-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx51(
     motion38.div,
     {
       className: "w-1.5 h-8 bg-zinc-800 dark:bg-white rounded-full",
@@ -5364,9 +5945,9 @@ var BouncingBars = () => {
 
 // .generated/ui/loading/bouncing-dots.tsx
 import { motion as motion39 } from "framer-motion";
-import { jsx as jsx46 } from "react/jsx-runtime";
+import { jsx as jsx52 } from "react/jsx-runtime";
 var BouncingDots = () => {
-  return /* @__PURE__ */ jsx46("div", { className: "flex space-x-2 h-12 items-end pb-2 border-b-2 border-zinc-200 dark:border-zinc-800 w-16 justify-center relative", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx46(
+  return /* @__PURE__ */ jsx52("div", { className: "flex space-x-2 h-12 items-end pb-2 border-b-2 border-zinc-200 dark:border-zinc-800 w-16 justify-center relative", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx52(
     motion39.div,
     {
       className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full absolute bottom-2",
@@ -5380,9 +5961,9 @@ var BouncingDots = () => {
 
 // .generated/ui/loading/bouncing-lines.tsx
 import { motion as motion40 } from "framer-motion";
-import { jsx as jsx47 } from "react/jsx-runtime";
+import { jsx as jsx53 } from "react/jsx-runtime";
 var BouncingLines = () => {
-  return /* @__PURE__ */ jsx47("div", { className: "flex flex-col space-y-1.5 w-8", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx47(
+  return /* @__PURE__ */ jsx53("div", { className: "flex flex-col space-y-1.5 w-8", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx53(
     motion40.div,
     {
       className: "w-full h-1.5 bg-zinc-800 dark:bg-white rounded-full origin-left",
@@ -5395,11 +5976,11 @@ var BouncingLines = () => {
 
 // .generated/ui/loading/bouncing-square.tsx
 import { motion as motion41 } from "framer-motion";
-import { jsx as jsx48, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs29 } from "react/jsx-runtime";
 var BouncingSquare = () => {
-  return /* @__PURE__ */ jsxs23("div", { className: "relative w-10 h-12 flex items-end justify-center", children: [
-    /* @__PURE__ */ jsx48("div", { className: "absolute bottom-0 w-8 h-1 bg-zinc-200 dark:bg-zinc-800 rounded-full blur-sm" }),
-    /* @__PURE__ */ jsx48(
+  return /* @__PURE__ */ jsxs29("div", { className: "relative w-10 h-12 flex items-end justify-center", children: [
+    /* @__PURE__ */ jsx54("div", { className: "absolute bottom-0 w-8 h-1 bg-zinc-200 dark:bg-zinc-800 rounded-full blur-sm" }),
+    /* @__PURE__ */ jsx54(
       motion41.div,
       {
         className: "w-6 h-6 bg-zinc-800 dark:bg-white rounded-sm origin-bottom",
@@ -5412,8 +5993,8 @@ var BouncingSquare = () => {
 
 // .generated/ui/loading/breathe-ring.tsx
 import { motion as motion42 } from "framer-motion";
-import { jsx as jsx49 } from "react/jsx-runtime";
-var BreatheRing = () => /* @__PURE__ */ jsx49(
+import { jsx as jsx55 } from "react/jsx-runtime";
+var BreatheRing = () => /* @__PURE__ */ jsx55(
   motion42.div,
   {
     className: "w-10 h-10 rounded-full border-4 border-zinc-800 dark:border-zinc-700",
@@ -5424,10 +6005,10 @@ var BreatheRing = () => /* @__PURE__ */ jsx49(
 
 // .generated/ui/loading/breathing-glow.tsx
 import { motion as motion43 } from "framer-motion";
-import { jsx as jsx50, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs30 } from "react/jsx-runtime";
 var BreathingGlow = () => {
-  return /* @__PURE__ */ jsxs24("div", { className: "relative flex items-center justify-center w-12 h-12", children: [
-    /* @__PURE__ */ jsx50(
+  return /* @__PURE__ */ jsxs30("div", { className: "relative flex items-center justify-center w-12 h-12", children: [
+    /* @__PURE__ */ jsx56(
       motion43.div,
       {
         className: "absolute w-8 h-8 bg-blue-500 rounded-full blur-md",
@@ -5435,15 +6016,15 @@ var BreathingGlow = () => {
         transition: { duration: 2, repeat: Infinity, ease: "easeInOut" }
       }
     ),
-    /* @__PURE__ */ jsx50("div", { className: "relative w-6 h-6 bg-white rounded-full shadow-sm" })
+    /* @__PURE__ */ jsx56("div", { className: "relative w-6 h-6 bg-white rounded-full shadow-sm" })
   ] });
 };
 
 // .generated/ui/loading/breathing-square.tsx
 import { motion as motion44 } from "framer-motion";
-import { jsx as jsx51 } from "react/jsx-runtime";
+import { jsx as jsx57 } from "react/jsx-runtime";
 var BreathingSquare = () => {
-  return /* @__PURE__ */ jsx51(
+  return /* @__PURE__ */ jsx57(
     motion44.div,
     {
       className: "w-8 h-8 bg-zinc-800 dark:bg-white",
@@ -5459,9 +6040,9 @@ var BreathingSquare = () => {
 
 // .generated/ui/loading/circular-bars.tsx
 import { motion as motion45 } from "framer-motion";
-import { jsx as jsx52 } from "react/jsx-runtime";
+import { jsx as jsx58 } from "react/jsx-runtime";
 var CircularBars = () => {
-  return /* @__PURE__ */ jsx52("div", { className: "relative w-10 h-10", children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx52(
+  return /* @__PURE__ */ jsx58("div", { className: "relative w-10 h-10", children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx58(
     motion45.div,
     {
       className: "absolute top-0 left-[18px] w-1 h-3 bg-zinc-800 dark:bg-white rounded-full origin-[2px_20px]",
@@ -5475,9 +6056,9 @@ var CircularBars = () => {
 
 // .generated/ui/loading/classic-spinner.tsx
 import { motion as motion46 } from "framer-motion";
-import { jsx as jsx53 } from "react/jsx-runtime";
+import { jsx as jsx59 } from "react/jsx-runtime";
 var ClassicSpinner = () => {
-  return /* @__PURE__ */ jsx53("div", { className: "relative w-8 h-8", children: Array.from({ length: 12 }).map((_, i) => /* @__PURE__ */ jsx53(
+  return /* @__PURE__ */ jsx59("div", { className: "relative w-8 h-8", children: Array.from({ length: 12 }).map((_, i) => /* @__PURE__ */ jsx59(
     motion46.div,
     {
       className: "absolute top-0 left-[14px] w-[4px] h-[8px] bg-zinc-400 dark:bg-zinc-200 rounded-full origin-[2px_16px]",
@@ -5496,10 +6077,10 @@ var ClassicSpinner = () => {
 
 // .generated/ui/loading/clock-spinner.tsx
 import { motion as motion47 } from "framer-motion";
-import { jsx as jsx54, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs31 } from "react/jsx-runtime";
 var ClockSpinner = () => {
-  return /* @__PURE__ */ jsxs25("div", { className: "relative w-10 h-10 border-2 border-zinc-800 dark:border-zinc-700 rounded-full flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx54(
+  return /* @__PURE__ */ jsxs31("div", { className: "relative w-10 h-10 border-2 border-zinc-800 dark:border-zinc-700 rounded-full flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx60(
       motion47.div,
       {
         className: "absolute w-0.5 h-3.5 bg-zinc-800 dark:bg-white rounded-full origin-bottom",
@@ -5508,7 +6089,7 @@ var ClockSpinner = () => {
         transition: { duration: 2, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx54(
+    /* @__PURE__ */ jsx60(
       motion47.div,
       {
         className: "absolute w-0.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full origin-bottom",
@@ -5522,10 +6103,10 @@ var ClockSpinner = () => {
 
 // .generated/ui/loading/comet-spinner.tsx
 import { motion as motion48 } from "framer-motion";
-import { jsx as jsx55, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs32 } from "react/jsx-runtime";
 var CometSpinner = () => {
-  return /* @__PURE__ */ jsxs26("div", { className: "relative w-10 h-10 border border-zinc-200 dark:border-zinc-800 rounded-full flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx55(
+  return /* @__PURE__ */ jsxs32("div", { className: "relative w-10 h-10 border border-zinc-200 dark:border-zinc-800 rounded-full flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx61(
       motion48.div,
       {
         className: "absolute w-full h-full rounded-full",
@@ -5536,15 +6117,15 @@ var CometSpinner = () => {
         transition: { duration: 1, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx55("div", { className: "absolute bg-white w-8 h-8 rounded-full" })
+    /* @__PURE__ */ jsx61("div", { className: "absolute bg-white w-8 h-8 rounded-full" })
   ] });
 };
 
 // .generated/ui/loading/concentric-pulse.tsx
 import { motion as motion49 } from "framer-motion";
-import { jsx as jsx56 } from "react/jsx-runtime";
+import { jsx as jsx62 } from "react/jsx-runtime";
 var ConcentricPulse = () => {
-  return /* @__PURE__ */ jsx56("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx56(
+  return /* @__PURE__ */ jsx62("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx62(
     motion49.div,
     {
       className: "absolute rounded-full border border-zinc-800 dark:border-zinc-700",
@@ -5558,10 +6139,10 @@ var ConcentricPulse = () => {
 
 // .generated/ui/loading/concentric-ring.tsx
 import { motion as motion50 } from "framer-motion";
-import { jsx as jsx57, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs33 } from "react/jsx-runtime";
 var ConcentricRing = () => {
-  return /* @__PURE__ */ jsxs27("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx57(
+  return /* @__PURE__ */ jsxs33("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx63(
       motion50.div,
       {
         className: "absolute w-12 h-12 border-2 border-zinc-800 dark:border-zinc-700 border-t-transparent rounded-full",
@@ -5569,7 +6150,7 @@ var ConcentricRing = () => {
         transition: { duration: 2, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx57(
+    /* @__PURE__ */ jsx63(
       motion50.div,
       {
         className: "absolute w-8 h-8 border-2 border-zinc-500 border-b-transparent rounded-full",
@@ -5577,7 +6158,7 @@ var ConcentricRing = () => {
         transition: { duration: 1.5, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx57(
+    /* @__PURE__ */ jsx63(
       motion50.div,
       {
         className: "absolute w-4 h-4 border-2 border-zinc-300 border-l-transparent rounded-full",
@@ -5590,10 +6171,10 @@ var ConcentricRing = () => {
 
 // .generated/ui/loading/concentric-squares.tsx
 import { motion as motion51 } from "framer-motion";
-import { jsx as jsx58, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs34 } from "react/jsx-runtime";
 var ConcentricSquares = () => {
-  return /* @__PURE__ */ jsxs28("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx58(
+  return /* @__PURE__ */ jsxs34("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx64(
       motion51.div,
       {
         className: "absolute w-12 h-12 border-2 border-zinc-800 dark:border-zinc-700 rounded-sm",
@@ -5601,7 +6182,7 @@ var ConcentricSquares = () => {
         transition: { duration: 2, repeat: Infinity, ease: "easeInOut" }
       }
     ),
-    /* @__PURE__ */ jsx58(
+    /* @__PURE__ */ jsx64(
       motion51.div,
       {
         className: "absolute w-6 h-6 border-2 border-zinc-500 rounded-sm",
@@ -5614,32 +6195,32 @@ var ConcentricSquares = () => {
 
 // .generated/ui/loading/conveyor-loop.tsx
 import { motion as motion52 } from "framer-motion";
-import { jsx as jsx59 } from "react/jsx-runtime";
+import { jsx as jsx65 } from "react/jsx-runtime";
 var ConveyorLoop = () => {
-  return /* @__PURE__ */ jsx59("div", { className: "w-16 h-3 overflow-hidden relative rounded-full bg-zinc-200 dark:bg-zinc-800", children: /* @__PURE__ */ jsx59(
+  return /* @__PURE__ */ jsx65("div", { className: "w-16 h-3 overflow-hidden relative rounded-full bg-zinc-200 dark:bg-zinc-800", children: /* @__PURE__ */ jsx65(
     motion52.div,
     {
       className: "flex h-full space-x-2 absolute top-0 items-center",
       animate: { x: [0, -32] },
       transition: { duration: 1, repeat: Infinity, ease: "linear" },
-      children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx59("div", { className: "w-1.5 h-1.5 bg-zinc-800 dark:bg-white rounded-full shrink-0" }, i))
+      children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx65("div", { className: "w-1.5 h-1.5 bg-zinc-800 dark:bg-white rounded-full shrink-0" }, i))
     }
   ) });
 };
 
 // .generated/ui/loading/cross-spinner.tsx
 import { motion as motion53 } from "framer-motion";
-import { jsx as jsx60, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx66, jsxs as jsxs35 } from "react/jsx-runtime";
 var CrossSpinner = () => {
-  return /* @__PURE__ */ jsxs29(
+  return /* @__PURE__ */ jsxs35(
     motion53.div,
     {
       className: "relative w-8 h-8 flex items-center justify-center",
       animate: { rotate: [0, 90, 180, 270, 360] },
       transition: { duration: 2, repeat: Infinity, ease: "easeInOut" },
       children: [
-        /* @__PURE__ */ jsx60("div", { className: "absolute w-full h-1.5 bg-zinc-800 dark:bg-white rounded-full" }),
-        /* @__PURE__ */ jsx60("div", { className: "absolute h-full w-1.5 bg-zinc-800 dark:bg-white rounded-full" })
+        /* @__PURE__ */ jsx66("div", { className: "absolute w-full h-1.5 bg-zinc-800 dark:bg-white rounded-full" }),
+        /* @__PURE__ */ jsx66("div", { className: "absolute h-full w-1.5 bg-zinc-800 dark:bg-white rounded-full" })
       ]
     }
   );
@@ -5647,8 +6228,8 @@ var CrossSpinner = () => {
 
 // .generated/ui/loading/cube-flip-spring.tsx
 import { motion as motion54 } from "framer-motion";
-import { jsx as jsx61 } from "react/jsx-runtime";
-var CubeFlipSpring = () => /* @__PURE__ */ jsx61(
+import { jsx as jsx67 } from "react/jsx-runtime";
+var CubeFlipSpring = () => /* @__PURE__ */ jsx67(
   motion54.div,
   {
     className: "w-8 h-8 bg-zinc-800 dark:bg-white rounded-lg",
@@ -5659,9 +6240,9 @@ var CubeFlipSpring = () => /* @__PURE__ */ jsx61(
 
 // .generated/ui/loading/dash-ring.tsx
 import { motion as motion55 } from "framer-motion";
-import { jsx as jsx62 } from "react/jsx-runtime";
+import { jsx as jsx68 } from "react/jsx-runtime";
 var DashRing = () => {
-  return /* @__PURE__ */ jsx62("svg", { className: "w-12 h-12", viewBox: "0 0 50 50", children: /* @__PURE__ */ jsx62(
+  return /* @__PURE__ */ jsx68("svg", { className: "w-12 h-12", viewBox: "0 0 50 50", children: /* @__PURE__ */ jsx68(
     motion55.circle,
     {
       cx: "25",
@@ -5679,8 +6260,8 @@ var DashRing = () => {
 
 // .generated/ui/loading/dashed-spiral.tsx
 import { motion as motion56 } from "framer-motion";
-import { jsx as jsx63 } from "react/jsx-runtime";
-var DashedSpiral = () => /* @__PURE__ */ jsx63(
+import { jsx as jsx69 } from "react/jsx-runtime";
+var DashedSpiral = () => /* @__PURE__ */ jsx69(
   motion56.div,
   {
     className: "w-10 h-10 border-[3px] border-zinc-800 dark:border-zinc-700 rounded-full border-dashed",
@@ -5691,9 +6272,9 @@ var DashedSpiral = () => /* @__PURE__ */ jsx63(
 
 // .generated/ui/loading/diamond-grid.tsx
 import { motion as motion57 } from "framer-motion";
-import { jsx as jsx64 } from "react/jsx-runtime";
+import { jsx as jsx70 } from "react/jsx-runtime";
 var DiamondGrid = () => {
-  return /* @__PURE__ */ jsx64("div", { className: "grid grid-cols-2 gap-2 rotate-45", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx64(
+  return /* @__PURE__ */ jsx70("div", { className: "grid grid-cols-2 gap-2 rotate-45", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx70(
     motion57.div,
     {
       className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-sm",
@@ -5706,8 +6287,8 @@ var DiamondGrid = () => {
 
 // .generated/ui/loading/diamond-rotate-spring.tsx
 import { motion as motion58 } from "framer-motion";
-import { jsx as jsx65 } from "react/jsx-runtime";
-var DiamondRotateSpring = () => /* @__PURE__ */ jsx65(
+import { jsx as jsx71 } from "react/jsx-runtime";
+var DiamondRotateSpring = () => /* @__PURE__ */ jsx71(
   motion58.div,
   {
     className: "w-8 h-8 bg-zinc-800 dark:bg-white rounded-sm origin-center",
@@ -5719,9 +6300,9 @@ var DiamondRotateSpring = () => /* @__PURE__ */ jsx65(
 
 // .generated/ui/loading/dot-spinner.tsx
 import { motion as motion59 } from "framer-motion";
-import { jsx as jsx66 } from "react/jsx-runtime";
+import { jsx as jsx72 } from "react/jsx-runtime";
 var DotSpinner = () => {
-  return /* @__PURE__ */ jsx66("div", { className: "relative w-10 h-10", children: [0, 1, 2, 3, 4, 5, 6, 7].map((i) => /* @__PURE__ */ jsx66(
+  return /* @__PURE__ */ jsx72("div", { className: "relative w-10 h-10", children: [0, 1, 2, 3, 4, 5, 6, 7].map((i) => /* @__PURE__ */ jsx72(
     motion59.div,
     {
       className: "absolute top-0 left-1/2 w-2 h-2 bg-zinc-800 dark:bg-white rounded-full -ml-1 origin-[4px_20px]",
@@ -5735,9 +6316,9 @@ var DotSpinner = () => {
 
 // .generated/ui/loading/dots-ring.tsx
 import { motion as motion60 } from "framer-motion";
-import { jsx as jsx67 } from "react/jsx-runtime";
+import { jsx as jsx73 } from "react/jsx-runtime";
 var DotsRing = () => {
-  return /* @__PURE__ */ jsx67("div", { className: "relative w-12 h-12", children: [0, 1, 2, 3, 4, 5, 6, 7].map((i) => /* @__PURE__ */ jsx67(
+  return /* @__PURE__ */ jsx73("div", { className: "relative w-12 h-12", children: [0, 1, 2, 3, 4, 5, 6, 7].map((i) => /* @__PURE__ */ jsx73(
     motion60.div,
     {
       className: "absolute top-0 left-1/2 w-2 h-2 bg-zinc-800 dark:bg-white rounded-full -ml-1 origin-[4px_24px]",
@@ -5751,10 +6332,10 @@ var DotsRing = () => {
 
 // .generated/ui/loading/double-ring.tsx
 import { motion as motion61 } from "framer-motion";
-import { jsx as jsx68, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx74, jsxs as jsxs36 } from "react/jsx-runtime";
 var DoubleRing = () => {
-  return /* @__PURE__ */ jsxs30("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx68(
+  return /* @__PURE__ */ jsxs36("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx74(
       motion61.div,
       {
         className: "absolute w-10 h-10 border-2 border-zinc-200 dark:border-zinc-800 rounded-full border-t-zinc-800 dark:border-t-white",
@@ -5762,7 +6343,7 @@ var DoubleRing = () => {
         transition: { duration: 1.5, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx68(
+    /* @__PURE__ */ jsx74(
       motion61.div,
       {
         className: "absolute w-6 h-6 border-2 border-zinc-200 dark:border-zinc-800 rounded-full border-b-zinc-800 dark:border-b-white",
@@ -5775,9 +6356,9 @@ var DoubleRing = () => {
 
 // .generated/ui/loading/drop-dot.tsx
 import { motion as motion62 } from "framer-motion";
-import { jsx as jsx69, jsxs as jsxs31 } from "react/jsx-runtime";
-var DropDot = () => /* @__PURE__ */ jsxs31("div", { className: "relative w-6 h-12 flex flex-col items-center", children: [
-  /* @__PURE__ */ jsx69(
+import { jsx as jsx75, jsxs as jsxs37 } from "react/jsx-runtime";
+var DropDot = () => /* @__PURE__ */ jsxs37("div", { className: "relative w-6 h-12 flex flex-col items-center", children: [
+  /* @__PURE__ */ jsx75(
     motion62.div,
     {
       className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full absolute top-0 z-10",
@@ -5785,14 +6366,14 @@ var DropDot = () => /* @__PURE__ */ jsxs31("div", { className: "relative w-6 h-1
       transition: { duration: 1, repeat: Infinity, ease: "circIn" }
     }
   ),
-  /* @__PURE__ */ jsx69("div", { className: "w-4 h-1 bg-zinc-300 dark:bg-zinc-700 rounded-full absolute bottom-2 blur-[1px]" })
+  /* @__PURE__ */ jsx75("div", { className: "w-4 h-1 bg-zinc-300 dark:bg-zinc-700 rounded-full absolute bottom-2 blur-[1px]" })
 ] });
 
 // .generated/ui/loading/dual-arc.tsx
 import { motion as motion63 } from "framer-motion";
-import { jsx as jsx70 } from "react/jsx-runtime";
+import { jsx as jsx76 } from "react/jsx-runtime";
 var DualArc = () => {
-  return /* @__PURE__ */ jsx70("div", { className: "relative w-8 h-8 flex items-center justify-center", children: /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx76("div", { className: "relative w-8 h-8 flex items-center justify-center", children: /* @__PURE__ */ jsx76(
     motion63.div,
     {
       className: "absolute inset-0 border-2 border-t-zinc-800 dark:border-t-white border-b-zinc-800 dark:border-b-white border-l-transparent border-r-transparent rounded-full",
@@ -5807,9 +6388,9 @@ var DualArc = () => {
 
 // .generated/ui/loading/dynamic-island.tsx
 import { motion as motion64 } from "framer-motion";
-import { jsx as jsx71, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx77, jsxs as jsxs38 } from "react/jsx-runtime";
 var DynamicIsland = () => {
-  return /* @__PURE__ */ jsxs32(
+  return /* @__PURE__ */ jsxs38(
     motion64.div,
     {
       className: "bg-zinc-950 dark:bg-zinc-900 border border-black/10 dark:border-white/10 rounded-full flex items-center justify-center px-4 py-2 gap-3 h-8 shadow-sm",
@@ -5822,7 +6403,7 @@ var DynamicIsland = () => {
         ease: "easeInOut"
       },
       children: [
-        /* @__PURE__ */ jsx71(
+        /* @__PURE__ */ jsx77(
           motion64.div,
           {
             className: "w-1.5 h-1.5 rounded-full bg-emerald-500",
@@ -5830,7 +6411,7 @@ var DynamicIsland = () => {
             transition: { duration: 1.1, repeat: Infinity, ease: "easeInOut" }
           }
         ),
-        /* @__PURE__ */ jsx71("div", { className: "flex gap-1 items-center h-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx71(
+        /* @__PURE__ */ jsx77("div", { className: "flex gap-1 items-center h-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx77(
           motion64.div,
           {
             className: "w-0.5 bg-zinc-300 dark:bg-zinc-500 rounded-full",
@@ -5851,8 +6432,8 @@ var DynamicIsland = () => {
 
 // .generated/ui/loading/elastic-bars.tsx
 import { motion as motion65 } from "framer-motion";
-import { jsx as jsx72 } from "react/jsx-runtime";
-var ElasticBars = () => /* @__PURE__ */ jsx72("div", { className: "flex space-x-2 h-10 items-center justify-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx72(
+import { jsx as jsx78 } from "react/jsx-runtime";
+var ElasticBars = () => /* @__PURE__ */ jsx78("div", { className: "flex space-x-2 h-10 items-center justify-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx78(
   motion65.div,
   {
     className: "w-2 bg-zinc-800 dark:bg-white rounded-full",
@@ -5869,8 +6450,8 @@ var ElasticBars = () => /* @__PURE__ */ jsx72("div", { className: "flex space-x-
 
 // .generated/ui/loading/elastic-square.tsx
 import { motion as motion66 } from "framer-motion";
-import { jsx as jsx73 } from "react/jsx-runtime";
-var ElasticSquare = () => /* @__PURE__ */ jsx73("div", { className: "h-12 flex items-end border-b-2 border-zinc-200 dark:border-zinc-800 w-12 justify-center", children: /* @__PURE__ */ jsx73(
+import { jsx as jsx79 } from "react/jsx-runtime";
+var ElasticSquare = () => /* @__PURE__ */ jsx79("div", { className: "h-12 flex items-end border-b-2 border-zinc-200 dark:border-zinc-800 w-12 justify-center", children: /* @__PURE__ */ jsx79(
   motion66.div,
   {
     className: "w-6 h-6 bg-zinc-800 dark:bg-white rounded-sm origin-bottom",
@@ -5881,10 +6462,10 @@ var ElasticSquare = () => /* @__PURE__ */ jsx73("div", { className: "h-12 flex i
 
 // .generated/ui/loading/expanding-cross.tsx
 import { motion as motion67 } from "framer-motion";
-import { jsx as jsx74, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx80, jsxs as jsxs39 } from "react/jsx-runtime";
 var ExpandingCross = () => {
-  return /* @__PURE__ */ jsxs33("div", { className: "relative w-8 h-8", children: [
-    /* @__PURE__ */ jsx74(
+  return /* @__PURE__ */ jsxs39("div", { className: "relative w-8 h-8", children: [
+    /* @__PURE__ */ jsx80(
       motion67.div,
       {
         className: "absolute top-1/2 left-0 w-full h-1 bg-zinc-800 dark:bg-white -mt-0.5 rounded-full",
@@ -5892,7 +6473,7 @@ var ExpandingCross = () => {
         transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" }
       }
     ),
-    /* @__PURE__ */ jsx74(
+    /* @__PURE__ */ jsx80(
       motion67.div,
       {
         className: "absolute left-1/2 top-0 h-full w-1 bg-zinc-800 dark:bg-white -ml-0.5 rounded-full",
@@ -5905,10 +6486,10 @@ var ExpandingCross = () => {
 
 // .generated/ui/loading/face-id-scan.tsx
 import { motion as motion68 } from "framer-motion";
-import { jsx as jsx75, jsxs as jsxs34 } from "react/jsx-runtime";
-var FaceIDScan = () => /* @__PURE__ */ jsxs34("div", { className: "w-12 h-12 border-2 border-zinc-300 rounded-xl relative overflow-hidden flex items-center justify-center", children: [
-  /* @__PURE__ */ jsx75("svg", { viewBox: "0 0 24 24", className: "w-6 h-6 fill-zinc-300 dark:fill-zinc-700", children: /* @__PURE__ */ jsx75("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z" }) }),
-  /* @__PURE__ */ jsx75(
+import { jsx as jsx81, jsxs as jsxs40 } from "react/jsx-runtime";
+var FaceIDScan = () => /* @__PURE__ */ jsxs40("div", { className: "w-12 h-12 border-2 border-zinc-300 rounded-xl relative overflow-hidden flex items-center justify-center", children: [
+  /* @__PURE__ */ jsx81("svg", { viewBox: "0 0 24 24", className: "w-6 h-6 fill-zinc-300 dark:fill-zinc-700", children: /* @__PURE__ */ jsx81("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z" }) }),
+  /* @__PURE__ */ jsx81(
     motion68.div,
     {
       className: "absolute left-0 w-full h-8 bg-gradient-to-b from-transparent to-green-400/30 border-b border-green-500",
@@ -5919,10 +6500,10 @@ var FaceIDScan = () => /* @__PURE__ */ jsxs34("div", { className: "w-12 h-12 bor
 ] });
 
 // .generated/ui/loading/fade-arc.tsx
-import { jsx as jsx76, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx82, jsxs as jsxs41 } from "react/jsx-runtime";
 var FadeArc = () => {
-  return /* @__PURE__ */ jsx76("div", { className: "relative w-9 h-9", children: /* @__PURE__ */ jsxs35("svg", { className: "w-full h-full animate-spin", viewBox: "0 0 50 50", children: [
-    /* @__PURE__ */ jsx76(
+  return /* @__PURE__ */ jsx82("div", { className: "relative w-9 h-9", children: /* @__PURE__ */ jsxs41("svg", { className: "w-full h-full animate-spin", viewBox: "0 0 50 50", children: [
+    /* @__PURE__ */ jsx82(
       "circle",
       {
         className: "stroke-zinc-200 dark:stroke-zinc-800",
@@ -5933,7 +6514,7 @@ var FadeArc = () => {
         strokeWidth: "3.5"
       }
     ),
-    /* @__PURE__ */ jsx76(
+    /* @__PURE__ */ jsx82(
       "circle",
       {
         className: "stroke-zinc-800 dark:stroke-white",
@@ -5952,9 +6533,9 @@ var FadeArc = () => {
 
 // .generated/ui/loading/fade-dots.tsx
 import { motion as motion69 } from "framer-motion";
-import { jsx as jsx77 } from "react/jsx-runtime";
+import { jsx as jsx83 } from "react/jsx-runtime";
 var FadeDots = () => {
-  return /* @__PURE__ */ jsx77("div", { className: "flex space-x-2", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx77(
+  return /* @__PURE__ */ jsx83("div", { className: "flex space-x-2", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx83(
     motion69.div,
     {
       className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -5967,9 +6548,9 @@ var FadeDots = () => {
 
 // .generated/ui/loading/flip-square.tsx
 import { motion as motion70 } from "framer-motion";
-import { jsx as jsx78 } from "react/jsx-runtime";
+import { jsx as jsx84 } from "react/jsx-runtime";
 var FlipSquare = () => {
-  return /* @__PURE__ */ jsx78(
+  return /* @__PURE__ */ jsx84(
     motion70.div,
     {
       className: "w-8 h-8 bg-zinc-800 dark:bg-white rounded-md shadow-sm",
@@ -5981,9 +6562,9 @@ var FlipSquare = () => {
 
 // .generated/ui/loading/floating-diamonds.tsx
 import { motion as motion71 } from "framer-motion";
-import { jsx as jsx79 } from "react/jsx-runtime";
+import { jsx as jsx85 } from "react/jsx-runtime";
 var FloatingDiamonds = () => {
-  return /* @__PURE__ */ jsx79("div", { className: "flex space-x-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsx85("div", { className: "flex space-x-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx85(
     motion71.div,
     {
       className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-sm rotate-45",
@@ -5996,8 +6577,8 @@ var FloatingDiamonds = () => {
 
 // .generated/ui/loading/fluid-bars.tsx
 import { motion as motion72 } from "framer-motion";
-import { jsx as jsx80 } from "react/jsx-runtime";
-var FluidBars = () => /* @__PURE__ */ jsx80("div", { className: "flex space-x-1", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx80(
+import { jsx as jsx86 } from "react/jsx-runtime";
+var FluidBars = () => /* @__PURE__ */ jsx86("div", { className: "flex space-x-1", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx86(
   motion72.div,
   {
     className: "w-1.5 h-8 bg-zinc-800 dark:bg-white rounded-full origin-bottom",
@@ -6009,8 +6590,8 @@ var FluidBars = () => /* @__PURE__ */ jsx80("div", { className: "flex space-x-1"
 
 // .generated/ui/loading/fluid-diamond.tsx
 import { motion as motion73 } from "framer-motion";
-import { jsx as jsx81 } from "react/jsx-runtime";
-var FluidDiamond = () => /* @__PURE__ */ jsx81(
+import { jsx as jsx87 } from "react/jsx-runtime";
+var FluidDiamond = () => /* @__PURE__ */ jsx87(
   motion73.div,
   {
     className: "w-6 h-6 bg-zinc-800 dark:bg-white rounded-sm",
@@ -6022,24 +6603,24 @@ var FluidDiamond = () => /* @__PURE__ */ jsx81(
 
 // .generated/ui/loading/fluid-dot-orbit.tsx
 import { motion as motion74 } from "framer-motion";
-import { jsx as jsx82, jsxs as jsxs36 } from "react/jsx-runtime";
-var FluidDotOrbit = () => /* @__PURE__ */ jsxs36("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
-  /* @__PURE__ */ jsx82("div", { className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full" }),
-  /* @__PURE__ */ jsx82(
+import { jsx as jsx88, jsxs as jsxs42 } from "react/jsx-runtime";
+var FluidDotOrbit = () => /* @__PURE__ */ jsxs42("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
+  /* @__PURE__ */ jsx88("div", { className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full" }),
+  /* @__PURE__ */ jsx88(
     motion74.div,
     {
       className: "absolute inset-0",
       animate: { rotate: 360 },
       transition: { duration: 2, repeat: Infinity, ease: "linear" },
-      children: /* @__PURE__ */ jsx82("div", { className: "w-2 h-2 bg-zinc-500 dark:bg-zinc-350 rounded-full absolute top-1 left-1/2 -ml-1" })
+      children: /* @__PURE__ */ jsx88("div", { className: "w-2 h-2 bg-zinc-500 dark:bg-zinc-350 rounded-full absolute top-1 left-1/2 -ml-1" })
     }
   )
 ] });
 
 // .generated/ui/loading/fluid-skeleton.tsx
 import { motion as motion75 } from "framer-motion";
-import { jsx as jsx83 } from "react/jsx-runtime";
-var FluidSkeleton = () => /* @__PURE__ */ jsx83("div", { className: "w-24 h-10 bg-zinc-200 dark:bg-zinc-800 rounded-xl overflow-hidden relative", children: /* @__PURE__ */ jsx83(
+import { jsx as jsx89 } from "react/jsx-runtime";
+var FluidSkeleton = () => /* @__PURE__ */ jsx89("div", { className: "w-24 h-10 bg-zinc-200 dark:bg-zinc-800 rounded-xl overflow-hidden relative", children: /* @__PURE__ */ jsx89(
   motion75.div,
   {
     className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent",
@@ -6050,10 +6631,10 @@ var FluidSkeleton = () => /* @__PURE__ */ jsx83("div", { className: "w-24 h-10 b
 
 // .generated/ui/loading/gears.tsx
 import { motion as motion76 } from "framer-motion";
-import { jsx as jsx84, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx90, jsxs as jsxs43 } from "react/jsx-runtime";
 var Gears = () => {
-  return /* @__PURE__ */ jsxs37("div", { className: "flex space-x-[-4px]", children: [
-    /* @__PURE__ */ jsx84(
+  return /* @__PURE__ */ jsxs43("div", { className: "flex space-x-[-4px]", children: [
+    /* @__PURE__ */ jsx90(
       motion76.div,
       {
         className: "w-8 h-8 border-4 border-dashed border-zinc-800 dark:border-zinc-700 rounded-full",
@@ -6061,7 +6642,7 @@ var Gears = () => {
         transition: { duration: 4, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx84(
+    /* @__PURE__ */ jsx90(
       motion76.div,
       {
         className: "w-6 h-6 border-[3px] border-dashed border-zinc-500 rounded-full mt-3",
@@ -6074,9 +6655,9 @@ var Gears = () => {
 
 // .generated/ui/loading/glassmorphic-card.tsx
 import { motion as motion77 } from "framer-motion";
-import { jsx as jsx85, jsxs as jsxs38 } from "react/jsx-runtime";
-var GlassmorphicCard = () => /* @__PURE__ */ jsxs38("div", { className: "w-20 h-16 bg-zinc-100 dark:bg-zinc-800/50 backdrop-blur-md border border-white/50 rounded-2xl shadow-sm flex items-center justify-center relative overflow-hidden", children: [
-  /* @__PURE__ */ jsx85(
+import { jsx as jsx91, jsxs as jsxs44 } from "react/jsx-runtime";
+var GlassmorphicCard = () => /* @__PURE__ */ jsxs44("div", { className: "w-20 h-16 bg-zinc-100 dark:bg-zinc-800/50 backdrop-blur-md border border-white/50 rounded-2xl shadow-sm flex items-center justify-center relative overflow-hidden", children: [
+  /* @__PURE__ */ jsx91(
     motion77.div,
     {
       className: "absolute w-12 h-12 bg-zinc-300 dark:bg-zinc-700 rounded-full blur-xl -z-10",
@@ -6084,14 +6665,14 @@ var GlassmorphicCard = () => /* @__PURE__ */ jsxs38("div", { className: "w-20 h-
       transition: { duration: 3, repeat: Infinity, ease: "easeInOut" }
     }
   ),
-  /* @__PURE__ */ jsx85("div", { className: "w-5 h-5 border-2 border-zinc-800 dark:border-zinc-700 border-t-transparent rounded-full animate-spin" })
+  /* @__PURE__ */ jsx91("div", { className: "w-5 h-5 border-2 border-zinc-800 dark:border-zinc-700 border-t-transparent rounded-full animate-spin" })
 ] });
 
 // .generated/ui/loading/gradient-arc.tsx
 import { motion as motion78 } from "framer-motion";
-import { jsx as jsx86 } from "react/jsx-runtime";
+import { jsx as jsx92 } from "react/jsx-runtime";
 var GradientArc = () => {
-  return /* @__PURE__ */ jsx86("div", { className: "relative w-10 h-10 flex items-center justify-center", children: /* @__PURE__ */ jsx86(
+  return /* @__PURE__ */ jsx92("div", { className: "relative w-10 h-10 flex items-center justify-center", children: /* @__PURE__ */ jsx92(
     motion78.div,
     {
       className: "w-10 h-10 rounded-full",
@@ -6108,9 +6689,9 @@ var GradientArc = () => {
 
 // .generated/ui/loading/grid-dots.tsx
 import { motion as motion79 } from "framer-motion";
-import { jsx as jsx87 } from "react/jsx-runtime";
+import { jsx as jsx93 } from "react/jsx-runtime";
 var GridDots = () => {
-  return /* @__PURE__ */ jsx87("div", { className: "grid grid-cols-3 gap-1.5", children: [0, 1, 2, 3, 4, 5, 6, 7, 8].map((i) => /* @__PURE__ */ jsx87(
+  return /* @__PURE__ */ jsx93("div", { className: "grid grid-cols-3 gap-1.5", children: [0, 1, 2, 3, 4, 5, 6, 7, 8].map((i) => /* @__PURE__ */ jsx93(
     motion79.div,
     {
       className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -6123,8 +6704,8 @@ var GridDots = () => {
 
 // .generated/ui/loading/haptic-ring.tsx
 import { motion as motion80 } from "framer-motion";
-import { jsx as jsx88 } from "react/jsx-runtime";
-var HapticRing = () => /* @__PURE__ */ jsx88(
+import { jsx as jsx94 } from "react/jsx-runtime";
+var HapticRing = () => /* @__PURE__ */ jsx94(
   motion80.div,
   {
     className: "w-10 h-10 border-[3px] border-zinc-200 dark:border-zinc-800 rounded-full border-t-zinc-800 dark:border-t-white",
@@ -6135,9 +6716,9 @@ var HapticRing = () => /* @__PURE__ */ jsx88(
 
 // .generated/ui/loading/heartbeat.tsx
 import { motion as motion81 } from "framer-motion";
-import { jsx as jsx89 } from "react/jsx-runtime";
+import { jsx as jsx95 } from "react/jsx-runtime";
 var Heartbeat = () => {
-  return /* @__PURE__ */ jsx89("svg", { className: "w-16 h-8 overflow-visible", viewBox: "0 0 64 32", children: /* @__PURE__ */ jsx89(
+  return /* @__PURE__ */ jsx95("svg", { className: "w-16 h-8 overflow-visible", viewBox: "0 0 64 32", children: /* @__PURE__ */ jsx95(
     motion81.polyline,
     {
       points: "0,16 16,16 24,4 32,28 40,16 64,16",
@@ -6154,11 +6735,11 @@ var Heartbeat = () => {
 
 // .generated/ui/loading/hexagon-spinner.tsx
 import { motion as motion82 } from "framer-motion";
-import { jsx as jsx90, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx96, jsxs as jsxs45 } from "react/jsx-runtime";
 var HexagonSpinner = () => {
-  return /* @__PURE__ */ jsxs39("svg", { className: "w-10 h-10", viewBox: "0 0 50 50", children: [
-    /* @__PURE__ */ jsx90("polygon", { points: "25,5 45,15 45,35 25,45 5,35 5,15", className: "stroke-zinc-200 dark:stroke-zinc-800 fill-none", strokeWidth: "4" }),
-    /* @__PURE__ */ jsx90(
+  return /* @__PURE__ */ jsxs45("svg", { className: "w-10 h-10", viewBox: "0 0 50 50", children: [
+    /* @__PURE__ */ jsx96("polygon", { points: "25,5 45,15 45,35 25,45 5,35 5,15", className: "stroke-zinc-200 dark:stroke-zinc-800 fill-none", strokeWidth: "4" }),
+    /* @__PURE__ */ jsx96(
       motion82.polygon,
       {
         points: "25,5 45,15 45,35 25,45 5,35 5,15",
@@ -6175,17 +6756,17 @@ var HexagonSpinner = () => {
 
 // .generated/ui/loading/hourglass.tsx
 import { motion as motion83 } from "framer-motion";
-import { jsx as jsx91, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx97, jsxs as jsxs46 } from "react/jsx-runtime";
 var Hourglass = () => {
-  return /* @__PURE__ */ jsxs40(
+  return /* @__PURE__ */ jsxs46(
     motion83.div,
     {
       className: "w-8 h-10 flex flex-col items-center justify-between",
       animate: { rotate: [0, 180, 180, 360, 360] },
       transition: { duration: 3, repeat: Infinity, ease: "easeInOut" },
       children: [
-        /* @__PURE__ */ jsx91("div", { className: "w-8 h-0 border-t-[16px] border-t-zinc-800 dark:border-t-white border-l-[16px] border-l-transparent border-r-[16px] border-r-transparent origin-bottom" }),
-        /* @__PURE__ */ jsx91("div", { className: "w-8 h-0 border-b-[16px] border-b-zinc-800 dark:border-b-white border-l-[16px] border-l-transparent border-r-[16px] border-r-transparent origin-top" })
+        /* @__PURE__ */ jsx97("div", { className: "w-8 h-0 border-t-[16px] border-t-zinc-800 dark:border-t-white border-l-[16px] border-l-transparent border-r-[16px] border-r-transparent origin-bottom" }),
+        /* @__PURE__ */ jsx97("div", { className: "w-8 h-0 border-b-[16px] border-b-zinc-800 dark:border-b-white border-l-[16px] border-l-transparent border-r-[16px] border-r-transparent origin-top" })
       ]
     }
   );
@@ -6193,10 +6774,10 @@ var Hourglass = () => {
 
 // .generated/ui/loading/infinity-path.tsx
 import { motion as motion84 } from "framer-motion";
-import { jsx as jsx92, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx98, jsxs as jsxs47 } from "react/jsx-runtime";
 var InfinityPath = () => {
-  return /* @__PURE__ */ jsxs41("svg", { className: "w-12 h-6 overflow-visible", viewBox: "0 0 60 30", children: [
-    /* @__PURE__ */ jsx92(
+  return /* @__PURE__ */ jsxs47("svg", { className: "w-12 h-6 overflow-visible", viewBox: "0 0 60 30", children: [
+    /* @__PURE__ */ jsx98(
       "path",
       {
         d: "M 15 15 C 15 5, 25 5, 30 15 C 35 25, 45 25, 45 15 C 45 5, 35 5, 30 15 C 25 25, 15 25, 15 15",
@@ -6205,7 +6786,7 @@ var InfinityPath = () => {
         strokeLinecap: "round"
       }
     ),
-    /* @__PURE__ */ jsx92(
+    /* @__PURE__ */ jsx98(
       motion84.path,
       {
         d: "M 15 15 C 15 5, 25 5, 30 15 C 35 25, 45 25, 45 15 C 45 5, 35 5, 30 15 C 25 25, 15 25, 15 15",
@@ -6222,10 +6803,10 @@ var InfinityPath = () => {
 
 // .generated/ui/loading/intersecting-rings.tsx
 import { motion as motion85 } from "framer-motion";
-import { jsx as jsx93, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx99, jsxs as jsxs48 } from "react/jsx-runtime";
 var IntersectingRings = () => {
-  return /* @__PURE__ */ jsxs42("div", { className: "relative w-12 h-12 flex items-center justify-center [perspective:800px]", children: [
-    /* @__PURE__ */ jsx93(
+  return /* @__PURE__ */ jsxs48("div", { className: "relative w-12 h-12 flex items-center justify-center [perspective:800px]", children: [
+    /* @__PURE__ */ jsx99(
       motion85.div,
       {
         className: "absolute w-10 h-10 border-2 border-t-zinc-800 dark:border-t-white border-r-zinc-800/30 dark:border-r-white/30 border-b-zinc-800/10 dark:border-b-white/10 border-l-transparent rounded-full",
@@ -6234,7 +6815,7 @@ var IntersectingRings = () => {
         transition: { duration: 2.2, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx93(
+    /* @__PURE__ */ jsx99(
       motion85.div,
       {
         className: "absolute w-10 h-10 border-2 border-b-zinc-800 dark:border-b-white border-t-zinc-800/30 dark:border-t-white/30 border-l-zinc-800/10 dark:border-l-white/10 border-r-transparent rounded-full",
@@ -6248,13 +6829,13 @@ var IntersectingRings = () => {
 
 // .generated/ui/loading/ios-spinner.tsx
 import { motion as motion86 } from "framer-motion";
-import { jsx as jsx94 } from "react/jsx-runtime";
-var IOSSpinner = () => /* @__PURE__ */ jsx94("div", { className: "relative w-8 h-8", children: Array.from({ length: 12 }).map((_, i) => /* @__PURE__ */ jsx94(
+import { jsx as jsx100 } from "react/jsx-runtime";
+var IOSSpinner = () => /* @__PURE__ */ jsx100("div", { className: "relative w-8 h-8", children: Array.from({ length: 12 }).map((_, i) => /* @__PURE__ */ jsx100(
   motion86.div,
   {
     className: "absolute w-full h-full",
     style: { rotate: i * 30 },
-    children: /* @__PURE__ */ jsx94(
+    children: /* @__PURE__ */ jsx100(
       motion86.div,
       {
         className: "w-[2px] h-[7px] bg-zinc-800 dark:bg-white rounded-full mx-auto",
@@ -6268,11 +6849,11 @@ var IOSSpinner = () => /* @__PURE__ */ jsx94("div", { className: "relative w-8 h
 
 // .generated/ui/loading/line-spinner.tsx
 import { motion as motion87 } from "framer-motion";
-import { jsx as jsx95, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx101, jsxs as jsxs49 } from "react/jsx-runtime";
 var LineSpinner = () => {
-  return /* @__PURE__ */ jsxs43("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx95("div", { className: "w-10 h-10 border-2 border-zinc-200 dark:border-zinc-800 rounded-full absolute" }),
-    /* @__PURE__ */ jsx95(
+  return /* @__PURE__ */ jsxs49("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx101("div", { className: "w-10 h-10 border-2 border-zinc-200 dark:border-zinc-800 rounded-full absolute" }),
+    /* @__PURE__ */ jsx101(
       motion87.div,
       {
         className: "w-8 h-1 bg-zinc-800 dark:bg-white rounded-full",
@@ -6285,15 +6866,15 @@ var LineSpinner = () => {
 
 // .generated/ui/loading/liquid-dots.tsx
 import { motion as motion88 } from "framer-motion";
-import { jsx as jsx96, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx102, jsxs as jsxs50 } from "react/jsx-runtime";
 var LiquidDots = () => {
-  return /* @__PURE__ */ jsxs44("div", { className: "relative w-16 h-8 flex items-center justify-center", style: { filter: "url(#goo)" }, children: [
-    /* @__PURE__ */ jsx96("svg", { className: "absolute w-0 h-0", children: /* @__PURE__ */ jsx96("defs", { children: /* @__PURE__ */ jsxs44("filter", { id: "goo", children: [
-      /* @__PURE__ */ jsx96("feGaussianBlur", { in: "SourceGraphic", stdDeviation: "4", result: "blur" }),
-      /* @__PURE__ */ jsx96("feColorMatrix", { in: "blur", mode: "matrix", values: "1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -7", result: "goo" }),
-      /* @__PURE__ */ jsx96("feBlend", { in: "SourceGraphic", in2: "goo" })
+  return /* @__PURE__ */ jsxs50("div", { className: "relative w-16 h-8 flex items-center justify-center", style: { filter: "url(#goo)" }, children: [
+    /* @__PURE__ */ jsx102("svg", { className: "absolute w-0 h-0", children: /* @__PURE__ */ jsx102("defs", { children: /* @__PURE__ */ jsxs50("filter", { id: "goo", children: [
+      /* @__PURE__ */ jsx102("feGaussianBlur", { in: "SourceGraphic", stdDeviation: "4", result: "blur" }),
+      /* @__PURE__ */ jsx102("feColorMatrix", { in: "blur", mode: "matrix", values: "1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -7", result: "goo" }),
+      /* @__PURE__ */ jsx102("feBlend", { in: "SourceGraphic", in2: "goo" })
     ] }) }) }),
-    /* @__PURE__ */ jsx96(
+    /* @__PURE__ */ jsx102(
       motion88.div,
       {
         className: "absolute w-6 h-6 bg-zinc-800 dark:bg-white rounded-full",
@@ -6301,7 +6882,7 @@ var LiquidDots = () => {
         transition: { duration: 2, repeat: Infinity, ease: "easeInOut" }
       }
     ),
-    /* @__PURE__ */ jsx96(
+    /* @__PURE__ */ jsx102(
       motion88.div,
       {
         className: "absolute w-6 h-6 bg-zinc-800 dark:bg-white rounded-full",
@@ -6314,10 +6895,10 @@ var LiquidDots = () => {
 
 // .generated/ui/loading/mac-terminal.tsx
 import { motion as motion89 } from "framer-motion";
-import { jsx as jsx97, jsxs as jsxs45 } from "react/jsx-runtime";
-var MacTerminal = () => /* @__PURE__ */ jsxs45("div", { className: "flex items-center text-zinc-900 dark:text-white font-mono text-sm", children: [
-  /* @__PURE__ */ jsx97("span", { children: "~ %" }),
-  /* @__PURE__ */ jsx97(
+import { jsx as jsx103, jsxs as jsxs51 } from "react/jsx-runtime";
+var MacTerminal = () => /* @__PURE__ */ jsxs51("div", { className: "flex items-center text-zinc-900 dark:text-white font-mono text-sm", children: [
+  /* @__PURE__ */ jsx103("span", { children: "~ %" }),
+  /* @__PURE__ */ jsx103(
     motion89.span,
     {
       className: "ml-1.5 w-2 h-4 bg-zinc-900 dark:bg-white inline-block",
@@ -6329,14 +6910,14 @@ var MacTerminal = () => /* @__PURE__ */ jsxs45("div", { className: "flex items-c
 
 // .generated/ui/loading/magnetic-dots.tsx
 import { motion as motion90 } from "framer-motion";
-import { jsx as jsx98, jsxs as jsxs46 } from "react/jsx-runtime";
-var MagneticDots = () => /* @__PURE__ */ jsxs46("div", { className: "flex space-x-1.5", style: { filter: "url(#goo)" }, children: [
-  /* @__PURE__ */ jsx98("svg", { width: "0", height: "0", className: "absolute hidden", children: /* @__PURE__ */ jsx98("defs", { children: /* @__PURE__ */ jsxs46("filter", { id: "goo", children: [
-    /* @__PURE__ */ jsx98("feGaussianBlur", { in: "SourceGraphic", stdDeviation: "2", result: "blur" }),
-    /* @__PURE__ */ jsx98("feColorMatrix", { in: "blur", mode: "matrix", values: "1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 15 -7", result: "goo" }),
-    /* @__PURE__ */ jsx98("feComposite", { in: "SourceGraphic", in2: "goo", operator: "atop" })
+import { jsx as jsx104, jsxs as jsxs52 } from "react/jsx-runtime";
+var MagneticDots = () => /* @__PURE__ */ jsxs52("div", { className: "flex space-x-1.5", style: { filter: "url(#goo)" }, children: [
+  /* @__PURE__ */ jsx104("svg", { width: "0", height: "0", className: "absolute hidden", children: /* @__PURE__ */ jsx104("defs", { children: /* @__PURE__ */ jsxs52("filter", { id: "goo", children: [
+    /* @__PURE__ */ jsx104("feGaussianBlur", { in: "SourceGraphic", stdDeviation: "2", result: "blur" }),
+    /* @__PURE__ */ jsx104("feColorMatrix", { in: "blur", mode: "matrix", values: "1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 15 -7", result: "goo" }),
+    /* @__PURE__ */ jsx104("feComposite", { in: "SourceGraphic", in2: "goo", operator: "atop" })
   ] }) }) }),
-  /* @__PURE__ */ jsx98(
+  /* @__PURE__ */ jsx104(
     motion90.div,
     {
       className: "w-4 h-4 bg-zinc-800 dark:bg-white rounded-full",
@@ -6344,7 +6925,7 @@ var MagneticDots = () => /* @__PURE__ */ jsxs46("div", { className: "flex space-
       transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" }
     }
   ),
-  /* @__PURE__ */ jsx98(
+  /* @__PURE__ */ jsx104(
     motion90.div,
     {
       className: "w-4 h-4 bg-zinc-800 dark:bg-white rounded-full",
@@ -6356,10 +6937,10 @@ var MagneticDots = () => /* @__PURE__ */ jsxs46("div", { className: "flex space-
 
 // .generated/ui/loading/minimal-triangle.tsx
 import { motion as motion91 } from "framer-motion";
-import { jsx as jsx99, jsxs as jsxs47 } from "react/jsx-runtime";
-var MinimalTriangle = () => /* @__PURE__ */ jsxs47("svg", { className: "w-10 h-10 overflow-visible", viewBox: "0 0 50 50", children: [
-  /* @__PURE__ */ jsx99("polygon", { points: "25,5 45,40 5,40", className: "stroke-zinc-200 dark:stroke-zinc-800 fill-none", strokeWidth: "3" }),
-  /* @__PURE__ */ jsx99(
+import { jsx as jsx105, jsxs as jsxs53 } from "react/jsx-runtime";
+var MinimalTriangle = () => /* @__PURE__ */ jsxs53("svg", { className: "w-10 h-10 overflow-visible", viewBox: "0 0 50 50", children: [
+  /* @__PURE__ */ jsx105("polygon", { points: "25,5 45,40 5,40", className: "stroke-zinc-200 dark:stroke-zinc-800 fill-none", strokeWidth: "3" }),
+  /* @__PURE__ */ jsx105(
     motion91.polygon,
     {
       points: "25,5 45,40 5,40",
@@ -6374,26 +6955,26 @@ var MinimalTriangle = () => /* @__PURE__ */ jsxs47("svg", { className: "w-10 h-1
 
 // .generated/ui/loading/morph-dot-ring.tsx
 import { motion as motion92 } from "framer-motion";
-import { jsx as jsx100 } from "react/jsx-runtime";
-var MorphDotRing = () => /* @__PURE__ */ jsx100(
+import { jsx as jsx106 } from "react/jsx-runtime";
+var MorphDotRing = () => /* @__PURE__ */ jsx106(
   motion92.div,
   {
     className: "grid grid-cols-2 gap-1 w-6 h-6",
     animate: { rotate: 180, gap: ["4px", "0px", "4px"] },
     transition: { duration: 2, repeat: Infinity, ease: "easeInOut" },
-    children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx100("div", { className: "w-full h-full bg-zinc-800 dark:bg-white rounded-full" }, i))
+    children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx106("div", { className: "w-full h-full bg-zinc-800 dark:bg-white rounded-full" }, i))
   }
 );
 
 // .generated/ui/loading/morph-loader.tsx
 import { motion as motion93 } from "framer-motion";
-import { jsx as jsx101 } from "react/jsx-runtime";
+import { jsx as jsx107 } from "react/jsx-runtime";
 function MorphLoader({
   size = 40,
   color = "bg-blue-500",
   className = ""
 }) {
-  return /* @__PURE__ */ jsx101("div", { className: `relative flex items-center justify-center ${className}`, style: { width: size, height: size }, children: /* @__PURE__ */ jsx101(
+  return /* @__PURE__ */ jsx107("div", { className: `relative flex items-center justify-center ${className}`, style: { width: size, height: size }, children: /* @__PURE__ */ jsx107(
     motion93.div,
     {
       animate: {
@@ -6414,14 +6995,14 @@ function MorphLoader({
 
 // .generated/ui/loading/morphing-bars.tsx
 import { motion as motion94 } from "framer-motion";
-import { jsx as jsx102 } from "react/jsx-runtime";
-var MorphingBars = () => /* @__PURE__ */ jsx102(
+import { jsx as jsx108 } from "react/jsx-runtime";
+var MorphingBars = () => /* @__PURE__ */ jsx108(
   motion94.div,
   {
     className: "flex space-x-1 h-8 items-center",
     animate: { gap: ["4px", "0px", "4px"] },
     transition: { duration: 2, repeat: Infinity, ease: "easeInOut" },
-    children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx102(
+    children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx108(
       motion94.div,
       {
         className: "w-2 h-8 bg-zinc-800 dark:bg-white rounded-sm",
@@ -6435,10 +7016,10 @@ var MorphingBars = () => /* @__PURE__ */ jsx102(
 
 // .generated/ui/loading/morphing-infinity.tsx
 import { motion as motion95 } from "framer-motion";
-import { jsx as jsx103, jsxs as jsxs48 } from "react/jsx-runtime";
+import { jsx as jsx109, jsxs as jsxs54 } from "react/jsx-runtime";
 var MorphingInfinity = () => {
-  return /* @__PURE__ */ jsxs48("div", { className: "w-12 h-6 flex justify-between items-center relative", children: [
-    /* @__PURE__ */ jsx103(
+  return /* @__PURE__ */ jsxs54("div", { className: "w-12 h-6 flex justify-between items-center relative", children: [
+    /* @__PURE__ */ jsx109(
       motion95.div,
       {
         className: "w-6 h-6 border-2 border-zinc-800 dark:border-zinc-700 rounded-full",
@@ -6446,7 +7027,7 @@ var MorphingInfinity = () => {
         transition: { duration: 2, repeat: Infinity, ease: "easeInOut" }
       }
     ),
-    /* @__PURE__ */ jsx103(
+    /* @__PURE__ */ jsx109(
       motion95.div,
       {
         className: "w-6 h-6 border-2 border-zinc-800 dark:border-zinc-700 rounded-full absolute top-0 left-0",
@@ -6459,8 +7040,8 @@ var MorphingInfinity = () => {
 
 // .generated/ui/loading/morphing-ring.tsx
 import { motion as motion96 } from "framer-motion";
-import { jsx as jsx104 } from "react/jsx-runtime";
-var MorphingRing = () => /* @__PURE__ */ jsx104(
+import { jsx as jsx110 } from "react/jsx-runtime";
+var MorphingRing = () => /* @__PURE__ */ jsx110(
   motion96.div,
   {
     className: "w-10 h-10 border-[3px] border-zinc-800 dark:border-zinc-700",
@@ -6474,9 +7055,9 @@ var MorphingRing = () => /* @__PURE__ */ jsx104(
 
 // .generated/ui/loading/morphing-shape.tsx
 import { motion as motion97 } from "framer-motion";
-import { jsx as jsx105 } from "react/jsx-runtime";
+import { jsx as jsx111 } from "react/jsx-runtime";
 var MorphingShape = () => {
-  return /* @__PURE__ */ jsx105(
+  return /* @__PURE__ */ jsx111(
     motion97.div,
     {
       className: "w-10 h-10 bg-zinc-800 dark:bg-white shadow-sm",
@@ -6492,10 +7073,10 @@ var MorphingShape = () => {
 
 // .generated/ui/loading/newtons-cradle.tsx
 import { motion as motion98 } from "framer-motion";
-import { jsx as jsx106, jsxs as jsxs49 } from "react/jsx-runtime";
+import { jsx as jsx112, jsxs as jsxs55 } from "react/jsx-runtime";
 var NewtonsCradle = () => {
-  return /* @__PURE__ */ jsxs49("div", { className: "flex items-center justify-center space-x-0.5", children: [
-    /* @__PURE__ */ jsx106(
+  return /* @__PURE__ */ jsxs55("div", { className: "flex items-center justify-center space-x-0.5", children: [
+    /* @__PURE__ */ jsx112(
       motion98.div,
       {
         className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full origin-top",
@@ -6503,9 +7084,9 @@ var NewtonsCradle = () => {
         transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" }
       }
     ),
-    /* @__PURE__ */ jsx106("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full" }),
-    /* @__PURE__ */ jsx106("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full" }),
-    /* @__PURE__ */ jsx106(
+    /* @__PURE__ */ jsx112("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full" }),
+    /* @__PURE__ */ jsx112("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full" }),
+    /* @__PURE__ */ jsx112(
       motion98.div,
       {
         className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full origin-top",
@@ -6518,9 +7099,9 @@ var NewtonsCradle = () => {
 
 // .generated/ui/loading/offset-rings.tsx
 import { motion as motion99 } from "framer-motion";
-import { jsx as jsx107, jsxs as jsxs50 } from "react/jsx-runtime";
-var OffsetRings = () => /* @__PURE__ */ jsxs50("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
-  /* @__PURE__ */ jsx107(
+import { jsx as jsx113, jsxs as jsxs56 } from "react/jsx-runtime";
+var OffsetRings = () => /* @__PURE__ */ jsxs56("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
+  /* @__PURE__ */ jsx113(
     motion99.div,
     {
       className: "absolute w-12 h-12 border-2 border-zinc-800 dark:border-zinc-700 border-x-transparent rounded-full",
@@ -6528,7 +7109,7 @@ var OffsetRings = () => /* @__PURE__ */ jsxs50("div", { className: "relative w-1
       transition: { duration: 2, repeat: Infinity, ease: "easeInOut" }
     }
   ),
-  /* @__PURE__ */ jsx107(
+  /* @__PURE__ */ jsx113(
     motion99.div,
     {
       className: "absolute w-8 h-8 border-2 border-zinc-500 border-y-transparent rounded-full",
@@ -6540,17 +7121,17 @@ var OffsetRings = () => /* @__PURE__ */ jsxs50("div", { className: "relative w-1
 
 // .generated/ui/loading/orbiting-circles.tsx
 import { motion as motion100 } from "framer-motion";
-import { jsx as jsx108, jsxs as jsxs51 } from "react/jsx-runtime";
+import { jsx as jsx114, jsxs as jsxs57 } from "react/jsx-runtime";
 var OrbitingCircles = () => {
-  return /* @__PURE__ */ jsxs51("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx108("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full" }),
-    [0, 1].map((i) => /* @__PURE__ */ jsx108(
+  return /* @__PURE__ */ jsxs57("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx114("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full" }),
+    [0, 1].map((i) => /* @__PURE__ */ jsx114(
       motion100.div,
       {
         className: "absolute w-full h-full",
         animate: { rotate: i === 0 ? 360 : -360 },
         transition: { duration: 2, repeat: Infinity, ease: "linear" },
-        children: /* @__PURE__ */ jsx108("div", { className: "absolute top-0 left-1/2 -ml-1 w-2 h-2 bg-zinc-500 dark:bg-zinc-350 rounded-full" })
+        children: /* @__PURE__ */ jsx114("div", { className: "absolute top-0 left-1/2 -ml-1 w-2 h-2 bg-zinc-500 dark:bg-zinc-350 rounded-full" })
       },
       i
     ))
@@ -6559,17 +7140,17 @@ var OrbitingCircles = () => {
 
 // .generated/ui/loading/orbiting-dot.tsx
 import { motion as motion101 } from "framer-motion";
-import { jsx as jsx109, jsxs as jsxs52 } from "react/jsx-runtime";
+import { jsx as jsx115, jsxs as jsxs58 } from "react/jsx-runtime";
 var OrbitingDot = () => {
-  return /* @__PURE__ */ jsxs52("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx109("div", { className: "w-2 h-2 bg-zinc-300 dark:bg-zinc-700 rounded-full" }),
-    /* @__PURE__ */ jsx109(
+  return /* @__PURE__ */ jsxs58("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx115("div", { className: "w-2 h-2 bg-zinc-300 dark:bg-zinc-700 rounded-full" }),
+    /* @__PURE__ */ jsx115(
       motion101.div,
       {
         className: "absolute w-full h-full border border-zinc-200 dark:border-zinc-800 rounded-full",
         animate: { rotate: 360 },
         transition: { duration: 2, repeat: Infinity, ease: "linear" },
-        children: /* @__PURE__ */ jsx109("div", { className: "absolute top-0 left-1/2 -ml-1.5 -mt-1.5 w-3 h-3 bg-zinc-800 dark:bg-white rounded-full shadow-sm" })
+        children: /* @__PURE__ */ jsx115("div", { className: "absolute top-0 left-1/2 -ml-1.5 -mt-1.5 w-3 h-3 bg-zinc-800 dark:bg-white rounded-full shadow-sm" })
       }
     )
   ] });
@@ -6577,9 +7158,9 @@ var OrbitingDot = () => {
 
 // .generated/ui/loading/origami-shape.tsx
 import { motion as motion102 } from "framer-motion";
-import { jsx as jsx110, jsxs as jsxs53 } from "react/jsx-runtime";
-var OrigamiShape = () => /* @__PURE__ */ jsxs53("div", { className: "relative w-10 h-10", children: [
-  /* @__PURE__ */ jsx110(
+import { jsx as jsx116, jsxs as jsxs59 } from "react/jsx-runtime";
+var OrigamiShape = () => /* @__PURE__ */ jsxs59("div", { className: "relative w-10 h-10", children: [
+  /* @__PURE__ */ jsx116(
     motion102.div,
     {
       className: "absolute top-0 left-0 w-5 h-5 bg-zinc-800 dark:bg-white rounded-tl-md",
@@ -6588,7 +7169,7 @@ var OrigamiShape = () => /* @__PURE__ */ jsxs53("div", { className: "relative w-
       transition: { duration: 2, repeat: Infinity, ease: "easeInOut" }
     }
   ),
-  /* @__PURE__ */ jsx110(
+  /* @__PURE__ */ jsx116(
     motion102.div,
     {
       className: "absolute bottom-0 right-0 w-5 h-5 bg-zinc-500 dark:bg-zinc-350 rounded-br-md",
@@ -6601,19 +7182,19 @@ var OrigamiShape = () => /* @__PURE__ */ jsxs53("div", { className: "relative w-
 
 // .generated/ui/loading/pendulum.tsx
 import { motion as motion103 } from "framer-motion";
-import { jsx as jsx111, jsxs as jsxs54 } from "react/jsx-runtime";
+import { jsx as jsx117, jsxs as jsxs60 } from "react/jsx-runtime";
 var Pendulum = () => {
-  return /* @__PURE__ */ jsxs54("div", { className: "relative w-16 h-12 flex items-start justify-center", children: [
-    /* @__PURE__ */ jsx111("div", { className: "w-full h-1 bg-zinc-200 dark:bg-zinc-800 rounded-full rounded-b-none absolute top-0" }),
-    /* @__PURE__ */ jsxs54(
+  return /* @__PURE__ */ jsxs60("div", { className: "relative w-16 h-12 flex items-start justify-center", children: [
+    /* @__PURE__ */ jsx117("div", { className: "w-full h-1 bg-zinc-200 dark:bg-zinc-800 rounded-full rounded-b-none absolute top-0" }),
+    /* @__PURE__ */ jsxs60(
       motion103.div,
       {
         className: "absolute top-0 w-1 bg-zinc-800 dark:bg-white origin-top flex flex-col items-center",
         animate: { rotate: [-45, 45, -45] },
         transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" },
         children: [
-          /* @__PURE__ */ jsx111("div", { className: "w-1 h-8 bg-zinc-800 dark:bg-white" }),
-          /* @__PURE__ */ jsx111("div", { className: "w-4 h-4 bg-zinc-800 dark:bg-white rounded-full" })
+          /* @__PURE__ */ jsx117("div", { className: "w-1 h-8 bg-zinc-800 dark:bg-white" }),
+          /* @__PURE__ */ jsx117("div", { className: "w-4 h-4 bg-zinc-800 dark:bg-white rounded-full" })
         ]
       }
     )
@@ -6622,9 +7203,9 @@ var Pendulum = () => {
 
 // .generated/ui/loading/pulsating-dots.tsx
 import { motion as motion104 } from "framer-motion";
-import { jsx as jsx112 } from "react/jsx-runtime";
+import { jsx as jsx118 } from "react/jsx-runtime";
 var PulsatingDots = () => {
-  return /* @__PURE__ */ jsx112("div", { className: "flex space-x-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx112(
+  return /* @__PURE__ */ jsx118("div", { className: "flex space-x-2", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx118(
     motion104.div,
     {
       className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full",
@@ -6637,10 +7218,10 @@ var PulsatingDots = () => {
 
 // .generated/ui/loading/pulse-dot.tsx
 import { motion as motion105 } from "framer-motion";
-import { jsx as jsx113, jsxs as jsxs55 } from "react/jsx-runtime";
+import { jsx as jsx119, jsxs as jsxs61 } from "react/jsx-runtime";
 var PulseDot = () => {
-  return /* @__PURE__ */ jsxs55("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx113(
+  return /* @__PURE__ */ jsxs61("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx119(
       motion105.div,
       {
         className: "absolute w-10 h-10 bg-zinc-800 dark:bg-white rounded-full",
@@ -6648,15 +7229,15 @@ var PulseDot = () => {
         transition: { duration: 1.5, repeat: Infinity, ease: "easeOut" }
       }
     ),
-    /* @__PURE__ */ jsx113("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full relative z-10" })
+    /* @__PURE__ */ jsx119("div", { className: "w-3 h-3 bg-zinc-800 dark:bg-white rounded-full relative z-10" })
   ] });
 };
 
 // .generated/ui/loading/pulse-dots.tsx
 import { motion as motion106 } from "framer-motion";
-import { jsx as jsx114 } from "react/jsx-runtime";
+import { jsx as jsx120 } from "react/jsx-runtime";
 var PulseDots = () => {
-  return /* @__PURE__ */ jsx114("div", { className: "flex space-x-1.5", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx114(
+  return /* @__PURE__ */ jsx120("div", { className: "flex space-x-1.5", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx120(
     motion106.div,
     {
       className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -6669,9 +7250,9 @@ var PulseDots = () => {
 
 // .generated/ui/loading/pulse-square.tsx
 import { motion as motion107 } from "framer-motion";
-import { jsx as jsx115 } from "react/jsx-runtime";
+import { jsx as jsx121 } from "react/jsx-runtime";
 var PulseSquare = () => {
-  return /* @__PURE__ */ jsx115(
+  return /* @__PURE__ */ jsx121(
     motion107.div,
     {
       className: "w-8 h-8 border-4 border-zinc-800 dark:border-zinc-700 rounded-md",
@@ -6683,15 +7264,15 @@ var PulseSquare = () => {
 
 // .generated/ui/loading/pulse.tsx
 import { motion as motion108 } from "framer-motion";
-import { jsx as jsx116, jsxs as jsxs56 } from "react/jsx-runtime";
+import { jsx as jsx122, jsxs as jsxs62 } from "react/jsx-runtime";
 function Pulse({
   size = 12,
   color = "bg-blue-500",
   className = ""
 }) {
-  return /* @__PURE__ */ jsxs56("div", { className: `relative flex items-center justify-center ${className}`, style: { width: size, height: size }, children: [
-    /* @__PURE__ */ jsx116("span", { className: `absolute w-full h-full rounded-full ${color}` }),
-    /* @__PURE__ */ jsx116(
+  return /* @__PURE__ */ jsxs62("div", { className: `relative flex items-center justify-center ${className}`, style: { width: size, height: size }, children: [
+    /* @__PURE__ */ jsx122("span", { className: `absolute w-full h-full rounded-full ${color}` }),
+    /* @__PURE__ */ jsx122(
       motion108.span,
       {
         initial: { scale: 1, opacity: 0.5 },
@@ -6704,7 +7285,7 @@ function Pulse({
         className: `absolute w-full h-full rounded-full ${color} opacity-40`
       }
     ),
-    /* @__PURE__ */ jsx116(
+    /* @__PURE__ */ jsx122(
       motion108.span,
       {
         initial: { scale: 1, opacity: 0.5 },
@@ -6723,29 +7304,29 @@ function Pulse({
 
 // .generated/ui/loading/pumping-heart.tsx
 import { motion as motion109 } from "framer-motion";
-import { jsx as jsx117 } from "react/jsx-runtime";
+import { jsx as jsx123 } from "react/jsx-runtime";
 var PumpingHeart = () => {
-  return /* @__PURE__ */ jsx117(
+  return /* @__PURE__ */ jsx123(
     motion109.div,
     {
       className: "w-8 h-8",
       animate: { scale: [1, 1.25, 1, 1.25, 1] },
       transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" },
-      children: /* @__PURE__ */ jsx117("svg", { viewBox: "0 0 24 24", className: "fill-zinc-800 dark:fill-white", children: /* @__PURE__ */ jsx117("path", { d: "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" }) })
+      children: /* @__PURE__ */ jsx123("svg", { viewBox: "0 0 24 24", className: "fill-zinc-800 dark:fill-white", children: /* @__PURE__ */ jsx123("path", { d: "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" }) })
     }
   );
 };
 
 // .generated/ui/loading/radar-sweep.tsx
 import { motion as motion110 } from "framer-motion";
-import { jsx as jsx118, jsxs as jsxs57 } from "react/jsx-runtime";
+import { jsx as jsx124, jsxs as jsxs63 } from "react/jsx-runtime";
 var RadarSweep = ({ theme = "light" }) => {
   const isDark = theme === "dark";
-  return /* @__PURE__ */ jsxs57("div", { className: "relative w-12 h-12 rounded-full border border-zinc-800/10 dark:border-white/10 flex items-center justify-center overflow-hidden", children: [
-    /* @__PURE__ */ jsx118("div", { className: "absolute w-8 h-8 rounded-full border border-zinc-800/5 dark:border-white/5" }),
-    /* @__PURE__ */ jsx118("div", { className: "absolute w-4 h-4 rounded-full border border-zinc-800/5 dark:border-white/5" }),
-    /* @__PURE__ */ jsx118("div", { className: "absolute w-1.5 h-1.5 rounded-full bg-zinc-800/80 dark:bg-white/80" }),
-    /* @__PURE__ */ jsx118(
+  return /* @__PURE__ */ jsxs63("div", { className: "relative w-12 h-12 rounded-full border border-zinc-800/10 dark:border-white/10 flex items-center justify-center overflow-hidden", children: [
+    /* @__PURE__ */ jsx124("div", { className: "absolute w-8 h-8 rounded-full border border-zinc-800/5 dark:border-white/5" }),
+    /* @__PURE__ */ jsx124("div", { className: "absolute w-4 h-4 rounded-full border border-zinc-800/5 dark:border-white/5" }),
+    /* @__PURE__ */ jsx124("div", { className: "absolute w-1.5 h-1.5 rounded-full bg-zinc-800/80 dark:bg-white/80" }),
+    /* @__PURE__ */ jsx124(
       motion110.div,
       {
         className: "absolute inset-0 origin-center",
@@ -6761,9 +7342,9 @@ var RadarSweep = ({ theme = "light" }) => {
 
 // .generated/ui/loading/ring-sweep.tsx
 import { motion as motion111 } from "framer-motion";
-import { jsx as jsx119 } from "react/jsx-runtime";
+import { jsx as jsx125 } from "react/jsx-runtime";
 var RingSweep = () => {
-  return /* @__PURE__ */ jsx119(
+  return /* @__PURE__ */ jsx125(
     motion111.div,
     {
       className: "w-10 h-10 border-[3px] border-zinc-200 dark:border-zinc-800 rounded-full border-t-zinc-800 dark:border-t-white",
@@ -6775,11 +7356,11 @@ var RingSweep = () => {
 
 // .generated/ui/loading/ripple-effect.tsx
 import { motion as motion112 } from "framer-motion";
-import { jsx as jsx120, jsxs as jsxs58 } from "react/jsx-runtime";
+import { jsx as jsx126, jsxs as jsxs64 } from "react/jsx-runtime";
 var RippleEffect = () => {
-  return /* @__PURE__ */ jsxs58("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx120("div", { className: "absolute w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full" }),
-    [0, 1, 2].map((i) => /* @__PURE__ */ jsx120(
+  return /* @__PURE__ */ jsxs64("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx126("div", { className: "absolute w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full" }),
+    [0, 1, 2].map((i) => /* @__PURE__ */ jsx126(
       motion112.div,
       {
         className: "absolute w-8 h-8 border border-zinc-850 dark:border-white rounded-full",
@@ -6799,17 +7380,17 @@ var RippleEffect = () => {
 
 // .generated/ui/loading/rotating-cross.tsx
 import { motion as motion113 } from "framer-motion";
-import { jsx as jsx121, jsxs as jsxs59 } from "react/jsx-runtime";
+import { jsx as jsx127, jsxs as jsxs65 } from "react/jsx-runtime";
 var RotatingCross = () => {
-  return /* @__PURE__ */ jsxs59(
+  return /* @__PURE__ */ jsxs65(
     motion113.div,
     {
       className: "relative w-8 h-8 flex items-center justify-center",
       animate: { rotate: 180 },
       transition: { duration: 0.8, repeat: Infinity, ease: "easeInOut" },
       children: [
-        /* @__PURE__ */ jsx121("div", { className: "absolute w-full h-1.5 bg-zinc-800 dark:bg-white rounded-sm" }),
-        /* @__PURE__ */ jsx121("div", { className: "absolute h-full w-1.5 bg-zinc-800 dark:bg-white rounded-sm" })
+        /* @__PURE__ */ jsx127("div", { className: "absolute w-full h-1.5 bg-zinc-800 dark:bg-white rounded-sm" }),
+        /* @__PURE__ */ jsx127("div", { className: "absolute h-full w-1.5 bg-zinc-800 dark:bg-white rounded-sm" })
       ]
     }
   );
@@ -6817,9 +7398,9 @@ var RotatingCross = () => {
 
 // .generated/ui/loading/rotating-triangle.tsx
 import { motion as motion114 } from "framer-motion";
-import { jsx as jsx122 } from "react/jsx-runtime";
+import { jsx as jsx128 } from "react/jsx-runtime";
 var RotatingTriangle = () => {
-  return /* @__PURE__ */ jsx122("svg", { className: "w-10 h-10 overflow-visible", viewBox: "0 0 50 50", children: /* @__PURE__ */ jsx122(
+  return /* @__PURE__ */ jsx128("svg", { className: "w-10 h-10 overflow-visible", viewBox: "0 0 50 50", children: /* @__PURE__ */ jsx128(
     motion114.polygon,
     {
       points: "25,5 45,40 5,40",
@@ -6834,8 +7415,8 @@ var RotatingTriangle = () => {
 
 // .generated/ui/loading/shape-shift-grid.tsx
 import { motion as motion115 } from "framer-motion";
-import { jsx as jsx123 } from "react/jsx-runtime";
-var ShapeShiftGrid = () => /* @__PURE__ */ jsx123("div", { className: "grid grid-cols-2 gap-1 w-8 h-8", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx123(
+import { jsx as jsx129 } from "react/jsx-runtime";
+var ShapeShiftGrid = () => /* @__PURE__ */ jsx129("div", { className: "grid grid-cols-2 gap-1 w-8 h-8", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx129(
   motion115.div,
   {
     className: "w-full h-full bg-zinc-800 dark:bg-white",
@@ -6847,9 +7428,9 @@ var ShapeShiftGrid = () => /* @__PURE__ */ jsx123("div", { className: "grid grid
 
 // .generated/ui/loading/shimmer-line.tsx
 import { motion as motion116 } from "framer-motion";
-import { jsx as jsx124 } from "react/jsx-runtime";
+import { jsx as jsx130 } from "react/jsx-runtime";
 var ShimmerLine = () => {
-  return /* @__PURE__ */ jsx124("div", { className: "w-24 h-1 bg-zinc-200 dark:bg-zinc-800 rounded-full overflow-hidden relative", children: /* @__PURE__ */ jsx124(
+  return /* @__PURE__ */ jsx130("div", { className: "w-24 h-1 bg-zinc-200 dark:bg-zinc-800 rounded-full overflow-hidden relative", children: /* @__PURE__ */ jsx130(
     motion116.div,
     {
       className: "absolute top-0 left-0 bottom-0 w-1/3 bg-zinc-800 dark:bg-white rounded-full",
@@ -6861,8 +7442,8 @@ var ShimmerLine = () => {
 
 // .generated/ui/loading/siri-wave.tsx
 import { motion as motion117 } from "framer-motion";
-import { jsx as jsx125 } from "react/jsx-runtime";
-var SiriWave = () => /* @__PURE__ */ jsx125("div", { className: "flex space-x-1 items-center h-8", children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx125(
+import { jsx as jsx131 } from "react/jsx-runtime";
+var SiriWave = () => /* @__PURE__ */ jsx131("div", { className: "flex space-x-1 items-center h-8", children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx131(
   motion117.div,
   {
     className: "w-1 bg-zinc-800 dark:bg-white rounded-full",
@@ -6874,11 +7455,11 @@ var SiriWave = () => /* @__PURE__ */ jsx125("div", { className: "flex space-x-1
 
 // .generated/ui/loading/skeleton-loader.tsx
 import { motion as motion118 } from "framer-motion";
-import { jsx as jsx126, jsxs as jsxs60 } from "react/jsx-runtime";
+import { jsx as jsx132, jsxs as jsxs66 } from "react/jsx-runtime";
 var SkeletonLoader = () => {
-  return /* @__PURE__ */ jsxs60("div", { className: "w-full max-w-[120px] space-y-2", children: [
-    /* @__PURE__ */ jsxs60("div", { className: "flex items-center space-x-2", children: [
-      /* @__PURE__ */ jsx126(
+  return /* @__PURE__ */ jsxs66("div", { className: "w-full max-w-[120px] space-y-2", children: [
+    /* @__PURE__ */ jsxs66("div", { className: "flex items-center space-x-2", children: [
+      /* @__PURE__ */ jsx132(
         motion118.div,
         {
           className: "w-8 h-8 bg-zinc-200 dark:bg-zinc-800 rounded-full shrink-0",
@@ -6886,7 +7467,7 @@ var SkeletonLoader = () => {
           transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" }
         }
       ),
-      /* @__PURE__ */ jsx126(
+      /* @__PURE__ */ jsx132(
         motion118.div,
         {
           className: "h-3 bg-zinc-200 dark:bg-zinc-800 rounded-full w-full",
@@ -6895,7 +7476,7 @@ var SkeletonLoader = () => {
         }
       )
     ] }),
-    /* @__PURE__ */ jsx126(
+    /* @__PURE__ */ jsx132(
       motion118.div,
       {
         className: "h-2 bg-zinc-200 dark:bg-zinc-800 rounded-full w-full",
@@ -6903,7 +7484,7 @@ var SkeletonLoader = () => {
         transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut", delay: 0.4 }
       }
     ),
-    /* @__PURE__ */ jsx126(
+    /* @__PURE__ */ jsx132(
       motion118.div,
       {
         className: "h-2 bg-zinc-200 dark:bg-zinc-800 rounded-full w-4/5",
@@ -6916,18 +7497,18 @@ var SkeletonLoader = () => {
 
 // .generated/ui/loading/skeleton.tsx
 import { motion as motion119 } from "framer-motion";
-import { jsx as jsx127 } from "react/jsx-runtime";
+import { jsx as jsx133 } from "react/jsx-runtime";
 function Skeleton({
   className = "",
   shimmerColor = "dark"
 }) {
   const isDark = shimmerColor === "dark";
   const shimmerGradient = isDark ? "linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.05) 50%, rgba(255,255,255,0) 100%)" : "linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.04) 50%, rgba(0,0,0,0) 100%)";
-  return /* @__PURE__ */ jsx127(
+  return /* @__PURE__ */ jsx133(
     "div",
     {
       className: `relative overflow-hidden rounded-md bg-neutral-200/50 dark:bg-neutral-800/40 ${className}`,
-      children: /* @__PURE__ */ jsx127(
+      children: /* @__PURE__ */ jsx133(
         motion119.div,
         {
           initial: { x: "-150%" },
@@ -6949,9 +7530,9 @@ function Skeleton({
 
 // .generated/ui/loading/sliding-bars.tsx
 import { motion as motion120 } from "framer-motion";
-import { jsx as jsx128, jsxs as jsxs61 } from "react/jsx-runtime";
-var SlidingBars = () => /* @__PURE__ */ jsxs61("div", { className: "relative w-8 h-8", children: [
-  /* @__PURE__ */ jsx128(
+import { jsx as jsx134, jsxs as jsxs67 } from "react/jsx-runtime";
+var SlidingBars = () => /* @__PURE__ */ jsxs67("div", { className: "relative w-8 h-8", children: [
+  /* @__PURE__ */ jsx134(
     motion120.div,
     {
       className: "absolute top-0 left-0 w-8 h-1.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -6959,7 +7540,7 @@ var SlidingBars = () => /* @__PURE__ */ jsxs61("div", { className: "relative w-8
       transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" }
     }
   ),
-  /* @__PURE__ */ jsx128(
+  /* @__PURE__ */ jsx134(
     motion120.div,
     {
       className: "absolute bottom-0 left-0 w-8 h-1.5 bg-zinc-400 dark:bg-zinc-200 rounded-full",
@@ -6971,9 +7552,9 @@ var SlidingBars = () => /* @__PURE__ */ jsxs61("div", { className: "relative w-8
 
 // .generated/ui/loading/smooth-dot-shift.tsx
 import { motion as motion121 } from "framer-motion";
-import { jsx as jsx129, jsxs as jsxs62 } from "react/jsx-runtime";
-var SmoothDotShift = () => /* @__PURE__ */ jsxs62("div", { className: "relative w-12 h-3 flex items-center", children: [
-  /* @__PURE__ */ jsx129(
+import { jsx as jsx135, jsxs as jsxs68 } from "react/jsx-runtime";
+var SmoothDotShift = () => /* @__PURE__ */ jsxs68("div", { className: "relative w-12 h-3 flex items-center", children: [
+  /* @__PURE__ */ jsx135(
     motion121.div,
     {
       className: "absolute w-3 h-3 bg-zinc-800 dark:bg-white rounded-full z-10",
@@ -6981,15 +7562,15 @@ var SmoothDotShift = () => /* @__PURE__ */ jsxs62("div", { className: "relative
       transition: { duration: 2, repeat: Infinity, ease: "easeInOut" }
     }
   ),
-  /* @__PURE__ */ jsx129("div", { className: "w-3 h-3 bg-zinc-300 dark:bg-zinc-700 rounded-full absolute left-0" }),
-  /* @__PURE__ */ jsx129("div", { className: "w-3 h-3 bg-zinc-300 dark:bg-zinc-700 rounded-full absolute left-[18px]" }),
-  /* @__PURE__ */ jsx129("div", { className: "w-3 h-3 bg-zinc-300 dark:bg-zinc-700 rounded-full absolute left-[36px]" })
+  /* @__PURE__ */ jsx135("div", { className: "w-3 h-3 bg-zinc-300 dark:bg-zinc-700 rounded-full absolute left-0" }),
+  /* @__PURE__ */ jsx135("div", { className: "w-3 h-3 bg-zinc-300 dark:bg-zinc-700 rounded-full absolute left-[18px]" }),
+  /* @__PURE__ */ jsx135("div", { className: "w-3 h-3 bg-zinc-300 dark:bg-zinc-700 rounded-full absolute left-[36px]" })
 ] });
 
 // .generated/ui/loading/smooth-ring.tsx
-import { jsx as jsx130, jsxs as jsxs63 } from "react/jsx-runtime";
-var SmoothRing = () => /* @__PURE__ */ jsx130("div", { className: "w-9 h-9", children: /* @__PURE__ */ jsxs63("svg", { className: "w-full h-full animate-spin", viewBox: "0 0 32 32", children: [
-  /* @__PURE__ */ jsx130(
+import { jsx as jsx136, jsxs as jsxs69 } from "react/jsx-runtime";
+var SmoothRing = () => /* @__PURE__ */ jsx136("div", { className: "w-9 h-9", children: /* @__PURE__ */ jsxs69("svg", { className: "w-full h-full animate-spin", viewBox: "0 0 32 32", children: [
+  /* @__PURE__ */ jsx136(
     "circle",
     {
       cx: "16",
@@ -7000,7 +7581,7 @@ var SmoothRing = () => /* @__PURE__ */ jsx130("div", { className: "w-9 h-9", chi
       className: "stroke-zinc-200 dark:stroke-zinc-800"
     }
   ),
-  /* @__PURE__ */ jsx130(
+  /* @__PURE__ */ jsx136(
     "circle",
     {
       cx: "16",
@@ -7017,8 +7598,8 @@ var SmoothRing = () => /* @__PURE__ */ jsx130("div", { className: "w-9 h-9", chi
 
 // .generated/ui/loading/smooth-rounded-square.tsx
 import { motion as motion122 } from "framer-motion";
-import { jsx as jsx131 } from "react/jsx-runtime";
-var SmoothRoundedSquare = () => /* @__PURE__ */ jsx131(
+import { jsx as jsx137 } from "react/jsx-runtime";
+var SmoothRoundedSquare = () => /* @__PURE__ */ jsx137(
   motion122.div,
   {
     className: "w-10 h-10 border-[3px] border-zinc-800 dark:border-zinc-700",
@@ -7029,10 +7610,10 @@ var SmoothRoundedSquare = () => /* @__PURE__ */ jsx131(
 
 // .generated/ui/loading/spinning-squares.tsx
 import { motion as motion123 } from "framer-motion";
-import { jsx as jsx132, jsxs as jsxs64 } from "react/jsx-runtime";
+import { jsx as jsx138, jsxs as jsxs70 } from "react/jsx-runtime";
 var SpinningSquares = () => {
-  return /* @__PURE__ */ jsxs64("div", { className: "relative w-10 h-10", children: [
-    /* @__PURE__ */ jsx132(
+  return /* @__PURE__ */ jsxs70("div", { className: "relative w-10 h-10", children: [
+    /* @__PURE__ */ jsx138(
       motion123.div,
       {
         className: "absolute top-0 left-0 w-4 h-4 bg-zinc-800 dark:bg-white rounded-sm",
@@ -7040,7 +7621,7 @@ var SpinningSquares = () => {
         transition: { duration: 2, repeat: Infinity, ease: "easeInOut" }
       }
     ),
-    /* @__PURE__ */ jsx132(
+    /* @__PURE__ */ jsx138(
       motion123.div,
       {
         className: "absolute bottom-0 right-0 w-4 h-4 bg-zinc-300 dark:bg-zinc-700 rounded-sm",
@@ -7053,9 +7634,9 @@ var SpinningSquares = () => {
 
 // .generated/ui/loading/spiral-spinner.tsx
 import { motion as motion124 } from "framer-motion";
-import { jsx as jsx133 } from "react/jsx-runtime";
+import { jsx as jsx139 } from "react/jsx-runtime";
 var SpiralSpinner = () => {
-  return /* @__PURE__ */ jsx133(
+  return /* @__PURE__ */ jsx139(
     motion124.div,
     {
       className: "w-10 h-10 border-[3px] border-zinc-800 dark:border-zinc-700 rounded-full border-t-transparent",
@@ -7067,8 +7648,8 @@ var SpiralSpinner = () => {
 
 // .generated/ui/loading/spring-bars.tsx
 import { motion as motion125 } from "framer-motion";
-import { jsx as jsx134 } from "react/jsx-runtime";
-var SpringBars = () => /* @__PURE__ */ jsx134("div", { className: "flex flex-col space-y-2 w-10 justify-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx134(
+import { jsx as jsx140 } from "react/jsx-runtime";
+var SpringBars = () => /* @__PURE__ */ jsx140("div", { className: "flex flex-col space-y-2 w-10 justify-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx140(
   motion125.div,
   {
     className: "h-1.5 bg-zinc-800 dark:bg-white rounded-full origin-left",
@@ -7085,9 +7666,9 @@ var SpringBars = () => /* @__PURE__ */ jsx134("div", { className: "flex flex-col
 
 // .generated/ui/loading/spring-dot-matrix.tsx
 import { motion as motion126 } from "framer-motion";
-import { jsx as jsx135 } from "react/jsx-runtime";
+import { jsx as jsx141 } from "react/jsx-runtime";
 var SpringDotMatrix = () => {
-  return /* @__PURE__ */ jsx135("div", { className: "grid grid-cols-3 gap-2.5", children: Array.from({ length: 9 }).map((_, i) => /* @__PURE__ */ jsx135(
+  return /* @__PURE__ */ jsx141("div", { className: "grid grid-cols-3 gap-2.5", children: Array.from({ length: 9 }).map((_, i) => /* @__PURE__ */ jsx141(
     motion126.div,
     {
       className: "w-2 h-2 bg-zinc-800 dark:bg-white rounded-full",
@@ -7105,23 +7686,23 @@ var SpringDotMatrix = () => {
 
 // .generated/ui/loading/spring-hexagon.tsx
 import { motion as motion127 } from "framer-motion";
-import { jsx as jsx136 } from "react/jsx-runtime";
-var SpringHexagon = () => /* @__PURE__ */ jsx136(
+import { jsx as jsx142 } from "react/jsx-runtime";
+var SpringHexagon = () => /* @__PURE__ */ jsx142(
   motion127.svg,
   {
     className: "w-10 h-10",
     viewBox: "0 0 50 50",
     animate: { scale: [1, 1.15, 1], rotate: [0, 60, 60] },
     transition: { duration: 2, repeat: Infinity, type: "spring", bounce: 0.3 },
-    children: /* @__PURE__ */ jsx136("polygon", { points: "25,5 45,15 45,35 25,45 5,35 5,15", className: "fill-zinc-800 dark:fill-white" })
+    children: /* @__PURE__ */ jsx142("polygon", { points: "25,5 45,15 45,35 25,45 5,35 5,15", className: "fill-zinc-800 dark:fill-white" })
   }
 );
 
 // .generated/ui/loading/spring-ring-expand.tsx
 import { motion as motion128 } from "framer-motion";
-import { jsx as jsx137 } from "react/jsx-runtime";
+import { jsx as jsx143 } from "react/jsx-runtime";
 var SpringRingExpand = () => {
-  return /* @__PURE__ */ jsx137("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [0, 1].map((i) => /* @__PURE__ */ jsx137(
+  return /* @__PURE__ */ jsx143("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [0, 1].map((i) => /* @__PURE__ */ jsx143(
     motion128.div,
     {
       className: "absolute w-10 h-10 border-2 border-zinc-800 dark:border-white rounded-full",
@@ -7140,10 +7721,10 @@ var SpringRingExpand = () => {
 
 // .generated/ui/loading/spring-text-pop.tsx
 import { motion as motion129 } from "framer-motion";
-import { jsx as jsx138 } from "react/jsx-runtime";
+import { jsx as jsx144 } from "react/jsx-runtime";
 var SpringTextPop = () => {
   const text = "Loading...";
-  return /* @__PURE__ */ jsx138("div", { className: "flex font-medium text-sm tracking-widest text-zinc-800 dark:text-white", children: text.split("").map((char, i) => /* @__PURE__ */ jsx138(
+  return /* @__PURE__ */ jsx144("div", { className: "flex font-medium text-sm tracking-widest text-zinc-800 dark:text-white", children: text.split("").map((char, i) => /* @__PURE__ */ jsx144(
     motion129.span,
     {
       className: "origin-bottom inline-block",
@@ -7162,9 +7743,9 @@ var SpringTextPop = () => {
 
 // .generated/ui/loading/square-accordion.tsx
 import { motion as motion130 } from "framer-motion";
-import { jsx as jsx139 } from "react/jsx-runtime";
+import { jsx as jsx145 } from "react/jsx-runtime";
 var SquareAccordion = () => {
-  return /* @__PURE__ */ jsx139("div", { className: "flex space-x-1 w-12 h-12 justify-center items-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx139(
+  return /* @__PURE__ */ jsx145("div", { className: "flex space-x-1 w-12 h-12 justify-center items-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx145(
     motion130.div,
     {
       className: "w-3 bg-zinc-800 dark:bg-white rounded-sm",
@@ -7177,9 +7758,9 @@ var SquareAccordion = () => {
 
 // .generated/ui/loading/square-grid.tsx
 import { motion as motion131 } from "framer-motion";
-import { jsx as jsx140 } from "react/jsx-runtime";
+import { jsx as jsx146 } from "react/jsx-runtime";
 var SquareGrid = () => {
-  return /* @__PURE__ */ jsx140("div", { className: "grid grid-cols-2 gap-1.5", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx140(
+  return /* @__PURE__ */ jsx146("div", { className: "grid grid-cols-2 gap-1.5", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx146(
     motion131.div,
     {
       className: "w-4 h-4 bg-zinc-800 dark:bg-white rounded-sm",
@@ -7192,9 +7773,9 @@ var SquareGrid = () => {
 
 // .generated/ui/loading/square-snake.tsx
 import { motion as motion132 } from "framer-motion";
-import { jsx as jsx141 } from "react/jsx-runtime";
+import { jsx as jsx147 } from "react/jsx-runtime";
 var SquareSnake = () => {
-  return /* @__PURE__ */ jsx141("div", { className: "grid grid-cols-3 gap-1 w-10 h-10", children: [
+  return /* @__PURE__ */ jsx147("div", { className: "grid grid-cols-3 gap-1 w-10 h-10", children: [
     [0, 0],
     [1, 0],
     [2, 0],
@@ -7204,7 +7785,7 @@ var SquareSnake = () => {
     [0, 2],
     [1, 2],
     [2, 2]
-  ].map(([x, y], i) => /* @__PURE__ */ jsx141(
+  ].map(([x, y], i) => /* @__PURE__ */ jsx147(
     motion132.div,
     {
       className: "bg-zinc-800 dark:bg-white rounded-sm w-full h-full",
@@ -7217,23 +7798,23 @@ var SquareSnake = () => {
 
 // .generated/ui/loading/square-spinner.tsx
 import { motion as motion133 } from "framer-motion";
-import { jsx as jsx142 } from "react/jsx-runtime";
+import { jsx as jsx148 } from "react/jsx-runtime";
 var SquareSpinner = () => {
-  return /* @__PURE__ */ jsx142(
+  return /* @__PURE__ */ jsx148(
     motion133.div,
     {
       className: "w-8 h-8 border-2 border-zinc-800 dark:border-zinc-700 flex items-center justify-center",
       animate: { rotate: 90 },
       transition: { duration: 0.6, repeat: Infinity, ease: "easeInOut" },
-      children: /* @__PURE__ */ jsx142("div", { className: "w-2 h-2 bg-zinc-800 dark:bg-white" })
+      children: /* @__PURE__ */ jsx148("div", { className: "w-2 h-2 bg-zinc-800 dark:bg-white" })
     }
   );
 };
 
 // .generated/ui/loading/stacked-bar-pulse.tsx
 import { motion as motion134 } from "framer-motion";
-import { jsx as jsx143 } from "react/jsx-runtime";
-var StackedBarPulse = () => /* @__PURE__ */ jsx143("div", { className: "flex flex-col space-y-1 w-8 items-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx143(
+import { jsx as jsx149 } from "react/jsx-runtime";
+var StackedBarPulse = () => /* @__PURE__ */ jsx149("div", { className: "flex flex-col space-y-1 w-8 items-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx149(
   motion134.div,
   {
     className: "w-full h-1 bg-zinc-800 dark:bg-white rounded-full",
@@ -7245,10 +7826,10 @@ var StackedBarPulse = () => /* @__PURE__ */ jsx143("div", { className: "flex fle
 
 // .generated/ui/loading/swapping-dots.tsx
 import { motion as motion135 } from "framer-motion";
-import { jsx as jsx144, jsxs as jsxs65 } from "react/jsx-runtime";
+import { jsx as jsx150, jsxs as jsxs71 } from "react/jsx-runtime";
 var SwappingDots = () => {
-  return /* @__PURE__ */ jsxs65("div", { className: "relative w-12 h-4 flex items-center", children: [
-    /* @__PURE__ */ jsx144(
+  return /* @__PURE__ */ jsxs71("div", { className: "relative w-12 h-4 flex items-center", children: [
+    /* @__PURE__ */ jsx150(
       motion135.div,
       {
         className: "absolute left-0 w-4 h-4 bg-zinc-800 dark:bg-white rounded-full",
@@ -7256,7 +7837,7 @@ var SwappingDots = () => {
         transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" }
       }
     ),
-    /* @__PURE__ */ jsx144(
+    /* @__PURE__ */ jsx150(
       motion135.div,
       {
         className: "absolute right-0 w-4 h-4 bg-zinc-400 dark:bg-zinc-200 rounded-full",
@@ -7269,10 +7850,10 @@ var SwappingDots = () => {
 
 // .generated/ui/loading/swirling-spinner.tsx
 import { motion as motion136 } from "framer-motion";
-import { jsx as jsx145, jsxs as jsxs66 } from "react/jsx-runtime";
+import { jsx as jsx151, jsxs as jsxs72 } from "react/jsx-runtime";
 var SwirlingSpinner = () => {
-  return /* @__PURE__ */ jsxs66("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
-    /* @__PURE__ */ jsx145(
+  return /* @__PURE__ */ jsxs72("div", { className: "relative w-10 h-10 flex items-center justify-center", children: [
+    /* @__PURE__ */ jsx151(
       motion136.div,
       {
         className: "absolute inset-0 border-[2.5px] border-t-zinc-800 dark:border-t-white border-r-zinc-800/30 dark:border-r-white/30 border-b-zinc-800/10 dark:border-b-white/10 border-l-transparent rounded-full",
@@ -7280,7 +7861,7 @@ var SwirlingSpinner = () => {
         transition: { duration: 1.3, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx145(
+    /* @__PURE__ */ jsx151(
       motion136.div,
       {
         className: "absolute w-6 h-6 border-[2.5px] border-b-zinc-800 dark:border-b-white border-t-zinc-800/30 dark:border-t-white/30 border-r-zinc-800/10 dark:border-r-white/10 border-l-transparent rounded-full",
@@ -7293,9 +7874,9 @@ var SwirlingSpinner = () => {
 
 // .generated/ui/loading/symmetric-wave.tsx
 import { motion as motion137 } from "framer-motion";
-import { jsx as jsx146 } from "react/jsx-runtime";
+import { jsx as jsx152 } from "react/jsx-runtime";
 var SymmetricWave = () => {
-  return /* @__PURE__ */ jsx146("div", { className: "flex space-x-1.5 h-10 items-center", children: [0, 1, 2, 3, 4, 3, 2, 1, 0].map((val, i) => /* @__PURE__ */ jsx146(
+  return /* @__PURE__ */ jsx152("div", { className: "flex space-x-1.5 h-10 items-center", children: [0, 1, 2, 3, 4, 3, 2, 1, 0].map((val, i) => /* @__PURE__ */ jsx152(
     motion137.div,
     {
       className: "w-1.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -7308,16 +7889,16 @@ var SymmetricWave = () => {
 
 // .generated/ui/loading/terminal-loader.tsx
 import { motion as motion138 } from "framer-motion";
-import { jsx as jsx147, jsxs as jsxs67 } from "react/jsx-runtime";
+import { jsx as jsx153, jsxs as jsxs73 } from "react/jsx-runtime";
 var TerminalLoader = () => {
-  return /* @__PURE__ */ jsxs67("div", { className: "bg-zinc-900 dark:bg-white text-zinc-100 font-mono text-[10px] p-3 rounded-md w-full h-16 flex flex-col justify-end overflow-hidden shadow-sm", children: [
-    /* @__PURE__ */ jsxs67("div", { className: "flex text-zinc-500 dark:text-zinc-300 mb-1 leading-none", children: [
-      /* @__PURE__ */ jsx147("span", { children: "$" }),
-      /* @__PURE__ */ jsx147("span", { className: "ml-2", children: "loading..." })
+  return /* @__PURE__ */ jsxs73("div", { className: "bg-zinc-900 dark:bg-white text-zinc-100 font-mono text-[10px] p-3 rounded-md w-full h-16 flex flex-col justify-end overflow-hidden shadow-sm", children: [
+    /* @__PURE__ */ jsxs73("div", { className: "flex text-zinc-500 dark:text-zinc-300 mb-1 leading-none", children: [
+      /* @__PURE__ */ jsx153("span", { children: "$" }),
+      /* @__PURE__ */ jsx153("span", { className: "ml-2", children: "loading..." })
     ] }),
-    /* @__PURE__ */ jsxs67("div", { className: "flex items-center leading-none", children: [
-      /* @__PURE__ */ jsx147("span", { className: "text-emerald-400", children: ">" }),
-      /* @__PURE__ */ jsx147(
+    /* @__PURE__ */ jsxs73("div", { className: "flex items-center leading-none", children: [
+      /* @__PURE__ */ jsx153("span", { className: "text-emerald-400", children: ">" }),
+      /* @__PURE__ */ jsx153(
         motion138.span,
         {
           className: "ml-2 w-1.5 h-2.5 bg-zinc-100 dark:bg-zinc-800 block",
@@ -7331,9 +7912,9 @@ var TerminalLoader = () => {
 
 // .generated/ui/loading/text-blink.tsx
 import { motion as motion139 } from "framer-motion";
-import { jsx as jsx148 } from "react/jsx-runtime";
+import { jsx as jsx154 } from "react/jsx-runtime";
 var TextBlink = () => {
-  return /* @__PURE__ */ jsx148(
+  return /* @__PURE__ */ jsx154(
     motion139.div,
     {
       className: "text-zinc-900 dark:text-white font-medium text-lg",
@@ -7346,23 +7927,23 @@ var TextBlink = () => {
 
 // .generated/ui/loading/text-dots.tsx
 import { motion as motion140 } from "framer-motion";
-import { jsx as jsx149, jsxs as jsxs68 } from "react/jsx-runtime";
+import { jsx as jsx155, jsxs as jsxs74 } from "react/jsx-runtime";
 var TextDots = () => {
-  return /* @__PURE__ */ jsxs68("div", { className: "font-medium text-lg text-zinc-900 dark:text-white flex w-24", children: [
-    /* @__PURE__ */ jsx149("span", { children: "Thinking" }),
-    /* @__PURE__ */ jsxs68("span", { className: "flex w-6 pl-0.5", children: [
-      /* @__PURE__ */ jsx149(motion140.span, { animate: { opacity: [0, 1, 1, 0] }, transition: { duration: 2, repeat: Infinity, times: [0, 0.2, 0.8, 1] }, children: "." }),
-      /* @__PURE__ */ jsx149(motion140.span, { animate: { opacity: [0, 0, 1, 0] }, transition: { duration: 2, repeat: Infinity, times: [0, 0.4, 0.8, 1] }, children: "." }),
-      /* @__PURE__ */ jsx149(motion140.span, { animate: { opacity: [0, 0, 1, 0] }, transition: { duration: 2, repeat: Infinity, times: [0, 0.6, 0.8, 1] }, children: "." })
+  return /* @__PURE__ */ jsxs74("div", { className: "font-medium text-lg text-zinc-900 dark:text-white flex w-24", children: [
+    /* @__PURE__ */ jsx155("span", { children: "Thinking" }),
+    /* @__PURE__ */ jsxs74("span", { className: "flex w-6 pl-0.5", children: [
+      /* @__PURE__ */ jsx155(motion140.span, { animate: { opacity: [0, 1, 1, 0] }, transition: { duration: 2, repeat: Infinity, times: [0, 0.2, 0.8, 1] }, children: "." }),
+      /* @__PURE__ */ jsx155(motion140.span, { animate: { opacity: [0, 0, 1, 0] }, transition: { duration: 2, repeat: Infinity, times: [0, 0.4, 0.8, 1] }, children: "." }),
+      /* @__PURE__ */ jsx155(motion140.span, { animate: { opacity: [0, 0, 1, 0] }, transition: { duration: 2, repeat: Infinity, times: [0, 0.6, 0.8, 1] }, children: "." })
     ] })
   ] });
 };
 
 // .generated/ui/loading/text-morph.tsx
 import { motion as motion141 } from "framer-motion";
-import { jsx as jsx150, jsxs as jsxs69 } from "react/jsx-runtime";
-var TextMorph = () => /* @__PURE__ */ jsxs69("div", { className: "relative h-6 w-24 flex items-center justify-center font-medium text-sm text-zinc-900 dark:text-white overflow-hidden", children: [
-  /* @__PURE__ */ jsx150(
+import { jsx as jsx156, jsxs as jsxs75 } from "react/jsx-runtime";
+var TextMorph = () => /* @__PURE__ */ jsxs75("div", { className: "relative h-6 w-24 flex items-center justify-center font-medium text-sm text-zinc-900 dark:text-white overflow-hidden", children: [
+  /* @__PURE__ */ jsx156(
     motion141.div,
     {
       className: "absolute",
@@ -7371,7 +7952,7 @@ var TextMorph = () => /* @__PURE__ */ jsxs69("div", { className: "relative h-6 w
       children: "Loading"
     }
   ),
-  /* @__PURE__ */ jsx150(
+  /* @__PURE__ */ jsx156(
     motion141.div,
     {
       className: "absolute",
@@ -7384,10 +7965,10 @@ var TextMorph = () => /* @__PURE__ */ jsxs69("div", { className: "relative h-6 w
 
 // .generated/ui/loading/text-shimmer-wave.tsx
 import { motion as motion142 } from "framer-motion";
-import { jsx as jsx151 } from "react/jsx-runtime";
+import { jsx as jsx157 } from "react/jsx-runtime";
 var TextShimmerWave = () => {
   const text = "Thinking";
-  return /* @__PURE__ */ jsx151("div", { className: "flex font-medium text-lg", children: text.split("").map((char, i) => /* @__PURE__ */ jsx151(
+  return /* @__PURE__ */ jsx157("div", { className: "flex font-medium text-lg", children: text.split("").map((char, i) => /* @__PURE__ */ jsx157(
     motion142.span,
     {
       className: "text-zinc-900 dark:text-white",
@@ -7401,11 +7982,11 @@ var TextShimmerWave = () => {
 
 // .generated/ui/loading/text-shimmer.tsx
 import { motion as motion143 } from "framer-motion";
-import { jsx as jsx152, jsxs as jsxs70 } from "react/jsx-runtime";
+import { jsx as jsx158, jsxs as jsxs76 } from "react/jsx-runtime";
 var TextShimmer = () => {
-  return /* @__PURE__ */ jsxs70("div", { className: "relative text-zinc-200 font-medium text-lg", children: [
+  return /* @__PURE__ */ jsxs76("div", { className: "relative text-zinc-200 font-medium text-lg", children: [
     "Thinking",
-    /* @__PURE__ */ jsx152(
+    /* @__PURE__ */ jsx158(
       motion143.div,
       {
         className: "absolute inset-0 text-zinc-900 dark:text-white",
@@ -7420,29 +8001,29 @@ var TextShimmer = () => {
 
 // .generated/ui/loading/trailing-dots.tsx
 import { motion as motion144 } from "framer-motion";
-import { jsx as jsx153 } from "react/jsx-runtime";
-var TrailingDots = () => /* @__PURE__ */ jsx153("div", { className: "relative w-10 h-10", children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx153(
+import { jsx as jsx159 } from "react/jsx-runtime";
+var TrailingDots = () => /* @__PURE__ */ jsx159("div", { className: "relative w-10 h-10", children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx159(
   motion144.div,
   {
     className: "absolute inset-0",
     animate: { rotate: 360 },
     transition: { duration: 1.5, repeat: Infinity, delay: i * 0.1, ease: "easeInOut" },
-    children: /* @__PURE__ */ jsx153("div", { className: `w-2 h-2 rounded-full absolute top-0 left-1/2 -ml-1 ${i === 0 ? "bg-zinc-800 dark:bg-white" : "bg-zinc-400 dark:bg-zinc-200"}`, style: { opacity: 1 - i * 0.2 } })
+    children: /* @__PURE__ */ jsx159("div", { className: `w-2 h-2 rounded-full absolute top-0 left-1/2 -ml-1 ${i === 0 ? "bg-zinc-800 dark:bg-white" : "bg-zinc-400 dark:bg-zinc-200"}`, style: { opacity: 1 - i * 0.2 } })
   },
   i
 )) });
 
 // .generated/ui/loading/triple-dot-spinner.tsx
 import { motion as motion145 } from "framer-motion";
-import { jsx as jsx154 } from "react/jsx-runtime";
+import { jsx as jsx160 } from "react/jsx-runtime";
 var TripleDotSpinner = () => {
-  return /* @__PURE__ */ jsx154(
+  return /* @__PURE__ */ jsx160(
     motion145.div,
     {
       className: "relative w-10 h-10",
       animate: { rotate: 360 },
       transition: { duration: 2, repeat: Infinity, ease: "linear" },
-      children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx154(
+      children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx160(
         "div",
         {
           className: "absolute top-0 left-1/2 w-2 h-2 bg-zinc-800 dark:bg-white rounded-full -ml-1 origin-[4px_20px]",
@@ -7456,10 +8037,10 @@ var TripleDotSpinner = () => {
 
 // .generated/ui/loading/twin-orbit.tsx
 import { motion as motion146 } from "framer-motion";
-import { jsx as jsx155, jsxs as jsxs71 } from "react/jsx-runtime";
+import { jsx as jsx161, jsxs as jsxs77 } from "react/jsx-runtime";
 var TwinOrbit = () => {
-  return /* @__PURE__ */ jsxs71("div", { className: "relative w-12 h-12", children: [
-    /* @__PURE__ */ jsx155(
+  return /* @__PURE__ */ jsxs77("div", { className: "relative w-12 h-12", children: [
+    /* @__PURE__ */ jsx161(
       motion146.div,
       {
         className: "absolute inset-0 border-2 border-zinc-800 dark:border-zinc-700 rounded-full border-b-transparent border-r-transparent",
@@ -7467,7 +8048,7 @@ var TwinOrbit = () => {
         transition: { duration: 1.5, repeat: Infinity, ease: "linear" }
       }
     ),
-    /* @__PURE__ */ jsx155(
+    /* @__PURE__ */ jsx161(
       motion146.div,
       {
         className: "absolute inset-2 border-2 border-zinc-400 rounded-full border-t-transparent border-l-transparent",
@@ -7480,9 +8061,9 @@ var TwinOrbit = () => {
 
 // .generated/ui/loading/typing-indicator.tsx
 import { motion as motion147 } from "framer-motion";
-import { jsx as jsx156 } from "react/jsx-runtime";
+import { jsx as jsx162 } from "react/jsx-runtime";
 var TypingIndicator = () => {
-  return /* @__PURE__ */ jsx156("div", { className: "flex items-center justify-center px-4 py-2 bg-zinc-100 dark:bg-zinc-800 rounded-full space-x-1", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx156(
+  return /* @__PURE__ */ jsx162("div", { className: "flex items-center justify-center px-4 py-2 bg-zinc-100 dark:bg-zinc-800 rounded-full space-x-1", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx162(
     motion147.div,
     {
       className: "w-1.5 h-1.5 bg-zinc-500 dark:bg-zinc-350 rounded-full",
@@ -7495,11 +8076,11 @@ var TypingIndicator = () => {
 
 // .generated/ui/loading/typing.tsx
 import { motion as motion148 } from "framer-motion";
-import { jsx as jsx157, jsxs as jsxs72 } from "react/jsx-runtime";
+import { jsx as jsx163, jsxs as jsxs78 } from "react/jsx-runtime";
 var Typing = () => {
-  return /* @__PURE__ */ jsxs72("div", { className: "flex items-center text-zinc-900 dark:text-white font-medium text-lg w-20", children: [
+  return /* @__PURE__ */ jsxs78("div", { className: "flex items-center text-zinc-900 dark:text-white font-medium text-lg w-20", children: [
     "Loading",
-    /* @__PURE__ */ jsx157(
+    /* @__PURE__ */ jsx163(
       motion148.span,
       {
         className: "w-1.5 h-4 bg-zinc-900 dark:bg-white ml-1 inline-block",
@@ -7512,9 +8093,9 @@ var Typing = () => {
 
 // .generated/ui/loading/wandering-cube.tsx
 import { motion as motion149 } from "framer-motion";
-import { jsx as jsx158 } from "react/jsx-runtime";
+import { jsx as jsx164 } from "react/jsx-runtime";
 var WanderingCube = () => {
-  return /* @__PURE__ */ jsx158("div", { className: "relative w-10 h-10", children: /* @__PURE__ */ jsx158(
+  return /* @__PURE__ */ jsx164("div", { className: "relative w-10 h-10", children: /* @__PURE__ */ jsx164(
     motion149.div,
     {
       className: "absolute top-0 left-0 w-4 h-4 bg-zinc-800 dark:bg-white rounded-sm",
@@ -7529,7 +8110,7 @@ var WanderingCube = () => {
 };
 
 // .generated/ui/loading/wandering-eyes.tsx
-import { Fragment as Fragment9, jsx as jsx159, jsxs as jsxs73 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx165, jsxs as jsxs79 } from "react/jsx-runtime";
 function clamp(value, min, max) {
   return Math.min(Math.max(value, min), max);
 }
@@ -7557,8 +8138,8 @@ function WanderingEyes({
     "--mova-wandering-eyes-blink": `${safeBlinkScale}`,
     "--mova-wandering-eyes-travel-scale": `${safeTravelScale}`
   };
-  return /* @__PURE__ */ jsxs73(Fragment9, { children: [
-    /* @__PURE__ */ jsx159("style", { children: `
+  return /* @__PURE__ */ jsxs79(Fragment10, { children: [
+    /* @__PURE__ */ jsx165("style", { children: `
         @keyframes mova-wandering-eyes-move {
           0%, 10% { background-position: 0 0; }
           13%, 40% { background-position: calc(var(--mova-wandering-eyes-eye) * var(--mova-wandering-eyes-travel-scale) * -1) 0; }
@@ -7587,7 +8168,7 @@ function WanderingEyes({
           animation: mova-wandering-eyes-move var(--duration, 10s) infinite, mova-wandering-eyes-blink var(--duration, 10s) infinite;
         }
       ` }),
-    /* @__PURE__ */ jsxs73(
+    /* @__PURE__ */ jsxs79(
       "span",
       {
         role: "status",
@@ -7596,11 +8177,11 @@ function WanderingEyes({
         style: eyesStyle,
         ...props,
         children: [
-          /* @__PURE__ */ jsxs73("span", { "aria-hidden": "true", className: "mova-wandering-eyes__pair", children: [
-            /* @__PURE__ */ jsx159("span", { className: "mova-wandering-eyes__eye" }),
-            /* @__PURE__ */ jsx159("span", { className: "mova-wandering-eyes__eye" })
+          /* @__PURE__ */ jsxs79("span", { "aria-hidden": "true", className: "mova-wandering-eyes__pair", children: [
+            /* @__PURE__ */ jsx165("span", { className: "mova-wandering-eyes__eye" }),
+            /* @__PURE__ */ jsx165("span", { className: "mova-wandering-eyes__eye" })
           ] }),
-          /* @__PURE__ */ jsx159("span", { className: "sr-only", children: "Loading" })
+          /* @__PURE__ */ jsx165("span", { className: "sr-only", children: "Loading" })
         ]
       }
     )
@@ -7609,8 +8190,8 @@ function WanderingEyes({
 
 // .generated/ui/loading/watch-spinner.tsx
 import { motion as motion150 } from "framer-motion";
-import { jsx as jsx160 } from "react/jsx-runtime";
-var WatchSpinner = () => /* @__PURE__ */ jsx160("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx160(
+import { jsx as jsx166 } from "react/jsx-runtime";
+var WatchSpinner = () => /* @__PURE__ */ jsx166("div", { className: "relative w-12 h-12 flex items-center justify-center", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx166(
   motion150.div,
   {
     className: "absolute rounded-full border-[3px] border-transparent border-t-zinc-800 dark:border-t-white",
@@ -7623,9 +8204,9 @@ var WatchSpinner = () => /* @__PURE__ */ jsx160("div", { className: "relative w-
 
 // .generated/ui/loading/wave-dots.tsx
 import { motion as motion151 } from "framer-motion";
-import { jsx as jsx161 } from "react/jsx-runtime";
+import { jsx as jsx167 } from "react/jsx-runtime";
 var WaveDots = () => {
-  return /* @__PURE__ */ jsx161("div", { className: "flex space-x-1.5 h-6 items-center", children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx161(
+  return /* @__PURE__ */ jsx167("div", { className: "flex space-x-1.5 h-6 items-center", children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx167(
     motion151.div,
     {
       className: "w-2 h-2 bg-zinc-800 dark:bg-white rounded-full",
@@ -7639,7 +8220,7 @@ var WaveDots = () => {
 // .generated/ui/loading/wave-physics-loader.tsx
 import { motion as motion152 } from "framer-motion";
 import { useMemo as useMemo4 } from "react";
-import { jsx as jsx162, jsxs as jsxs74 } from "react/jsx-runtime";
+import { jsx as jsx168, jsxs as jsxs80 } from "react/jsx-runtime";
 function WavePhysicsLoader({ theme = "light" }) {
   const numBars = 15;
   const barWidth = 12;
@@ -7705,8 +8286,8 @@ function WavePhysicsLoader({ theme = "light" }) {
     }
     return { bars: barsData, ballX: bX, ballY: bY, ballScaleX: bScaleX, ballScaleY: bScaleY, times: tArr };
   }, [theme]);
-  return /* @__PURE__ */ jsx162("div", { className: "relative flex flex-col items-center justify-center w-full scale-[0.6] sm:scale-75 md:scale-100", children: /* @__PURE__ */ jsxs74("div", { className: "relative flex items-end justify-start h-48 space-x-2 w-[292px]", children: [
-    bars.map((bar, i) => /* @__PURE__ */ jsx162(
+  return /* @__PURE__ */ jsx168("div", { className: "relative flex flex-col items-center justify-center w-full scale-[0.6] sm:scale-75 md:scale-100", children: /* @__PURE__ */ jsxs80("div", { className: "relative flex items-end justify-start h-48 space-x-2 w-[292px]", children: [
+    bars.map((bar, i) => /* @__PURE__ */ jsx168(
       motion152.div,
       {
         className: "w-3 rounded-full origin-bottom",
@@ -7724,7 +8305,7 @@ function WavePhysicsLoader({ theme = "light" }) {
       },
       i
     )),
-    /* @__PURE__ */ jsx162(
+    /* @__PURE__ */ jsx168(
       motion152.div,
       {
         className: "absolute w-3 h-3 bg-zinc-900 dark:bg-white rounded-full z-10 shadow-sm",
@@ -7748,8 +8329,8 @@ function WavePhysicsLoader({ theme = "light" }) {
 
 // .generated/ui/loading/waveform-loader.tsx
 import { motion as motion153 } from "framer-motion";
-import { jsx as jsx163 } from "react/jsx-runtime";
-var WaveformLoader = () => /* @__PURE__ */ jsx163("div", { className: "flex items-center space-x-0.5 h-8", children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx163(
+import { jsx as jsx169 } from "react/jsx-runtime";
+var WaveformLoader = () => /* @__PURE__ */ jsx169("div", { className: "flex items-center space-x-0.5 h-8", children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx169(
   motion153.div,
   {
     className: "w-1 bg-zinc-800 dark:bg-white rounded-full",
@@ -7761,16 +8342,16 @@ var WaveformLoader = () => /* @__PURE__ */ jsx163("div", { className: "flex item
 
 // .generated/ui/loading/zig-zag-pulse.tsx
 import { motion as motion154 } from "framer-motion";
-import { jsx as jsx164 } from "react/jsx-runtime";
+import { jsx as jsx170 } from "react/jsx-runtime";
 var ZigZagPulse = () => {
-  return /* @__PURE__ */ jsx164("div", { className: "grid grid-cols-3 gap-2 w-12 h-12", children: [
+  return /* @__PURE__ */ jsx170("div", { className: "grid grid-cols-3 gap-2 w-12 h-12", children: [
     [0, 0],
     [1, 1],
     [2, 0],
     [0, 2],
     [1, 1],
     [2, 2]
-  ].map(([col, row], i) => /* @__PURE__ */ jsx164(
+  ].map(([col, row], i) => /* @__PURE__ */ jsx170(
     motion154.div,
     {
       className: "w-2.5 h-2.5 bg-zinc-800 dark:bg-white rounded-full",
@@ -7783,17 +8364,17 @@ var ZigZagPulse = () => {
 };
 
 // .generated/ui/patterns/animated-tags.tsx
-import { CircleX, Plus as Plus2 } from "lucide-react";
+import { CircleX, Plus as Plus4 } from "lucide-react";
 import { AnimatePresence as AnimatePresence7, motion as motion155, useReducedMotion as useReducedMotion9 } from "framer-motion";
-import { useState as useState21 } from "react";
-import { jsx as jsx165, jsxs as jsxs75 } from "react/jsx-runtime";
+import { useState as useState27 } from "react";
+import { jsx as jsx171, jsxs as jsxs81 } from "react/jsx-runtime";
 function AnimatedTags({
   initialTags = ["react", "tailwindcss", "javascript"],
   selectedTags: controlledSelectedTags,
   onChange,
   className = ""
 }) {
-  const [internalSelected, setInternalSelected] = useState21([]);
+  const [internalSelected, setInternalSelected] = useState27([]);
   const shouldReduceMotion = useReducedMotion9();
   const selectedTag = controlledSelectedTags ?? internalSelected;
   const tags = initialTags.filter((tag) => !selectedTag.includes(tag));
@@ -7813,10 +8394,10 @@ function AnimatedTags({
       setInternalSelected(newSelectedTag);
     }
   };
-  return /* @__PURE__ */ jsxs75("div", { className: `flex w-[300px] flex-col gap-4 p-4 ${className}`, children: [
-    /* @__PURE__ */ jsxs75("div", { className: "flex flex-col items-start justify-center gap-1", children: [
-      /* @__PURE__ */ jsx165("p", { children: "Selected Tags" }),
-      /* @__PURE__ */ jsx165(AnimatePresence7, { children: /* @__PURE__ */ jsx165("div", { className: "flex min-h-12 w-full flex-wrap items-center gap-1 rounded-xl border bg-background p-2", children: selectedTag?.map((tag) => /* @__PURE__ */ jsxs75(
+  return /* @__PURE__ */ jsxs81("div", { className: `flex w-[300px] flex-col gap-4 p-4 ${className}`, children: [
+    /* @__PURE__ */ jsxs81("div", { className: "flex flex-col items-start justify-center gap-1", children: [
+      /* @__PURE__ */ jsx171("p", { children: "Selected Tags" }),
+      /* @__PURE__ */ jsx171(AnimatePresence7, { children: /* @__PURE__ */ jsx171("div", { className: "flex min-h-12 w-full flex-wrap items-center gap-1 rounded-xl border bg-background p-2", children: selectedTag?.map((tag) => /* @__PURE__ */ jsxs81(
         motion155.div,
         {
           animate: shouldReduceMotion ? { opacity: 1 } : {
@@ -7833,7 +8414,7 @@ function AnimatedTags({
           children: [
             tag,
             " ",
-            /* @__PURE__ */ jsx165(
+            /* @__PURE__ */ jsx171(
               CircleX,
               {
                 className: "ease flex items-center justify-center rounded-full transition-all duration-200",
@@ -7845,7 +8426,7 @@ function AnimatedTags({
         tag
       )) }) })
     ] }),
-    /* @__PURE__ */ jsx165(AnimatePresence7, { children: /* @__PURE__ */ jsx165("div", { className: "flex flex-wrap items-center gap-1", children: tags.map((tag) => /* @__PURE__ */ jsxs75(
+    /* @__PURE__ */ jsx171(AnimatePresence7, { children: /* @__PURE__ */ jsx171("div", { className: "flex flex-wrap items-center gap-1", children: tags.map((tag) => /* @__PURE__ */ jsxs81(
       motion155.div,
       {
         animate: shouldReduceMotion ? { opacity: 1 } : {
@@ -7862,8 +8443,8 @@ function AnimatedTags({
         children: [
           tag,
           " ",
-          /* @__PURE__ */ jsx165(
-            Plus2,
+          /* @__PURE__ */ jsx171(
+            Plus4,
             {
               className: "ease flex items-center justify-center rounded-full transition-all duration-200 group-hover/tag:bg-primary group-hover/tag:text-foreground",
               size: 16
@@ -7877,9 +8458,9 @@ function AnimatedTags({
 }
 
 // .generated/ui/patterns/expanding-icon-tabs.tsx
-import { useEffect as useEffect12, useRef as useRef11, useState as useState22 } from "react";
+import { useEffect as useEffect16, useRef as useRef15, useState as useState28 } from "react";
 import { Activity as Activity2, Compass, CreditCard, SlidersHorizontal as SlidersHorizontal2, Users } from "lucide-react";
-import { jsx as jsx166, jsxs as jsxs76 } from "react/jsx-runtime";
+import { jsx as jsx172, jsxs as jsxs82 } from "react/jsx-runtime";
 var items = [
   { id: "overview", label: "Overview", icon: Compass },
   { id: "activity", label: "Activity", icon: Activity2 },
@@ -7889,9 +8470,9 @@ var items = [
   { id: "billing", label: "Billing", icon: CreditCard }
 ];
 function ExpandingIconTabs() {
-  const [active, setActive] = useState22(null);
-  const rootRef = useRef11(null);
-  useEffect12(() => {
+  const [active, setActive] = useState28(null);
+  const rootRef = useRef15(null);
+  useEffect16(() => {
     if (!active) return;
     const region = rootRef.current?.parentElement;
     if (!region) return;
@@ -7919,7 +8500,7 @@ function ExpandingIconTabs() {
       setActive(null);
     }
   };
-  return /* @__PURE__ */ jsx166(
+  return /* @__PURE__ */ jsx172(
     "div",
     {
       className: "flex max-w-full flex-wrap items-center gap-1 rounded-xl border border-[#2b2f36] bg-[#121418] p-1 text-[11px] text-[#dfe2e5] shadow-[inset_0_1px_0_rgba(255,255,255,.04),0_10px_24px_rgba(0,0,0,.35)]",
@@ -7928,7 +8509,7 @@ function ExpandingIconTabs() {
       ref: rootRef,
       onKeyDown: handleKeyDown,
       children: items.map(
-        (item, index) => "separator" in item ? /* @__PURE__ */ jsx166(
+        (item, index) => "separator" in item ? /* @__PURE__ */ jsx172(
           "span",
           {
             className: "mx-[2px] h-[18px] w-px flex-none bg-[#23262c]",
@@ -7936,7 +8517,7 @@ function ExpandingIconTabs() {
             "aria-orientation": "vertical"
           },
           `separator-${index}`
-        ) : /* @__PURE__ */ jsxs76(
+        ) : /* @__PURE__ */ jsxs82(
           "button",
           {
             type: "button",
@@ -7946,19 +8527,19 @@ function ExpandingIconTabs() {
             "aria-pressed": active === item.id,
             onClick: () => setActive(active === item.id ? null : item.id),
             children: [
-              /* @__PURE__ */ jsx166(
+              /* @__PURE__ */ jsx172(
                 "span",
                 {
                   className: `grid flex-none place-items-center [transition:color_.3s_ease] motion-reduce:[transition-duration:.01ms] ${active === item.id ? "text-[#f97316]" : ""}`,
-                  children: /* @__PURE__ */ jsx166(item.icon, { size: 15, strokeWidth: 1.8, "aria-hidden": "true" })
+                  children: /* @__PURE__ */ jsx172(item.icon, { size: 15, strokeWidth: 1.8, "aria-hidden": "true" })
                 }
               ),
-              /* @__PURE__ */ jsx166(
+              /* @__PURE__ */ jsx172(
                 "span",
                 {
                   className: `grid overflow-hidden [transition:grid-template-columns_.5s_cubic-bezier(.32,.72,0,1),opacity_.3s_ease] motion-reduce:[transition-duration:.01ms] ${active === item.id ? "grid-cols-[1fr] opacity-100" : "grid-cols-[0fr] opacity-0"}`,
                   "aria-hidden": "true",
-                  children: /* @__PURE__ */ jsx166("span", { className: "min-w-0 overflow-hidden whitespace-nowrap", children: item.label })
+                  children: /* @__PURE__ */ jsx172("span", { className: "min-w-0 overflow-hidden whitespace-nowrap", children: item.label })
                 }
               )
             ]
@@ -7972,13 +8553,13 @@ function ExpandingIconTabs() {
 
 // .generated/ui/patterns/gooey-popover.tsx
 import gsap from "gsap";
-import { useCallback as useCallback3, useEffect as useEffect13, useId as useId6, useRef as useRef12, useState as useState23 } from "react";
-import { jsx as jsx167, jsxs as jsxs77 } from "react/jsx-runtime";
+import { useCallback as useCallback3, useEffect as useEffect17, useId as useId11, useRef as useRef16, useState as useState29 } from "react";
+import { jsx as jsx173, jsxs as jsxs83 } from "react/jsx-runtime";
 function cn2(...classes) {
   return classes.filter(Boolean).join(" ");
 }
 function useClickOutside(ref, handler, eventType = "mousedown") {
-  useEffect13(() => {
+  useEffect17(() => {
     function callback(event) {
       const target = event.target;
       if (!target?.isConnected) return;
@@ -8013,20 +8594,20 @@ function GooeyPopover({
   contentClassName,
   className
 }) {
-  const filterId = useId6();
+  const filterId = useId11();
   const isControlled = controlledIsOpen !== void 0;
-  const [internalIsOpen, setInternalIsOpen] = useState23(false);
+  const [internalIsOpen, setInternalIsOpen] = useState29(false);
   const isOpen = isControlled ? controlledIsOpen : internalIsOpen;
-  const [isVisible, setIsVisible] = useState23(false);
-  const containerRef = useRef12(null);
-  const measureRef = useRef12(null);
-  const filteredContentRef = useRef12(null);
-  const unfilteredContentRef = useRef12(null);
-  const innerContentRef = useRef12(null);
-  const timelineRef = useRef12(null);
-  const [contentHeight, setContentHeight] = useState23(0);
-  const [prefersReducedMotion, setPrefersReducedMotion] = useState23(false);
-  useEffect13(() => {
+  const [isVisible, setIsVisible] = useState29(false);
+  const containerRef = useRef16(null);
+  const measureRef = useRef16(null);
+  const filteredContentRef = useRef16(null);
+  const unfilteredContentRef = useRef16(null);
+  const innerContentRef = useRef16(null);
+  const timelineRef = useRef16(null);
+  const [contentHeight, setContentHeight] = useState29(0);
+  const [prefersReducedMotion, setPrefersReducedMotion] = useState29(false);
+  useEffect17(() => {
     const mq = window.matchMedia("(prefers-reduced-motion: reduce)");
     setPrefersReducedMotion(mq.matches);
     const handler = (e) => {
@@ -8050,7 +8631,7 @@ function GooeyPopover({
     }
   }, [isOpen, setIsOpen]);
   useClickOutside(containerRef, handleClose);
-  useEffect13(() => {
+  useEffect17(() => {
     const handleKeyDown = (event) => {
       if (event.key === "Escape" && isOpen) {
         setIsOpen(false);
@@ -8059,7 +8640,7 @@ function GooeyPopover({
     window.addEventListener("keydown", handleKeyDown);
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, [isOpen, setIsOpen]);
-  useEffect13(() => {
+  useEffect17(() => {
     const measureHeight = () => {
       if (measureRef.current) {
         const height = measureRef.current.scrollHeight;
@@ -8081,7 +8662,7 @@ function GooeyPopover({
   const triggerRadius = triggerSize / 2;
   const translateY = side === "top" ? -(contentHeight + sideOffset) : triggerSize + sideOffset;
   const contentLeft = triggerRadius - contentWidth / 2;
-  useEffect13(() => {
+  useEffect17(() => {
     if (contentHeight === 0) {
       return;
     }
@@ -8228,7 +8809,7 @@ function GooeyPopover({
     speed,
     prefersReducedMotion
   ]);
-  const defaultTriggerIcon = /* @__PURE__ */ jsxs77(
+  const defaultTriggerIcon = /* @__PURE__ */ jsxs83(
     "svg",
     {
       fill: "none",
@@ -8241,20 +8822,20 @@ function GooeyPopover({
       width: 20,
       xmlns: "http://www.w3.org/2000/svg",
       children: [
-        /* @__PURE__ */ jsx167("line", { x1: "12", x2: "12", y1: "5", y2: "19" }),
-        /* @__PURE__ */ jsx167("line", { x1: "5", x2: "19", y1: "12", y2: "12" })
+        /* @__PURE__ */ jsx173("line", { x1: "12", x2: "12", y1: "5", y2: "19" }),
+        /* @__PURE__ */ jsx173("line", { x1: "5", x2: "19", y1: "12", y2: "12" })
       ]
     }
   );
-  return /* @__PURE__ */ jsxs77("div", { className: cn2("relative inline-flex", className), ref: containerRef, children: [
-    /* @__PURE__ */ jsx167(
+  return /* @__PURE__ */ jsxs83("div", { className: cn2("relative inline-flex", className), ref: containerRef, children: [
+    /* @__PURE__ */ jsx173(
       "svg",
       {
         "aria-hidden": "true",
         className: "absolute",
         style: { height: 0, width: 0 },
-        children: /* @__PURE__ */ jsx167("defs", { children: /* @__PURE__ */ jsxs77("filter", { id: filterId, children: [
-          /* @__PURE__ */ jsx167(
+        children: /* @__PURE__ */ jsx173("defs", { children: /* @__PURE__ */ jsxs83("filter", { id: filterId, children: [
+          /* @__PURE__ */ jsx173(
             "feGaussianBlur",
             {
               in: "SourceGraphic",
@@ -8262,7 +8843,7 @@ function GooeyPopover({
               stdDeviation: GOO_STD_DEVIATION
             }
           ),
-          /* @__PURE__ */ jsx167(
+          /* @__PURE__ */ jsx173(
             "feColorMatrix",
             {
               in: "blur",
@@ -8271,11 +8852,11 @@ function GooeyPopover({
               values: `1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 ${String(GOO_MATRIX_ALPHA_MULTIPLIER)} ${String(GOO_MATRIX_ALPHA_OFFSET)}`
             }
           ),
-          /* @__PURE__ */ jsx167("feComposite", { in: "SourceGraphic", in2: "goo", operator: "atop" })
+          /* @__PURE__ */ jsx173("feComposite", { in: "SourceGraphic", in2: "goo", operator: "atop" })
         ] }) })
       }
     ),
-    /* @__PURE__ */ jsx167(
+    /* @__PURE__ */ jsx173(
       "div",
       {
         "aria-hidden": "true",
@@ -8288,17 +8869,17 @@ function GooeyPopover({
           visibility: "hidden",
           width: contentWidth
         },
-        children: /* @__PURE__ */ jsx167("div", { className: cn2("p-4", contentClassName), children })
+        children: /* @__PURE__ */ jsx173("div", { className: cn2("p-4", contentClassName), children })
       }
     ),
-    !prefersReducedMotion && (isOpen || isVisible) && /* @__PURE__ */ jsxs77(
+    !prefersReducedMotion && (isOpen || isVisible) && /* @__PURE__ */ jsxs83(
       "div",
       {
         "aria-hidden": "true",
         className: "pointer-events-none absolute inset-0",
         style: { filter: `url(#${filterId})` },
         children: [
-          /* @__PURE__ */ jsx167(
+          /* @__PURE__ */ jsx173(
             "div",
             {
               className: cn2("absolute rounded-full", bgClassName),
@@ -8310,7 +8891,7 @@ function GooeyPopover({
               }
             }
           ),
-          /* @__PURE__ */ jsx167(
+          /* @__PURE__ */ jsx173(
             "div",
             {
               className: cn2("absolute", bgClassName),
@@ -8328,7 +8909,7 @@ function GooeyPopover({
         ]
       }
     ),
-    /* @__PURE__ */ jsx167(
+    /* @__PURE__ */ jsx173(
       "button",
       {
         "aria-expanded": isOpen,
@@ -8346,7 +8927,7 @@ function GooeyPopover({
         children: trigger ?? defaultTriggerIcon
       }
     ),
-    isOpen || isVisible ? /* @__PURE__ */ jsx167(
+    isOpen || isVisible ? /* @__PURE__ */ jsx173(
       "div",
       {
         className: cn2(
@@ -8363,7 +8944,7 @@ function GooeyPopover({
           top: 0,
           width: triggerSize
         },
-        children: /* @__PURE__ */ jsx167(
+        children: /* @__PURE__ */ jsx173(
           "div",
           {
             className: cn2("p-4", contentClassName),
@@ -8379,7 +8960,7 @@ function GooeyPopover({
 
 // .generated/ui/scroll/progress-indicator.tsx
 import { motion as motion156, useScroll, useSpring as useSpring5 } from "framer-motion";
-import { jsx as jsx168 } from "react/jsx-runtime";
+import { jsx as jsx174 } from "react/jsx-runtime";
 function ProgressIndicator({
   color = "bg-blue-500",
   height = 4,
@@ -8391,7 +8972,7 @@ function ProgressIndicator({
     damping: 30,
     restDelta: 1e-3
   });
-  return /* @__PURE__ */ jsx168(
+  return /* @__PURE__ */ jsx174(
     motion156.div,
     {
       className: `fixed top-0 left-0 right-0 origin-left z-[9999] ${color} ${className}`,
@@ -8411,7 +8992,7 @@ function ProgressIndicator({
 
 // .generated/ui/scroll/scroll-reveal.tsx
 import { motion as motion157 } from "framer-motion";
-import { jsx as jsx169 } from "react/jsx-runtime";
+import { jsx as jsx175 } from "react/jsx-runtime";
 function ScrollReveal({
   children,
   duration = 0.6,
@@ -8420,7 +9001,7 @@ function ScrollReveal({
   scale = 0.95,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx169(
+  return /* @__PURE__ */ jsx175(
     motion157.div,
     {
       initial: { opacity: 0, y: yOffset, x: xOffset, scale },
@@ -8438,15 +9019,15 @@ function ScrollReveal({
 }
 
 // .generated/ui/scroll/sticky-reveal.tsx
-import { useRef as useRef13, useState as useState24 } from "react";
+import { useRef as useRef17, useState as useState30 } from "react";
 import { motion as motion158, useMotionValueEvent, useScroll as useScroll2 } from "framer-motion";
-import { jsx as jsx170, jsxs as jsxs78 } from "react/jsx-runtime";
+import { jsx as jsx176, jsxs as jsxs84 } from "react/jsx-runtime";
 function StickyReveal({
   content,
   className = ""
 }) {
-  const [activeCard, setActiveCard] = useState24(0);
-  const ref = useRef13(null);
+  const [activeCard, setActiveCard] = useState30(0);
+  const ref = useRef17(null);
   const { scrollYProgress } = useScroll2({
     target: ref,
     offset: ["start start", "end end"]
@@ -8462,14 +9043,14 @@ function StickyReveal({
     }, 0);
     setActiveCard(closestIndex);
   });
-  return /* @__PURE__ */ jsxs78(
+  return /* @__PURE__ */ jsxs84(
     "div",
     {
       ref,
       className: `relative flex justify-between gap-10 max-w-5xl mx-auto py-10 px-4 ${className}`,
       children: [
-        /* @__PURE__ */ jsx170("div", { className: "w-1/2 flex flex-col gap-32 py-10", children: content.map((item, index) => /* @__PURE__ */ jsxs78("div", { className: "min-h-[50vh] flex flex-col justify-center", children: [
-          /* @__PURE__ */ jsx170(
+        /* @__PURE__ */ jsx176("div", { className: "w-1/2 flex flex-col gap-32 py-10", children: content.map((item, index) => /* @__PURE__ */ jsxs84("div", { className: "min-h-[50vh] flex flex-col justify-center", children: [
+          /* @__PURE__ */ jsx176(
             motion158.h2,
             {
               animate: {
@@ -8479,7 +9060,7 @@ function StickyReveal({
               children: item.title
             }
           ),
-          /* @__PURE__ */ jsx170(
+          /* @__PURE__ */ jsx176(
             motion158.p,
             {
               animate: {
@@ -8490,7 +9071,7 @@ function StickyReveal({
             }
           )
         ] }, index)) }),
-        /* @__PURE__ */ jsx170("div", { className: "sticky top-20 h-[60vh] w-1/2 rounded-2xl bg-neutral-100 dark:bg-neutral-900 border border-neutral-200/10 overflow-hidden flex items-center justify-center", children: content.map((item, index) => /* @__PURE__ */ jsx170(
+        /* @__PURE__ */ jsx176("div", { className: "sticky top-20 h-[60vh] w-1/2 rounded-2xl bg-neutral-100 dark:bg-neutral-900 border border-neutral-200/10 overflow-hidden flex items-center justify-center", children: content.map((item, index) => /* @__PURE__ */ jsx176(
           motion158.div,
           {
             initial: { opacity: 0, scale: 0.9 },
@@ -8500,7 +9081,7 @@ function StickyReveal({
             },
             transition: { duration: 0.4 },
             className: "absolute inset-0 p-6 flex items-center justify-center",
-            children: item.content || /* @__PURE__ */ jsxs78("div", { className: "text-lg font-semibold text-neutral-400", children: [
+            children: item.content || /* @__PURE__ */ jsxs84("div", { className: "text-lg font-semibold text-neutral-400", children: [
               "Card ",
               index + 1,
               " Visual"
@@ -8515,7 +9096,7 @@ function StickyReveal({
 
 // .generated/ui/text/blur-text.tsx
 import { motion as motion159 } from "framer-motion";
-import { jsx as jsx171 } from "react/jsx-runtime";
+import { jsx as jsx177 } from "react/jsx-runtime";
 function BlurText({
   text,
   duration = 0.5,
@@ -8544,7 +9125,7 @@ function BlurText({
       }
     }
   };
-  return /* @__PURE__ */ jsx171(
+  return /* @__PURE__ */ jsx177(
     motion159.div,
     {
       variants: containerVariants,
@@ -8552,7 +9133,7 @@ function BlurText({
       whileInView: "visible",
       viewport: { once: true, margin: "-10%" },
       className: `inline-block ${className}`,
-      children: characters.map((char, index) => /* @__PURE__ */ jsx171(
+      children: characters.map((char, index) => /* @__PURE__ */ jsx177(
         motion159.span,
         {
           variants: charVariants,
@@ -8567,7 +9148,7 @@ function BlurText({
 
 // .generated/ui/text/character-stagger.tsx
 import { motion as motion160 } from "framer-motion";
-import { jsx as jsx172 } from "react/jsx-runtime";
+import { jsx as jsx178 } from "react/jsx-runtime";
 function CharacterStagger({
   text,
   duration = 0.4,
@@ -8600,7 +9181,7 @@ function CharacterStagger({
       }
     }
   };
-  return /* @__PURE__ */ jsx172(
+  return /* @__PURE__ */ jsx178(
     motion160.div,
     {
       variants: containerVariants,
@@ -8608,7 +9189,7 @@ function CharacterStagger({
       whileInView: "visible",
       viewport: { once: true, margin: "-10%" },
       className: `inline-block ${className}`,
-      children: characters.map((char, index) => /* @__PURE__ */ jsx172(
+      children: characters.map((char, index) => /* @__PURE__ */ jsx178(
         motion160.span,
         {
           variants: charVariants,
@@ -8623,7 +9204,7 @@ function CharacterStagger({
 
 // .generated/ui/text/text-reveal.tsx
 import { motion as motion161 } from "framer-motion";
-import { jsx as jsx173 } from "react/jsx-runtime";
+import { jsx as jsx179 } from "react/jsx-runtime";
 function TextReveal({
   text,
   duration = 0.8,
@@ -8651,7 +9232,7 @@ function TextReveal({
       }
     }
   };
-  return /* @__PURE__ */ jsx173(
+  return /* @__PURE__ */ jsx179(
     motion161.div,
     {
       variants: containerVariants,
@@ -8659,14 +9240,14 @@ function TextReveal({
       whileInView: "visible",
       viewport: { once: true, margin: "-20%" },
       className: `flex flex-col ${className}`,
-      children: lines.map((line, index) => /* @__PURE__ */ jsx173("div", { className: "overflow-hidden py-1", children: /* @__PURE__ */ jsx173(motion161.span, { variants: itemVariants, className: "block", children: line }) }, index))
+      children: lines.map((line, index) => /* @__PURE__ */ jsx179("div", { className: "overflow-hidden py-1", children: /* @__PURE__ */ jsx179(motion161.span, { variants: itemVariants, className: "block", children: line }) }, index))
     }
   );
 }
 
 // .generated/ui/text/word-reveal.tsx
 import { motion as motion162 } from "framer-motion";
-import { jsx as jsx174 } from "react/jsx-runtime";
+import { jsx as jsx180 } from "react/jsx-runtime";
 function WordReveal({
   text,
   duration = 0.5,
@@ -8696,7 +9277,7 @@ function WordReveal({
       }
     }
   };
-  return /* @__PURE__ */ jsx174(
+  return /* @__PURE__ */ jsx180(
     motion162.div,
     {
       variants: containerVariants,
@@ -8704,7 +9285,7 @@ function WordReveal({
       whileInView: "visible",
       viewport: { once: true, margin: "-10%" },
       className: `flex flex-wrap gap-x-2 gap-y-1.5 ${className}`,
-      children: words.map((word, index) => /* @__PURE__ */ jsx174(
+      children: words.map((word, index) => /* @__PURE__ */ jsx180(
         motion162.span,
         {
           variants: wordVariants,
@@ -8718,17 +9299,17 @@ function WordReveal({
 }
 
 // .generated/ui/toggles/classic-toggle.tsx
-import { useState as useState25 } from "react";
+import { useState as useState31 } from "react";
 import { motion as motion163 } from "framer-motion";
-import { jsx as jsx175 } from "react/jsx-runtime";
+import { jsx as jsx181 } from "react/jsx-runtime";
 var ClassicToggle = () => {
-  const [isOn, setIsOn] = useState25(false);
-  return /* @__PURE__ */ jsx175(
+  const [isOn, setIsOn] = useState31(false);
+  return /* @__PURE__ */ jsx181(
     "button",
     {
       onClick: () => setIsOn(!isOn),
       className: `relative w-16 h-9 rounded-full p-1 transition-colors duration-300 cursor-pointer border-0 ${isOn ? "bg-emerald-500" : "bg-neutral-800"}`,
-      children: /* @__PURE__ */ jsx175(
+      children: /* @__PURE__ */ jsx181(
         motion163.div,
         {
           animate: { x: isOn ? 28 : 0 },
@@ -8741,17 +9322,17 @@ var ClassicToggle = () => {
 };
 
 // .generated/ui/transitions/page-transition.tsx
-import { useEffect as useEffect14, useRef as useRef14 } from "react";
+import { useEffect as useEffect18, useRef as useRef18 } from "react";
 import { motion as motion164 } from "framer-motion";
-import { jsx as jsx176, jsxs as jsxs79 } from "react/jsx-runtime";
+import { jsx as jsx182, jsxs as jsxs85 } from "react/jsx-runtime";
 var PageTransition = ({
   type = "double-stairs",
   isVisible,
   onComplete,
   className = ""
 }) => {
-  const pathRefs = useRef14([]);
-  useEffect14(() => {
+  const pathRefs = useRef18([]);
+  useEffect18(() => {
     if (type !== "liquid-wave" || !isVisible) return;
     let animId;
     const numPoints = 12;
@@ -8804,7 +9385,7 @@ var PageTransition = ({
         transition: { duration: 0.8, ease: [0.76, 0, 0.24, 1], delay: i * 0.05 }
       })
     };
-    return /* @__PURE__ */ jsx176(
+    return /* @__PURE__ */ jsx182(
       motion164.div,
       {
         className: `fixed inset-0 z-50 flex h-screen w-screen pointer-events-none ${className}`,
@@ -8813,7 +9394,7 @@ var PageTransition = ({
         onAnimationComplete: () => {
           if (onComplete) onComplete();
         },
-        children: [...Array(COLUMNS)].map((_, i) => /* @__PURE__ */ jsx176(
+        children: [...Array(COLUMNS)].map((_, i) => /* @__PURE__ */ jsx182(
           motion164.div,
           {
             variants,
@@ -8826,27 +9407,27 @@ var PageTransition = ({
     );
   }
   if (type === "liquid-wave") {
-    return /* @__PURE__ */ jsxs79(
+    return /* @__PURE__ */ jsxs85(
       "svg",
       {
         className: `fixed inset-0 w-full h-full pointer-events-none z-50 ${className}`,
         viewBox: "0 0 100 100",
         preserveAspectRatio: "none",
         children: [
-          /* @__PURE__ */ jsx176("path", { ref: (el) => {
+          /* @__PURE__ */ jsx182("path", { ref: (el) => {
             pathRefs.current[0] = el;
           }, fill: "#3f3f46", style: { opacity: 0.4 } }),
-          /* @__PURE__ */ jsx176("path", { ref: (el) => {
+          /* @__PURE__ */ jsx182("path", { ref: (el) => {
             pathRefs.current[1] = el;
           }, fill: "#27272a", style: { opacity: 0.75 } }),
-          /* @__PURE__ */ jsx176("path", { ref: (el) => {
+          /* @__PURE__ */ jsx182("path", { ref: (el) => {
             pathRefs.current[2] = el;
           }, fill: "#09090b" })
         ]
       }
     );
   }
-  return /* @__PURE__ */ jsx176(
+  return /* @__PURE__ */ jsx182(
     motion164.div,
     {
       className: `fixed inset-0 z-50 bg-neutral-900 pointer-events-none ${className}`,
@@ -8881,6 +9462,7 @@ export {
   AppleTextReveal,
   AppleUnlock,
   ArcTracer,
+  BalanceBarChartCard,
   BarCascade,
   BarSweep,
   BlurText,
@@ -8894,6 +9476,7 @@ export {
   BreatheRing,
   BreathingGlow,
   BreathingSquare,
+  CalendarDayCard,
   CardHover,
   CharacterStagger,
   CircularBars,
@@ -8910,6 +9493,7 @@ export {
   CursorTrail,
   DashRing,
   DashedSpiral,
+  DayTradingOrderTicket,
   DiamondGrid,
   DiamondRotateSpring,
   DotSpinner,
@@ -8944,12 +9528,14 @@ export {
   Heartbeat,
   HexagonSpinner,
   Hourglass,
+  IMessageChat,
   IOSSpinner,
   InfinityPath,
   InsetButton,
   IntersectingRings,
   LineSpinner,
   LiquidDots,
+  LiquidGlassSheet,
   MacTerminal,
   MagneticButton,
   MagneticDots,
@@ -9024,6 +9610,7 @@ export {
   TwinOrbit,
   Typing,
   TypingIndicator,
+  VoiceAssistantCard,
   WanderingCube,
   WanderingEyes,
   WatchSpinner,