kaleido-ui 0.1.114 → 0.1.116

package/dist/web/index.cjs

@@ -151,7 +151,9 @@ __export(web_exports, {
   StatusBadge: () => StatusBadge,
   StatusIconBadge: () => StatusIconBadge,
   StepperNumberInput: () => StepperNumberInput,
+  SummaryRows: () => SummaryRows,
   SwapInputCard: () => SwapInputCard,
+  SwapStepList: () => SwapStepList,
   Switch: () => Switch,
   SwitchRow: () => SwitchRow,
   Tabs: () => Tabs,
@@ -790,13 +792,27 @@ SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 var React5 = __toESM(require("react"), 1);
 var import_jsx_runtime8 = require("react/jsx-runtime");
 var Switch = React5.forwardRef(
-  ({ checked = false, onCheckedChange, disabled = false, className }, ref) => {
+  ({
+    checked = false,
+    onCheckedChange,
+    disabled = false,
+    className,
+    id,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy
+  }, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "button",
       {
         ref,
+        id,
+        type: "button",
         role: "switch",
         "aria-checked": checked,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-describedby": ariaDescribedBy,
         disabled,
         onClick: () => onCheckedChange?.(!checked),
         className: cn(
@@ -1323,7 +1339,7 @@ var DotPagination = React12.forwardRef(
         ...props,
         children: Array.from({ length: count2 }).map((_, i) => {
           const active = i === index;
-          const dotClass = cn(
+          const dotClass2 = cn(
             "rounded-full transition-all duration-200",
             active ? cn("h-2 w-5 shadow-sm", toneClasses[tone]) : "h-2 w-2 bg-white/25",
             interactive && "cursor-pointer hover:bg-white/40"
@@ -1337,7 +1353,7 @@ var DotPagination = React12.forwardRef(
               "aria-selected": active,
               "aria-label": `Page ${i + 1} of ${count2}`,
               onClick: interactive ? () => onSelect(i) : void 0,
-              className: dotClass
+              className: dotClass2
             },
             i
           );
@@ -3843,7 +3859,7 @@ var import_react11 = require("react");
 var import_react_dom = require("react-dom");
 var import_jsx_runtime38 = require("react/jsx-runtime");
 function NetworkMiniBadge({ iconUrl, label }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: cn(iconBadgeOverlayClass, "overflow-hidden"), children: iconUrl ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("img", { src: iconUrl, alt: label ?? "", className: "h-full w-full object-cover" }) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "flex h-full w-full items-center justify-center bg-muted text-xxs font-bold uppercase leading-none text-muted-foreground", children: label?.charAt(0) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: cn(iconBadgeOverlayClass, "overflow-hidden bg-card"), children: iconUrl ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("img", { src: iconUrl, alt: label ?? "", className: "h-full w-full object-cover" }) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "flex h-full w-full items-center justify-center bg-muted text-xxs font-bold uppercase leading-none text-muted-foreground", children: label?.charAt(0) }) });
 }
 function readableTagColor(color) {
   const raw = color.replace("#", "");
@@ -5810,10 +5826,108 @@ function SwitchRow({
   ] });
 }
 
-// src/web/components/section-label.tsx
+// src/web/components/swap-step-list.tsx
 var import_jsx_runtime56 = require("react/jsx-runtime");
+var dotClass = {
+  done: "bg-primary text-background",
+  active: "bg-warning/20 text-warning",
+  pending: "bg-muted/40 text-muted-foreground",
+  failed: "bg-danger/20 text-danger"
+};
+var labelClass = {
+  done: "text-foreground",
+  active: "text-foreground",
+  pending: "text-muted-foreground",
+  failed: "text-danger"
+};
+function SwapStepList({ steps, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { "data-slot": "swap-step-list", className: cn("flex flex-col", className), children: steps.map((step, index) => {
+    const isLast = index === steps.length - 1;
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+      "div",
+      {
+        "data-slot": "swap-step",
+        "data-status": step.status,
+        className: "flex gap-3",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex w-5 shrink-0 flex-col items-center", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+              "span",
+              {
+                "aria-hidden": true,
+                className: cn(
+                  "flex size-5 items-center justify-center rounded-full text-xxs font-bold",
+                  dotClass[step.status],
+                  step.status === "active" && "animate-pulse"
+                ),
+                children: step.status === "done" ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Icon, { name: "check", className: "text-icon-sm" }) : step.status === "failed" ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Icon, { name: "close", className: "text-icon-sm" }) : index + 1
+              }
+            ),
+            !isLast && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+              "span",
+              {
+                "aria-hidden": true,
+                className: cn(
+                  "mt-1 w-0.5 flex-1",
+                  step.status === "done" ? "bg-primary/60" : "bg-muted/40"
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: cn("min-w-0 flex-1", isLast ? "pb-0" : "pb-4"), children: [
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: cn("text-sm font-medium", labelClass[step.status]), children: step.label }),
+            step.description && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: "mt-0.5 text-xs leading-snug text-muted-foreground", children: step.description })
+          ] })
+        ]
+      },
+      step.id
+    );
+  }) });
+}
+
+// src/web/components/summary-rows.tsx
+var import_jsx_runtime57 = require("react/jsx-runtime");
+var valueTone = {
+  default: "text-foreground",
+  primary: "text-primary",
+  warning: "text-warning",
+  danger: "text-danger",
+  success: "text-success"
+};
+function SummaryRows({ rows, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { "data-slot": "summary-rows", className: cn("space-y-1.5", className), children: rows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
+    "div",
+    {
+      "data-slot": "summary-row",
+      "data-emphasis": row.emphasis ? "true" : void 0,
+      className: "flex items-center justify-between gap-3 rounded-xl bg-muted/40 px-3 py-2.5",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "shrink-0 text-xs text-muted-foreground", children: row.label }),
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex min-w-0 flex-col items-end", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+            "span",
+            {
+              className: cn(
+                "truncate tabular-nums",
+                row.emphasis ? "text-base font-bold" : "text-sm font-medium",
+                row.mono && "font-mono text-xs",
+                valueTone[row.tone ?? "default"]
+              ),
+              children: row.value
+            }
+          ),
+          row.hint && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "mt-0.5 text-xxs text-muted-foreground", children: row.hint })
+        ] })
+      ]
+    },
+    index
+  )) });
+}
+
+// src/web/components/section-label.tsx
+var import_jsx_runtime58 = require("react/jsx-runtime");
 function SectionLabel({ children, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
     "span",
     {
       className: cn("text-xxs font-black uppercase tracking-eyebrow-wide text-muted-foreground", className),
@@ -5823,21 +5937,21 @@ function SectionLabel({ children, className }) {
 }
 
 // src/web/components/section-header.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 function SectionHeader({
   children,
   right,
   as: Tag = "h2",
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: cn("flex items-center justify-between gap-3 px-1", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Tag, { className: "text-xs font-bold uppercase tracking-wider text-muted-foreground", children }),
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: cn("flex items-center justify-between gap-3 px-1", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Tag, { className: "text-xs font-bold uppercase tracking-wider text-muted-foreground", children }),
     right
   ] });
 }
 
 // src/web/components/alert-banner.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 var variantStyles = {
   error: { container: "bg-danger/40", icon: "text-danger", iconName: "error" },
   warning: { container: "bg-warning/40", icon: "text-warning", iconName: "warning" },
@@ -5846,14 +5960,14 @@ var variantStyles = {
 };
 function AlertBanner({ variant = "info", icon, children, className }) {
   const styles = variantStyles[variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: cn("rounded-xl p-3 flex items-center gap-2", styles.container, className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Icon, { name: icon ?? styles.iconName, size: "md", className: cn("shrink-0", styles.icon) }),
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: cn("text-sm", styles.icon), children })
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: cn("rounded-xl p-3 flex items-center gap-2", styles.container, className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: icon ?? styles.iconName, size: "md", className: cn("shrink-0", styles.icon) }),
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: cn("text-sm", styles.icon), children })
   ] });
 }
 
 // src/web/components/info-panel.tsx
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 var toneClass = {
   default: {
     panel: "bg-card/70",
@@ -5894,18 +6008,18 @@ function InfoPanel({
   className
 }) {
   const styles = toneClass[tone];
-  const renderedIcon = typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Icon, { name: icon, className: cn("mt-0.5 shrink-0 text-icon-xl", styles.icon) }) : icon;
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: cn("rounded-xl p-4", styles.panel, className), children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex items-start gap-3", children: [
+  const renderedIcon = typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: icon, className: cn("mt-0.5 shrink-0 text-icon-xl", styles.icon) }) : icon;
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: cn("rounded-xl p-4", styles.panel, className), children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex items-start gap-3", children: [
     renderedIcon,
-    /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "min-w-0 flex-1", children: [
-      title && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { className: cn("text-sm font-bold", styles.title), children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: cn("text-xs leading-relaxed", title ? "mt-1" : "", styles.title), children })
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "min-w-0 flex-1", children: [
+      title && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("p", { className: cn("text-sm font-bold", styles.title), children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: cn("text-xs leading-relaxed", title ? "mt-1" : "", styles.title), children })
     ] })
   ] }) });
 }
 
 // src/web/components/info-chip.tsx
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 var defaultStatusLabel = {
   success: "Success",
   warning: "Warning",
@@ -5945,7 +6059,7 @@ function InfoChip({
   "data-info-kind": dataInfoKind
 }) {
   const readableStatus = status ? statusLabel ?? defaultStatusLabel[status] : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
     "div",
     {
       "data-slot": "info-chip",
@@ -5957,7 +6071,7 @@ function InfoChip({
         className
       ),
       children: [
-        leading && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+        leading && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           "span",
           {
             "aria-hidden": "true",
@@ -5968,10 +6082,10 @@ function InfoChip({
             children: leading
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("dl", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("dt", { className: "truncate text-xxs font-bold uppercase tracking-wider text-muted-foreground", children: label }),
-          /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("dd", { className: "mt-0.5 flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("dl", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("dt", { className: "truncate text-xxs font-bold uppercase tracking-wider text-muted-foreground", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("dd", { className: "mt-0.5 flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
               "span",
               {
                 className: cn(
@@ -5981,7 +6095,7 @@ function InfoChip({
                 children: value
               }
             ),
-            status && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+            status && /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
               "span",
               {
                 className: cn(
@@ -5989,14 +6103,14 @@ function InfoChip({
                   statusToneClass[status]
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { "aria-hidden": "true", className: cn("size-1.5 shrink-0 rounded-full", statusDotClass[status]) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "truncate", children: readableStatus })
+                  /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { "aria-hidden": "true", className: cn("size-1.5 shrink-0 rounded-full", statusDotClass[status]) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: "truncate", children: readableStatus })
                 ]
               }
             )
           ] })
         ] }),
-        onEdit && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+        onEdit && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           Button,
           {
             type: "button",
@@ -6007,7 +6121,7 @@ function InfoChip({
             "aria-label": editLabel,
             title: editLabel,
             className: "shrink-0",
-            children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: "edit", size: "sm", "aria-hidden": "true" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Icon, { name: "edit", size: "sm", "aria-hidden": "true" })
           }
         )
       ]
@@ -6021,12 +6135,12 @@ function NetworkInfoChip({
   iconBasePath,
   ...infoChipProps
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
     InfoChip,
     {
       ...infoChipProps,
       "data-info-kind": "network",
-      leading: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(NetworkBadge, { network, iconBasePath, size: "md" }),
+      leading: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(NetworkBadge, { network, iconBasePath, size: "md" }),
       label,
       value
     }
@@ -6040,12 +6154,12 @@ function AssetInfoChip({
   cdnBaseUrl,
   ...infoChipProps
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
     InfoChip,
     {
       ...infoChipProps,
       "data-info-kind": "asset",
-      leading: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(AssetIcon, { ticker, logoUri, cdnBaseUrl, size: 28 }),
+      leading: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(AssetIcon, { ticker, logoUri, cdnBaseUrl, size: 28 }),
       label,
       value
     }
@@ -6054,7 +6168,7 @@ function AssetInfoChip({
 
 // src/web/components/error-boundary.tsx
 var import_react12 = require("react");
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 var ErrorBoundary = class extends import_react12.Component {
   constructor(props) {
     super(props);
@@ -6068,11 +6182,11 @@ var ErrorBoundary = class extends import_react12.Component {
   }
   render() {
     if (this.state.hasError) {
-      return this.props.fallback ?? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "min-h-screen bg-background text-foreground font-display flex flex-col items-center justify-center p-6 gap-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "material-symbols-outlined text-danger text-icon-5xl", children: "error" }),
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("h2", { className: "text-lg font-bold", children: "Something went wrong" }),
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("p", { className: "text-sm text-muted-foreground text-center", children: this.state.error?.message ?? "An unexpected error occurred." }),
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+      return this.props.fallback ?? /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "min-h-screen bg-background text-foreground font-display flex flex-col items-center justify-center p-6 gap-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "material-symbols-outlined text-danger text-icon-5xl", children: "error" }),
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("h2", { className: "text-lg font-bold", children: "Something went wrong" }),
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("p", { className: "text-sm text-muted-foreground text-center", children: this.state.error?.message ?? "An unexpected error occurred." }),
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
           "button",
           {
             onClick: () => {
@@ -6090,7 +6204,7 @@ var ErrorBoundary = class extends import_react12.Component {
 };
 
 // src/web/components/recovery-phrase-card.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime64 = require("react/jsx-runtime");
 function RecoveryPhraseCard({
   words,
   revealed = false,
@@ -6101,10 +6215,10 @@ function RecoveryPhraseCard({
   className
 }) {
   const hasWords = words.length > 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("section", { className: cn("space-y-2", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "flex items-center justify-between px-0.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { className: "text-xs font-bold uppercase tracking-wider text-muted-foreground", children: title }),
-      hasWords && revealed && onRevealChange && /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("section", { className: cn("space-y-2", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "flex items-center justify-between px-0.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("p", { className: "text-xs font-bold uppercase tracking-wider text-muted-foreground", children: title }),
+      hasWords && revealed && onRevealChange && /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
         Button,
         {
           type: "button",
@@ -6113,27 +6227,27 @@ function RecoveryPhraseCard({
           onClick: () => onRevealChange(!revealed),
           className: "h-auto rounded-lg px-2 py-1 text-xs text-muted-foreground hover:text-white",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Icon, { name: "visibility_off", className: "text-icon-md" }),
+            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Icon, { name: "visibility_off", className: "text-icon-md" }),
             "Hide"
           ]
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "relative", children: [
-      hasWords ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "relative", children: [
+      hasWords ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
         "div",
         {
           className: cn(
             "grid grid-cols-3 gap-2 transition-all duration-300",
             !revealed && "pointer-events-none select-none blur-sm"
           ),
-          children: words.map((word, index) => /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "flex items-center gap-2 rounded-xl bg-card px-3 py-2.5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: "w-4 shrink-0 text-xs font-bold text-muted-foreground", children: index + 1 }),
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: "font-mono text-sm text-white", children: word })
+          children: words.map((word, index) => /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "flex items-center gap-2 rounded-xl bg-card px-3 py-2.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "w-4 shrink-0 text-xs font-bold text-muted-foreground", children: index + 1 }),
+            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "font-mono text-sm text-white", children: word })
           ] }, `${index}-${word}`))
         }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "rounded-xl bg-warning/10 px-4 py-3 text-sm text-warning", children: emptyMessage }),
-      hasWords && !revealed && onRevealChange && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
+      ) : /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "rounded-xl bg-warning/10 px-4 py-3 text-sm text-warning", children: emptyMessage }),
+      hasWords && !revealed && onRevealChange && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
         Button,
         {
           type: "button",
@@ -6141,13 +6255,13 @@ function RecoveryPhraseCard({
           size: "sm",
           onClick: () => onRevealChange(true),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Icon, { name: "visibility", className: "text-icon-lg" }),
+            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Icon, { name: "visibility", className: "text-icon-lg" }),
             "Tap to reveal"
           ]
         }
       ) })
     ] }),
-    hasWords && revealed && onCopy && /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
+    hasWords && revealed && onCopy && /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
       Button,
       {
         type: "button",
@@ -6156,7 +6270,7 @@ function RecoveryPhraseCard({
         onClick: onCopy,
         className: "w-full",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Icon, { name: "content_copy", className: "text-icon-lg" }),
+          /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Icon, { name: "content_copy", className: "text-icon-lg" }),
           "Copy to clipboard"
         ]
       }
@@ -6165,7 +6279,7 @@ function RecoveryPhraseCard({
 }
 
 // src/web/components/settings-selector-row.tsx
-var import_jsx_runtime63 = require("react/jsx-runtime");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 function SettingsSelectorRow({
   icon,
   title,
@@ -6174,9 +6288,9 @@ function SettingsSelectorRow({
   className,
   iconClassName
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: cn("flex items-start justify-between gap-3 rounded-2xl bg-card p-5", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "flex min-w-0 flex-1 items-start gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: cn("flex items-start justify-between gap-3 rounded-2xl bg-card p-5", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "flex min-w-0 flex-1 items-start gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
         "div",
         {
           className: cn(
@@ -6186,17 +6300,17 @@ function SettingsSelectorRow({
           children: icon
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "text-body font-bold tracking-wide text-foreground", children: title }),
-        description && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "mt-0.5 text-sm font-medium text-muted-foreground", children: description })
+      /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: "text-body font-bold tracking-wide text-foreground", children: title }),
+        description && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: "mt-0.5 text-sm font-medium text-muted-foreground", children: description })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "shrink-0", children: control })
+    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "shrink-0", children: control })
   ] });
 }
 
 // src/web/components/bottom-sheet.tsx
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_jsx_runtime66 = require("react/jsx-runtime");
 function BottomSheet({
   open,
   title,
@@ -6212,7 +6326,7 @@ function BottomSheet({
   const handleBackdropClick = (event) => {
     if (closeOnBackdrop && event.target === event.currentTarget) onClose?.();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
     "div",
     {
       className: cn(
@@ -6220,7 +6334,7 @@ function BottomSheet({
         className
       ),
       onClick: handleBackdropClick,
-      children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
         "div",
         {
           className: cn(
@@ -6228,13 +6342,13 @@ function BottomSheet({
             contentClassName
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "-mt-1 flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "h-1 w-10 rounded-full bg-white/15" }) }),
-            (title || icon) && /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "mt-4 flex items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "-mt-1 flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "h-1 w-10 rounded-full bg-white/15" }) }),
+            (title || icon) && /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "mt-4 flex items-center gap-2", children: [
               icon,
-              /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("p", { className: "text-sm font-bold text-foreground", children: title })
+              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "text-sm font-bold text-foreground", children: title })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: cn((title || icon) && "mt-3"), children }),
-            actions && actions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "mt-4 flex gap-2", children: actions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: cn((title || icon) && "mt-3"), children }),
+            actions && actions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "mt-4 flex gap-2", children: actions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
               Button,
               {
                 type: "button",
@@ -6244,7 +6358,7 @@ function BottomSheet({
                 onClick: action.onClick,
                 disabled: action.disabled,
                 children: [
-                  action.icon && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Icon, { name: action.icon, className: "text-icon-md" }),
+                  action.icon && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Icon, { name: action.icon, className: "text-icon-md" }),
                   action.label
                 ]
               },
@@ -6258,7 +6372,7 @@ function BottomSheet({
 }
 
 // src/web/components/disclosure-card.tsx
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_jsx_runtime67 = require("react/jsx-runtime");
 function DisclosureCard({
   title,
   children,
@@ -6269,8 +6383,8 @@ function DisclosureCard({
   triggerClassName,
   contentClassName
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
       "button",
       {
         type: "button",
@@ -6280,11 +6394,11 @@ function DisclosureCard({
           triggerClassName
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("span", { className: "flex min-w-0 items-center gap-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("span", { className: "flex min-w-0 items-center gap-1.5", children: [
             icon,
-            /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: "truncate text-xs font-bold text-foreground", children: title })
+            /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: "truncate text-xs font-bold text-foreground", children: title })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
             Icon,
             {
               name: open ? "expand_less" : "expand_more",
@@ -6294,7 +6408,7 @@ function DisclosureCard({
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
       "div",
       {
         className: cn(
@@ -6308,7 +6422,7 @@ function DisclosureCard({
 }
 
 // src/web/components/stepper-number-input.tsx
-var import_jsx_runtime66 = require("react/jsx-runtime");
+var import_jsx_runtime68 = require("react/jsx-runtime");
 function StepperNumberInput({
   value,
   onChange,
@@ -6325,7 +6439,7 @@ function StepperNumberInput({
     const bounded = max === void 0 ? boundedMin : Math.min(max, boundedMin);
     onChange(Number.isFinite(bounded) ? bounded : min ?? 0);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
     "div",
     {
       className: cn(
@@ -6333,7 +6447,7 @@ function StepperNumberInput({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
           "button",
           {
             type: "button",
@@ -6341,10 +6455,10 @@ function StepperNumberInput({
             disabled: disabled || min !== void 0 && value <= min,
             onClick: () => clamp(value - step),
             "aria-label": "Decrease",
-            children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Icon, { name: "remove", className: "text-icon-md" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Icon, { name: "remove", className: "text-icon-md" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
           "input",
           {
             type: "number",
@@ -6361,7 +6475,7 @@ function StepperNumberInput({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
           "button",
           {
             type: "button",
@@ -6369,7 +6483,7 @@ function StepperNumberInput({
             disabled: disabled || max !== void 0 && value >= max,
             onClick: () => clamp(value + step),
             "aria-label": "Increase",
-            children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Icon, { name: "add", className: "text-icon-md" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Icon, { name: "add", className: "text-icon-md" })
           }
         )
       ]
@@ -6378,7 +6492,7 @@ function StepperNumberInput({
 }
 
 // src/web/components/metric-card.tsx
-var import_jsx_runtime67 = require("react/jsx-runtime");
+var import_jsx_runtime69 = require("react/jsx-runtime");
 var toneClasses2 = {
   primary: "bg-primary/10 text-primary",
   purple: "bg-network-arkade/10 text-network-arkade",
@@ -6396,27 +6510,27 @@ function MetricCard({
   tone = "muted",
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: cn("space-y-1 rounded-xl bg-card/70 p-2.5", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: "flex items-center gap-1.5", children: [
-      icon && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: cn("flex size-5 items-center justify-center rounded-md", toneClasses2[tone]), children: typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Icon, { name: icon, className: "text-icon-xs" }) : icon }),
-      /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: "text-xxs font-bold uppercase tracking-widest text-white/45", children: label })
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: cn("space-y-1 rounded-xl bg-card/70 p-2.5", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+      icon && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: cn("flex size-5 items-center justify-center rounded-md", toneClasses2[tone]), children: typeof icon === "string" ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Icon, { name: icon, className: "text-icon-xs" }) : icon }),
+      /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "text-xxs font-bold uppercase tracking-widest text-white/45", children: label })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: "text-sm font-bold tabular-nums text-foreground", children: value }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("p", { className: "text-xxs text-white/45", children: description })
+    /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: "text-sm font-bold tabular-nums text-foreground", children: value }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: "text-xxs text-white/45", children: description })
   ] });
 }
 
 // src/web/components/filter-chip-group.tsx
-var import_jsx_runtime68 = require("react/jsx-runtime");
+var import_jsx_runtime70 = require("react/jsx-runtime");
 function FilterChipGroup({
   options,
   value,
   onChange,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: cn("flex gap-1.5 overflow-x-auto no-scrollbar", className), children: options.map((option) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: cn("flex gap-1.5 overflow-x-auto no-scrollbar", className), children: options.map((option) => {
     const active = option.value === value;
-    return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
       "button",
       {
         type: "button",
@@ -6430,7 +6544,7 @@ function FilterChipGroup({
         children: [
           option.icon,
           option.label,
-          option.count !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+          option.count !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
             "span",
             {
               className: cn(
@@ -6448,7 +6562,7 @@ function FilterChipGroup({
 }
 
 // src/web/components/activity-row.tsx
-var import_jsx_runtime69 = require("react/jsx-runtime");
+var import_jsx_runtime71 = require("react/jsx-runtime");
 var directionUi = {
   inbound: { icon: "south_west", iconClass: "bg-primary/20 text-primary", amountClass: "text-primary", sign: "+" },
   outbound: { icon: "north_east", iconClass: "bg-white/10 text-muted-foreground", amountClass: "text-foreground", sign: "-" },
@@ -6468,29 +6582,29 @@ function ActivityRow({
   className
 }) {
   const ui = directionUi[direction];
-  const content = /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_jsx_runtime69.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex min-w-0 items-center gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "flex min-w-0 items-center gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
         StatusIconBadge,
         {
           status,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: cn("flex size-10 items-center justify-center rounded-xl shadow-inner", ui.iconClass), children: typeof icon === "string" || !icon ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Icon, { name: icon ?? ui.icon, className: "text-icon-xl" }) : icon })
+          icon: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: cn("flex size-10 items-center justify-center rounded-xl shadow-inner", ui.iconClass), children: typeof icon === "string" || !icon ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Icon, { name: icon ?? ui.icon, className: "text-icon-xl" }) : icon })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex min-w-0 flex-col", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex min-w-0 items-center gap-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "truncate text-sm font-bold tracking-wide text-foreground", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "flex min-w-0 flex-col", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "flex min-w-0 items-center gap-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "truncate text-sm font-bold tracking-wide text-foreground", children: title }),
           networkBadge
         ] }),
-        timestamp && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "mt-1 flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "text-xxs text-muted-foreground", children: timestamp }) })
+        timestamp && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "mt-1 flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "text-xxs text-muted-foreground", children: timestamp }) })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "shrink-0 text-right", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("p", { className: cn("text-sm font-bold tracking-wide", ui.amountClass), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "shrink-0 text-right", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("p", { className: cn("text-sm font-bold tracking-wide", ui.amountClass), children: [
         ui.sign,
         amount
       ] }),
-      unit && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("p", { className: "mt-0.5 text-xxs font-bold uppercase tracking-wider text-muted-foreground", children: unit })
+      unit && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("p", { className: "mt-0.5 text-xxs font-bold uppercase tracking-wider text-muted-foreground", children: unit })
     ] })
   ] });
   const rowClassName = cn(
@@ -6499,23 +6613,23 @@ function ActivityRow({
     className
   );
   if (onClick) {
-    return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("button", { type: "button", onClick, className: rowClassName, children: content });
+    return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("button", { type: "button", onClick, className: rowClassName, children: content });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: rowClassName, children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: rowClassName, children: content });
 }
 
 // src/web/components/skeleton.tsx
-var import_jsx_runtime70 = require("react/jsx-runtime");
+var import_jsx_runtime72 = require("react/jsx-runtime");
 var toneClass2 = {
   primary: "bg-white/10",
   secondary: "bg-white/5",
   card: "bg-white/[0.06]"
 };
 function Skeleton({ className, tone = "primary" }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { "aria-hidden": true, className: cn("animate-pulse rounded", toneClass2[tone], className) });
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { "aria-hidden": true, className: cn("animate-pulse rounded", toneClass2[tone], className) });
 }
 function ListSkeletonRows({ rows = 3, className, rowClassName }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: cn("space-y-2", className), children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: cn("space-y-2", className), children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
     "div",
     {
       className: cn(
@@ -6523,14 +6637,14 @@ function ListSkeletonRows({ rows = 3, className, rowClassName }) {
         rowClassName
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Skeleton, { className: "size-10 shrink-0 rounded-xl" }),
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex-1 space-y-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Skeleton, { className: "h-3 w-28" }),
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Skeleton, { tone: "secondary", className: "h-2.5 w-20" })
+        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Skeleton, { className: "size-10 shrink-0 rounded-xl" }),
+        /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "flex-1 space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Skeleton, { className: "h-3 w-28" }),
+          /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Skeleton, { tone: "secondary", className: "h-2.5 w-20" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex flex-col items-end space-y-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Skeleton, { className: "h-3 w-14" }),
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Skeleton, { tone: "secondary", className: "h-2 w-10" })
+        /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "flex flex-col items-end space-y-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Skeleton, { className: "h-3 w-14" }),
+          /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Skeleton, { tone: "secondary", className: "h-2 w-10" })
         ] })
       ]
     },
@@ -6539,7 +6653,7 @@ function ListSkeletonRows({ rows = 3, className, rowClassName }) {
 }
 
 // src/web/components/secret-reveal-card.tsx
-var import_jsx_runtime71 = require("react/jsx-runtime");
+var import_jsx_runtime73 = require("react/jsx-runtime");
 function SecretRevealCard({
   value,
   revealed,
@@ -6551,9 +6665,9 @@ function SecretRevealCard({
   className,
   valueClassName
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: cn("space-y-3", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "relative", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "rounded-xl bg-card px-3 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: cn("space-y-3", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "relative", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "rounded-xl bg-card px-3 py-3", children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
         "p",
         {
           className: cn(
@@ -6564,40 +6678,40 @@ function SecretRevealCard({
           children: value
         }
       ) }),
-      !revealed && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+      !revealed && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
         "button",
         {
           type: "button",
           onClick: () => onRevealChange(true),
           className: "flex items-center gap-2 rounded-xl bg-card px-4 py-2 text-sm font-bold text-foreground shadow-lg transition-all hover:bg-accent",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Icon, { name: "visibility", className: "text-icon-lg" }),
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Icon, { name: "visibility", className: "text-icon-lg" }),
             revealLabel
           ]
         }
       ) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "flex gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
         "button",
         {
           type: "button",
           onClick: () => onRevealChange(!revealed),
           className: "flex flex-1 items-center justify-center gap-2 rounded-xl bg-white/5 py-3 text-sm font-semibold text-muted-foreground transition-all hover:bg-accent hover:text-foreground",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Icon, { name: revealed ? "visibility_off" : "visibility", className: "text-icon-lg" }),
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Icon, { name: revealed ? "visibility_off" : "visibility", className: "text-icon-lg" }),
             revealed ? hideLabel : revealLabel
           ]
         }
       ),
-      revealed && onCopy && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+      revealed && onCopy && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
         "button",
         {
           type: "button",
           onClick: onCopy,
           className: "flex flex-1 items-center justify-center gap-2 rounded-xl bg-white/5 py-3 text-sm font-semibold text-muted-foreground transition-all hover:bg-accent hover:text-foreground",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Icon, { name: "content_copy", className: "text-icon-lg" }),
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Icon, { name: "content_copy", className: "text-icon-lg" }),
             copyLabel
           ]
         }
@@ -6607,7 +6721,7 @@ function SecretRevealCard({
 }
 
 // src/web/components/settings-section-card.tsx
-var import_jsx_runtime72 = require("react/jsx-runtime");
+var import_jsx_runtime74 = require("react/jsx-runtime");
 function SettingsSectionCard({
   title,
   description,
@@ -6616,15 +6730,15 @@ function SettingsSectionCard({
   className,
   bodyClassName
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("section", { className: cn("space-y-4 rounded-xl bg-card/70 p-4", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "flex items-start justify-between gap-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("h2", { className: "text-sm font-bold text-foreground", children: title }),
-        description && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("p", { className: "mt-1 text-xs text-muted-foreground", children: description })
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("section", { className: cn("space-y-4 rounded-xl bg-card/70 p-4", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex items-start justify-between gap-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("h2", { className: "text-sm font-bold text-foreground", children: title }),
+        description && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: "mt-1 text-xs text-muted-foreground", children: description })
       ] }),
       badge
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: bodyClassName, children })
+    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: bodyClassName, children })
   ] });
 }
 var badgeToneClass = {
@@ -6636,7 +6750,7 @@ var badgeToneClass = {
   muted: "border-white/10 bg-white/[0.05] text-white/55"
 };
 function ToneBadge({ children, tone = "muted", className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
     "span",
     {
       className: cn(
@@ -6650,7 +6764,7 @@ function ToneBadge({ children, tone = "muted", className }) {
 }
 
 // src/web/components/selectable-card.tsx
-var import_jsx_runtime73 = require("react/jsx-runtime");
+var import_jsx_runtime75 = require("react/jsx-runtime");
 function SelectableCard({
   selected,
   onClick,
@@ -6662,28 +6776,28 @@ function SelectableCard({
   children,
   className
 }) {
-  const content = /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex items-start justify-between gap-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex min-w-0 flex-1 items-start gap-3", children: [
-      indicator && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "flex items-start justify-between gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "flex min-w-0 flex-1 items-start gap-3", children: [
+      indicator && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
         "div",
         {
           className: cn(
             "mt-0.5 flex size-5 shrink-0 items-center justify-center rounded-full border-2 transition-colors",
             selected ? "border-primary bg-primary" : "border-white/20"
           ),
-          children: selected && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "size-2 rounded-full bg-background" })
+          children: selected && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "size-2 rounded-full bg-background" })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex flex-wrap items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "text-body font-bold text-foreground", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "flex flex-wrap items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("span", { className: "text-body font-bold text-foreground", children: title }),
           badge
         ] }),
-        description && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { className: "mt-0.5 text-xs leading-relaxed text-muted-foreground", children: description }),
+        description && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("p", { className: "mt-0.5 text-xs leading-relaxed text-muted-foreground", children: description }),
         children
       ] })
     ] }),
-    preview && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "shrink-0 text-right", children: preview })
+    preview && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "shrink-0 text-right", children: preview })
   ] });
   const cardClassName = cn(
     "w-full rounded-2xl border p-4 text-left transition-all duration-200",
@@ -6691,14 +6805,14 @@ function SelectableCard({
     className
   );
   if (onClick) {
-    return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("button", { type: "button", onClick, className: cardClassName, children: content });
+    return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("button", { type: "button", onClick, className: cardClassName, children: content });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: cardClassName, children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: cardClassName, children: content });
 }
 
 // src/web/components/mobile-hero-animation.tsx
 var import_react13 = require("react");
-var import_jsx_runtime74 = require("react/jsx-runtime");
+var import_jsx_runtime76 = require("react/jsx-runtime");
 var PROTOCOLS = [
   { name: "Bitcoin", network: "Bitcoin", iconSuffix: "bitcoin/bitcoin-logo.svg" },
   { name: "Lightning", network: "LN", iconSuffix: "lightning/lightning.svg" },
@@ -6757,15 +6871,15 @@ var MobileHeroAnimation = ({
   }, []);
   const anim = !reducedMotion && isVisible;
   const scale = size / 280;
-  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
     "div",
     {
       ref: containerRef,
       className,
       style: { position: "relative", width: size, height: size },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("style", { children: KEYFRAMES }),
-        /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { style: {
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("style", { children: KEYFRAMES }),
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { style: {
           position: "absolute",
           top: 0,
           left: 0,
@@ -6774,7 +6888,7 @@ var MobileHeroAnimation = ({
           transformOrigin: "top left",
           transform: scale !== 1 ? `scale(${scale})` : void 0
         }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
             "svg",
             {
               viewBox: "0 0 280 280",
@@ -6783,34 +6897,34 @@ var MobileHeroAnimation = ({
               style: { position: "absolute", inset: 0 },
               xmlns: "http://www.w3.org/2000/svg",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("defs", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("radialGradient", { id: "mh-center-glow", cx: "50%", cy: "50%", r: "50%", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { offset: "0%", stopColor: "#0e9dff", stopOpacity: "0.3" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { offset: "40%", stopColor: "#8a5cf6", stopOpacity: "0.15" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { offset: "100%", stopColor: "transparent", stopOpacity: "0" })
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("defs", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("radialGradient", { id: "mh-center-glow", cx: "50%", cy: "50%", r: "50%", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("stop", { offset: "0%", stopColor: "#0e9dff", stopOpacity: "0.3" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("stop", { offset: "40%", stopColor: "#8a5cf6", stopOpacity: "0.15" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("stop", { offset: "100%", stopColor: "transparent", stopOpacity: "0" })
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("linearGradient", { id: "mh-gp", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { offset: "0%", stopColor: "#22c55e" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6" })
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("linearGradient", { id: "mh-gp", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("stop", { offset: "0%", stopColor: "#22c55e" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6" })
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("linearGradient", { id: "mh-bp", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { offset: "0%", stopColor: "#0e9dff" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6" })
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("linearGradient", { id: "mh-bp", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("stop", { offset: "0%", stopColor: "#0e9dff" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6" })
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("filter", { id: "mh-glow", x: "-50%", y: "-50%", width: "200%", height: "200%", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("feGaussianBlur", { stdDeviation: "2.5", result: "blur" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("feMerge", { children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("feMergeNode", { in: "blur" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("feMergeNode", { in: "SourceGraphic" })
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("filter", { id: "mh-glow", x: "-50%", y: "-50%", width: "200%", height: "200%", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("feGaussianBlur", { stdDeviation: "2.5", result: "blur" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("feMerge", { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("feMergeNode", { in: "blur" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("feMergeNode", { in: "SourceGraphic" })
                     ] })
                   ] })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("circle", { cx: C, cy: C, r: ORBIT_R, fill: "none", stroke: "#0e9dff", strokeWidth: "1", strokeOpacity: "0.25", opacity: "0.4", children: anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "r", values: `${ORBIT_R};${Math.round(ORBIT_R * 1.12)};${ORBIT_R}`, dur: "2.5s", repeatCount: "indefinite" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "opacity", values: "0.4;0;0.4", dur: "2.5s", repeatCount: "indefinite" })
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("circle", { cx: C, cy: C, r: ORBIT_R, fill: "none", stroke: "#0e9dff", strokeWidth: "1", strokeOpacity: "0.25", opacity: "0.4", children: anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "r", values: `${ORBIT_R};${Math.round(ORBIT_R * 1.12)};${ORBIT_R}`, dur: "2.5s", repeatCount: "indefinite" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "opacity", values: "0.4;0;0.4", dur: "2.5s", repeatCount: "indefinite" })
                 ] }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("circle", { cx: C, cy: C, r: 80, fill: "none", stroke: "rgba(255,255,255,0.1)", strokeWidth: "1", strokeDasharray: "4 4" }),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("circle", { cx: C, cy: C, r: 80, fill: "none", stroke: "rgba(255,255,255,0.1)", strokeWidth: "1", strokeDasharray: "4 4" }),
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
                   "g",
                   {
                     style: {
@@ -6828,8 +6942,8 @@ var MobileHeroAnimation = ({
                       const y2 = C + dy * (ORBIT_R - BADGE_HALF);
                       const color = PROTOCOL_COLORS[protocol.network] ?? "#ffffff";
                       const dur = `${2 + i * 0.3}s`;
-                      return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("g", { children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+                      return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("g", { children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
                           "line",
                           {
                             x1,
@@ -6840,30 +6954,30 @@ var MobileHeroAnimation = ({
                             strokeWidth: "0.8",
                             strokeDasharray: "2 4",
                             opacity: "0.25",
-                            children: anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-12", dur: `${1.5 + i * 0.2}s`, repeatCount: "indefinite" })
+                            children: anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-12", dur: `${1.5 + i * 0.2}s`, repeatCount: "indefinite" })
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("circle", { r: "2", fill: color, opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "cx", values: `${x1};${x2}`, dur, repeatCount: "indefinite" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "cy", values: `${y1};${y2}`, dur, repeatCount: "indefinite" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "opacity", values: "0;0.85;0", dur, repeatCount: "indefinite" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "r", values: "1.5;2.5;1.5", dur, repeatCount: "indefinite" })
+                        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("circle", { r: "2", fill: color, opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "cx", values: `${x1};${x2}`, dur, repeatCount: "indefinite" }),
+                          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "cy", values: `${y1};${y2}`, dur, repeatCount: "indefinite" }),
+                          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "opacity", values: "0;0.85;0", dur, repeatCount: "indefinite" }),
+                          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "r", values: "1.5;2.5;1.5", dur, repeatCount: "indefinite" })
                         ] }) })
                       ] }, `line-${i}`);
                     })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("circle", { cx: C, cy: C, r: "42", fill: "url(#mh-center-glow)", children: anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "r", values: "38;46;38", dur: "4s", repeatCount: "indefinite" }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("circle", { cx: C, cy: C, r: "29", fill: "none", stroke: "url(#mh-bp)", strokeWidth: "1", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "r", values: "27;38", dur: "3s", repeatCount: "indefinite" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "opacity", values: "0.4;0", dur: "3s", repeatCount: "indefinite" })
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("circle", { cx: C, cy: C, r: "42", fill: "url(#mh-center-glow)", children: anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "r", values: "38;46;38", dur: "4s", repeatCount: "indefinite" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("circle", { cx: C, cy: C, r: "29", fill: "none", stroke: "url(#mh-bp)", strokeWidth: "1", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "r", values: "27;38", dur: "3s", repeatCount: "indefinite" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "opacity", values: "0.4;0", dur: "3s", repeatCount: "indefinite" })
                 ] }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("circle", { cx: C, cy: C, r: "27", fill: "none", stroke: "url(#mh-gp)", strokeWidth: "0.8", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "r", values: "27;36", dur: "3s", repeatCount: "indefinite", begin: "1.5s" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "opacity", values: "0.3;0", dur: "3s", repeatCount: "indefinite", begin: "1.5s" })
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("circle", { cx: C, cy: C, r: "27", fill: "none", stroke: "url(#mh-gp)", strokeWidth: "0.8", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "r", values: "27;36", dur: "3s", repeatCount: "indefinite", begin: "1.5s" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "opacity", values: "0.3;0", dur: "3s", repeatCount: "indefinite", begin: "1.5s" })
                 ] }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("g", { transform: `translate(${C},${C})`, children: /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("g", { children: [
-                  anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("g", { transform: `translate(${C},${C})`, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("g", { children: [
+                  anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
                     "animateTransform",
                     {
                       attributeName: "transform",
@@ -6875,13 +6989,13 @@ var MobileHeroAnimation = ({
                       additive: "sum"
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("path", { d: hexPath(34), fill: "none", stroke: "url(#mh-gp)", strokeWidth: "1.5", opacity: "0.4", filter: "url(#mh-glow)", children: anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "opacity", values: "0.3;0.65;0.3", dur: "3s", repeatCount: "indefinite" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("animate", { attributeName: "stroke-width", values: "1.5;2.5;1.5", dur: "3s", repeatCount: "indefinite" })
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("path", { d: hexPath(34), fill: "none", stroke: "url(#mh-gp)", strokeWidth: "1.5", opacity: "0.4", filter: "url(#mh-glow)", children: anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "opacity", values: "0.3;0.65;0.3", dur: "3s", repeatCount: "indefinite" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("animate", { attributeName: "stroke-width", values: "1.5;2.5;1.5", dur: "3s", repeatCount: "indefinite" })
                   ] }) })
                 ] }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("g", { transform: `translate(${C},${C})`, children: /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("g", { children: [
-                  anim && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("g", { transform: `translate(${C},${C})`, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("g", { children: [
+                  anim && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
                     "animateTransform",
                     {
                       attributeName: "transform",
@@ -6893,19 +7007,19 @@ var MobileHeroAnimation = ({
                       additive: "sum"
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("path", { d: hexPath(32), fill: "rgba(10,15,30,0.75)", stroke: "rgba(255,255,255,0.08)", strokeWidth: "0.5" })
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("path", { d: hexPath(32), fill: "rgba(10,15,30,0.75)", stroke: "rgba(255,255,255,0.08)", strokeWidth: "0.5" })
                 ] }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("g", { transform: `translate(${C - 18.8},${C - 18.8}) scale(0.0912)`, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("path", { d: "M137.306 411.865H0.000244141L68.6795 343.29L137.306 411.865Z", fill: "#6F32FF" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("path", { d: "M0 0H137.306L68.6267 68.574L0 0Z", fill: "#6F32FF" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("path", { d: "M137.148 274.559H274.455L411.708 411.866H274.401L137.148 274.559Z", fill: "#17B581" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("path", { d: "M137.149 274.559L68.6274 205.933L137.201 137.306L274.455 137.411L205.776 206.038L274.456 274.559H137.149Z", fill: "#15E99A" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("path", { d: "M274.479 0.104797H411.786L274.533 137.411H137.226L274.479 0.104797Z", fill: "#17B581" })
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("g", { transform: `translate(${C - 18.8},${C - 18.8}) scale(0.0912)`, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("path", { d: "M137.306 411.865H0.000244141L68.6795 343.29L137.306 411.865Z", fill: "#6F32FF" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("path", { d: "M0 0H137.306L68.6267 68.574L0 0Z", fill: "#6F32FF" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("path", { d: "M137.148 274.559H274.455L411.708 411.866H274.401L137.148 274.559Z", fill: "#17B581" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("path", { d: "M137.149 274.559L68.6274 205.933L137.201 137.306L274.455 137.411L205.776 206.038L274.456 274.559H137.149Z", fill: "#15E99A" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("path", { d: "M274.479 0.104797H411.786L274.533 137.411H137.226L274.479 0.104797Z", fill: "#17B581" })
                 ] })
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { style: {
+          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { style: {
             position: "absolute",
             inset: 0,
             width: 280,
@@ -6916,7 +7030,7 @@ var MobileHeroAnimation = ({
             const x = C + Math.cos(angle) * ORBIT_R - BADGE_HALF;
             const y = C + Math.sin(angle) * ORBIT_R - BADGE_HALF;
             const color = PROTOCOL_COLORS[protocol.network] ?? "#ffffff";
-            return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
               "div",
               {
                 style: {
@@ -6927,7 +7041,7 @@ var MobileHeroAnimation = ({
                   height: BADGE_SIZE,
                   animation: anim ? "mha-counter-spin 20s linear infinite" : "none"
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { style: {
+                children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { style: {
                   width: "100%",
                   height: "100%",
                   borderRadius: "50%",
@@ -6938,7 +7052,7 @@ var MobileHeroAnimation = ({
                   display: "flex",
                   alignItems: "center",
                   justifyContent: "center"
-                }, children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+                }, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
                   "img",
                   {
                     src: iconBasePath ? `${iconBasePath}/${protocol.iconSuffix}` : protocolIcons[protocol.network] ?? protocol.iconSuffix,
@@ -6958,7 +7072,7 @@ var MobileHeroAnimation = ({
 
 // src/web/components/kaleidoscope-hero-animation.tsx
 var import_react14 = require("react");
-var import_jsx_runtime75 = require("react/jsx-runtime");
+var import_jsx_runtime77 = require("react/jsx-runtime");
 var PROTOCOLS2 = [
   { name: "Bitcoin L1", network: "L1", color: "#F7931A", glowColor: "rgba(247,147,26,0.5)" },
   { name: "Lightning", network: "LN", color: "#fbbf24", glowColor: "rgba(251,191,36,0.5)" },
@@ -7063,13 +7177,13 @@ var KaleidoScopeHeroAnimation = ({
     const angle = Math.PI * 2 * i / 7 - Math.PI / 2;
     return { x: c + orbitR * Math.cos(angle), y: c + orbitR * Math.sin(angle) };
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
     "div",
     {
       ref: containerRef,
       className: `relative ${className}`,
       style: size ? { width: size, height: size } : void 0,
-      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
         "svg",
         {
           viewBox: "0 0 500 500",
@@ -7078,60 +7192,60 @@ var KaleidoScopeHeroAnimation = ({
           xmlns: "http://www.w3.org/2000/svg",
           className: "overflow-visible",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("defs", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("linearGradient", { id: "kh-grad-a", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "0%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stop-color", values: "#22c55e;#8a5cf6;#06b6d4;#F7931A;#22c55e", dur: "10s", repeatCount: "indefinite" }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "100%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stop-color", values: "#8a5cf6;#F7931A;#22c55e;#06b6d4;#8a5cf6", dur: "10s", repeatCount: "indefinite" }) })
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("defs", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("linearGradient", { id: "kh-grad-a", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "0%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stop-color", values: "#22c55e;#8a5cf6;#06b6d4;#F7931A;#22c55e", dur: "10s", repeatCount: "indefinite" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stop-color", values: "#8a5cf6;#F7931A;#22c55e;#06b6d4;#8a5cf6", dur: "10s", repeatCount: "indefinite" }) })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("linearGradient", { id: "kh-grad-b", x1: "100%", y1: "0%", x2: "0%", y2: "100%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "0%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stop-color", values: "#06b6d4;#22c55e;#F7931A;#8a5cf6;#06b6d4", dur: "8s", repeatCount: "indefinite" }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "100%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stop-color", values: "#F7931A;#06b6d4;#8a5cf6;#22c55e;#F7931A", dur: "8s", repeatCount: "indefinite" }) })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("linearGradient", { id: "kh-grad-b", x1: "100%", y1: "0%", x2: "0%", y2: "100%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "0%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stop-color", values: "#06b6d4;#22c55e;#F7931A;#8a5cf6;#06b6d4", dur: "8s", repeatCount: "indefinite" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stop-color", values: "#F7931A;#06b6d4;#8a5cf6;#22c55e;#F7931A", dur: "8s", repeatCount: "indefinite" }) })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("linearGradient", { id: "kh-grad-c", x1: "50%", y1: "0%", x2: "50%", y2: "100%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "0%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stop-color", values: "#0e9dff;#8a5cf6;#15E99A;#0e9dff", dur: "6s", repeatCount: "indefinite" }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "100%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stop-color", values: "#8a5cf6;#15E99A;#0e9dff;#8a5cf6", dur: "6s", repeatCount: "indefinite" }) })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("linearGradient", { id: "kh-grad-c", x1: "50%", y1: "0%", x2: "50%", y2: "100%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "0%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stop-color", values: "#0e9dff;#8a5cf6;#15E99A;#0e9dff", dur: "6s", repeatCount: "indefinite" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stop-color", values: "#8a5cf6;#15E99A;#0e9dff;#8a5cf6", dur: "6s", repeatCount: "indefinite" }) })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("linearGradient", { id: "kh-gp", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "0%", stopColor: "#22c55e" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("linearGradient", { id: "kh-gp", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "0%", stopColor: "#22c55e" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("linearGradient", { id: "kh-oc", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "0%", stopColor: "#F7931A" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "100%", stopColor: "#06b6d4" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("linearGradient", { id: "kh-oc", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "0%", stopColor: "#F7931A" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", stopColor: "#06b6d4" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("linearGradient", { id: "kh-bp", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "0%", stopColor: "#0e9dff" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("linearGradient", { id: "kh-bp", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "0%", stopColor: "#0e9dff" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("radialGradient", { id: "kh-center-glow", cx: "50%", cy: "50%", r: "50%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "0%", stopColor: "#0e9dff", stopOpacity: "0.3" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "40%", stopColor: "#8a5cf6", stopOpacity: "0.15" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "100%", stopColor: "transparent", stopOpacity: "0" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("radialGradient", { id: "kh-center-glow", cx: "50%", cy: "50%", r: "50%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "0%", stopColor: "#0e9dff", stopOpacity: "0.3" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "40%", stopColor: "#8a5cf6", stopOpacity: "0.15" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", stopColor: "transparent", stopOpacity: "0" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("radialGradient", { id: "kh-haze", cx: "50%", cy: "50%", r: "50%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "0%", stopColor: "transparent", stopOpacity: "0" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "60%", stopColor: "#0e9dff", stopOpacity: "0.03" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6", stopOpacity: "0.06" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("radialGradient", { id: "kh-haze", cx: "50%", cy: "50%", r: "50%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "0%", stopColor: "transparent", stopOpacity: "0" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "60%", stopColor: "#0e9dff", stopOpacity: "0.03" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", stopColor: "#8a5cf6", stopOpacity: "0.06" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("filter", { id: "kh-glow", x: "-50%", y: "-50%", width: "200%", height: "200%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("feGaussianBlur", { stdDeviation: "3", result: "blur" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("feMerge", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("feMergeNode", { in: "blur" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("feMergeNode", { in: "SourceGraphic" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("filter", { id: "kh-glow", x: "-50%", y: "-50%", width: "200%", height: "200%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("feGaussianBlur", { stdDeviation: "3", result: "blur" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("feMerge", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("feMergeNode", { in: "blur" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("feMergeNode", { in: "SourceGraphic" })
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("filter", { id: "kh-glow-lg", x: "-50%", y: "-50%", width: "200%", height: "200%", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("feGaussianBlur", { stdDeviation: "8", result: "blur" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("feMerge", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("feMergeNode", { in: "blur" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("feMergeNode", { in: "SourceGraphic" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("filter", { id: "kh-glow-lg", x: "-50%", y: "-50%", width: "200%", height: "200%", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("feGaussianBlur", { stdDeviation: "8", result: "blur" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("feMerge", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("feMergeNode", { in: "blur" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("feMergeNode", { in: "SourceGraphic" })
                 ] })
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("circle", { cx: c, cy: c, r: "248", fill: "url(#kh-haze)" }),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { transform: px(20), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-                anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("circle", { cx: c, cy: c, r: "248", fill: "url(#kh-haze)" }),
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { transform: px(20), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+                anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                   "animateTransform",
                   {
                     attributeName: "transform",
@@ -7144,14 +7258,14 @@ var KaleidoScopeHeroAnimation = ({
                 ),
                 Array.from({ length: 6 }, (_, i) => {
                   const a = Math.PI / 3 * i;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { transform: `translate(${c + outerR1 * Math.cos(a)},${c + outerR1 * Math.sin(a)})`, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: hexPath2(40), fill: "url(#kh-grad-a)", opacity: 0.08 + i % 3 * 0.04 }),
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: hexPath2(40), fill: "none", stroke: "url(#kh-grad-a)", strokeWidth: "0.5", opacity: 0.15, children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.1;0.25;0.1", dur: `${4 + i * 0.3}s`, repeatCount: "indefinite" }) })
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { transform: `translate(${c + outerR1 * Math.cos(a)},${c + outerR1 * Math.sin(a)})`, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: hexPath2(40), fill: "url(#kh-grad-a)", opacity: 0.08 + i % 3 * 0.04 }),
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: hexPath2(40), fill: "none", stroke: "url(#kh-grad-a)", strokeWidth: "0.5", opacity: 0.15, children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.1;0.25;0.1", dur: `${4 + i * 0.3}s`, repeatCount: "indefinite" }) })
                   ] }, `ha-${i}`);
                 }),
                 Array.from({ length: 6 }, (_, i) => {
                   const a = Math.PI / 3 * i + Math.PI / 6;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     "path",
                     {
                       d: triPath(14),
@@ -7164,7 +7278,7 @@ var KaleidoScopeHeroAnimation = ({
                 }),
                 Array.from({ length: 12 }, (_, i) => {
                   const a = Math.PI / 6 * i;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     "circle",
                     {
                       cx: c + outerR1 * 0.92 * Math.cos(a),
@@ -7172,14 +7286,14 @@ var KaleidoScopeHeroAnimation = ({
                       r: "1.5",
                       fill: "url(#kh-grad-a)",
                       opacity: "0.15",
-                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.08;0.25;0.08", dur: `${2 + i % 3 * 0.7}s`, repeatCount: "indefinite" })
+                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.08;0.25;0.08", dur: `${2 + i % 3 * 0.7}s`, repeatCount: "indefinite" })
                     },
                     `od-${i}`
                   );
                 })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-                anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+                anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                   "animateTransform",
                   {
                     attributeName: "transform",
@@ -7192,28 +7306,28 @@ var KaleidoScopeHeroAnimation = ({
                 ),
                 Array.from({ length: 6 }, (_, i) => {
                   const a = Math.PI / 3 * i + Math.PI / 6;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { transform: `translate(${c + outerR2 * Math.cos(a)},${c + outerR2 * Math.sin(a)})`, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: hexPath2(30), fill: "url(#kh-grad-b)", opacity: 0.06 + i % 2 * 0.04 }),
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: hexPath2(30), fill: "none", stroke: "url(#kh-grad-b)", strokeWidth: "0.5", opacity: 0.12 })
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { transform: `translate(${c + outerR2 * Math.cos(a)},${c + outerR2 * Math.sin(a)})`, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: hexPath2(30), fill: "url(#kh-grad-b)", opacity: 0.06 + i % 2 * 0.04 }),
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: hexPath2(30), fill: "none", stroke: "url(#kh-grad-b)", strokeWidth: "0.5", opacity: 0.12 })
                   ] }, `hb-${i}`);
                 }),
                 Array.from({ length: 6 }, (_, i) => {
                   const a = Math.PI / 3 * i;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     "path",
                     {
                       d: diamondPath(8, 16),
                       transform: `translate(${c + outerR2 * 0.85 * Math.cos(a)},${c + outerR2 * 0.85 * Math.sin(a)}) rotate(${i * 60})`,
                       fill: "url(#kh-grad-b)",
                       opacity: "0.08",
-                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.05;0.15;0.05", dur: `${3.5 + i * 0.4}s`, repeatCount: "indefinite" })
+                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.05;0.15;0.05", dur: `${3.5 + i * 0.4}s`, repeatCount: "indefinite" })
                     },
                     `db-${i}`
                   );
                 })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-                anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+                anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                   "animateTransform",
                   {
                     attributeName: "transform",
@@ -7227,23 +7341,23 @@ var KaleidoScopeHeroAnimation = ({
                 Array.from({ length: 12 }, (_, i) => {
                   const a = Math.PI / 6 * i;
                   const r = outerR1 * (0.6 + i % 2 * 0.15);
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     "path",
                     {
                       d: triPath(10),
                       transform: `translate(${c + r * Math.cos(a)},${c + r * Math.sin(a)}) rotate(${i * 30 + 15})`,
                       fill: "url(#kh-grad-c)",
                       opacity: "0.05",
-                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.03;0.1;0.03", dur: `${5 + i % 4 * 0.8}s`, repeatCount: "indefinite" })
+                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.03;0.1;0.03", dur: `${5 + i % 4 * 0.8}s`, repeatCount: "indefinite" })
                     },
                     `tc-${i}`
                   );
                 })
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { transform: px(14), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-                anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { transform: px(14), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+                anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                   "animateTransform",
                   {
                     attributeName: "transform",
@@ -7256,9 +7370,9 @@ var KaleidoScopeHeroAnimation = ({
                 ),
                 Array.from({ length: 12 }, (_, i) => {
                   const a = Math.PI / 6 * i;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { transform: `translate(${c + midR * Math.cos(a)},${c + midR * Math.sin(a)})`, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: hexPath2(12), fill: "url(#kh-grad-c)", opacity: 0.08 + i % 3 * 0.03 }),
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: hexPath2(12), fill: "none", stroke: "url(#kh-grad-c)", strokeWidth: "0.4", opacity: "0.12", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.08;0.2;0.08", dur: `${3 + i % 4 * 0.5}s`, repeatCount: "indefinite" }) })
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { transform: `translate(${c + midR * Math.cos(a)},${c + midR * Math.sin(a)})`, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: hexPath2(12), fill: "url(#kh-grad-c)", opacity: 0.08 + i % 3 * 0.03 }),
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: hexPath2(12), fill: "none", stroke: "url(#kh-grad-c)", strokeWidth: "0.4", opacity: "0.12", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.08;0.2;0.08", dur: `${3 + i % 4 * 0.5}s`, repeatCount: "indefinite" }) })
                   ] }, `mh-${i}`);
                 })
               ] }),
@@ -7269,7 +7383,7 @@ var KaleidoScopeHeroAnimation = ({
                 const y1 = c + midR * Math.sin(a1);
                 const x2 = c + midR * Math.cos(a2);
                 const y2 = c + midR * Math.sin(a2);
-                return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                   "path",
                   {
                     d: `M${x1},${y1} Q${c},${c} ${x2},${y2}`,
@@ -7278,17 +7392,17 @@ var KaleidoScopeHeroAnimation = ({
                     strokeWidth: "0.5",
                     strokeDasharray: "3 5",
                     opacity: "0.1",
-                    children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-16", dur: `${3 + i * 0.2}s`, repeatCount: "indefinite" })
+                    children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-16", dur: `${3 + i * 0.2}s`, repeatCount: "indefinite" })
                   },
                   `arc-${i}`
                 );
               })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { transform: px(10), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("circle", { cx: c, cy: c, r: orbitR, fill: "none", stroke: "rgba(255,255,255,0.05)", strokeWidth: "1", strokeDasharray: "3 5", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animateTransform", { attributeName: "transform", type: "rotate", from: `0 ${c} ${c}`, to: `360 ${c} ${c}`, dur: "90s", repeatCount: "indefinite" }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("circle", { cx: c, cy: c, r: orbitR + 4, fill: "none", stroke: "rgba(255,255,255,0.03)", strokeWidth: "0.5" }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-                anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { transform: px(10), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("circle", { cx: c, cy: c, r: orbitR, fill: "none", stroke: "rgba(255,255,255,0.05)", strokeWidth: "1", strokeDasharray: "3 5", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animateTransform", { attributeName: "transform", type: "rotate", from: `0 ${c} ${c}`, to: `360 ${c} ${c}`, dur: "90s", repeatCount: "indefinite" }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("circle", { cx: c, cy: c, r: orbitR + 4, fill: "none", stroke: "rgba(255,255,255,0.03)", strokeWidth: "0.5" }),
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+                anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                   "animateTransform",
                   {
                     attributeName: "transform",
@@ -7303,8 +7417,8 @@ var KaleidoScopeHeroAnimation = ({
                   const angle = Math.atan2(pos.y - c, pos.x - c);
                   const dx = Math.cos(angle);
                   const dy = Math.sin(angle);
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                       "line",
                       {
                         x1: c + dx * 52,
@@ -7315,14 +7429,14 @@ var KaleidoScopeHeroAnimation = ({
                         strokeWidth: "0.8",
                         strokeDasharray: "2 4",
                         opacity: "0.2",
-                        children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-12", dur: `${1.5 + i * 0.2}s`, repeatCount: "indefinite" })
+                        children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-12", dur: `${1.5 + i * 0.2}s`, repeatCount: "indefinite" })
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("circle", { r: "2.5", fill: PROTOCOLS2[i].color, opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "cx", values: `${c + dx * 52};${pos.x}`, dur: `${2 + i * 0.3}s`, repeatCount: "indefinite" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "cy", values: `${c + dy * 52};${pos.y}`, dur: `${2 + i * 0.3}s`, repeatCount: "indefinite" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0;0.8;0", dur: `${2 + i * 0.3}s`, repeatCount: "indefinite" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "r", values: "1.5;3;1.5", dur: `${2 + i * 0.3}s`, repeatCount: "indefinite" })
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("circle", { r: "2.5", fill: PROTOCOLS2[i].color, opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_jsx_runtime77.Fragment, { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "cx", values: `${c + dx * 52};${pos.x}`, dur: `${2 + i * 0.3}s`, repeatCount: "indefinite" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "cy", values: `${c + dy * 52};${pos.y}`, dur: `${2 + i * 0.3}s`, repeatCount: "indefinite" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0;0.8;0", dur: `${2 + i * 0.3}s`, repeatCount: "indefinite" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "r", values: "1.5;3;1.5", dur: `${2 + i * 0.3}s`, repeatCount: "indefinite" })
                     ] }) })
                   ] }, `conn-${i}`);
                 }),
@@ -7330,14 +7444,14 @@ var KaleidoScopeHeroAnimation = ({
                   const pos = iconPositions[i];
                   const labelWidth = Math.max(proto.name.length * 5.5 + 10, 32);
                   const isHovered = hoveredProtocol === proto.name;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("g", { transform: `translate(${pos.x},${pos.y})`, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("g", { transform: `translate(${pos.x},${pos.y})`, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
                     "g",
                     {
                       onMouseEnter: () => setHoveredProtocol(proto.name),
                       onMouseLeave: () => setHoveredProtocol(null),
                       style: { cursor: "pointer" },
                       children: [
-                        anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                        anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                           "animateTransform",
                           {
                             attributeName: "transform",
@@ -7348,7 +7462,7 @@ var KaleidoScopeHeroAnimation = ({
                             repeatCount: "indefinite"
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                           "circle",
                           {
                             cx: "0",
@@ -7358,13 +7472,13 @@ var KaleidoScopeHeroAnimation = ({
                             stroke: proto.color,
                             strokeWidth: "1",
                             opacity: "0",
-                            children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "r", values: `${iconR};${iconR + 12}`, dur: `${3 + i * 0.5}s`, repeatCount: "indefinite", begin: `${i * 0.4}s` }),
-                              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.5;0", dur: `${3 + i * 0.5}s`, repeatCount: "indefinite", begin: `${i * 0.4}s` })
+                            children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_jsx_runtime77.Fragment, { children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "r", values: `${iconR};${iconR + 12}`, dur: `${3 + i * 0.5}s`, repeatCount: "indefinite", begin: `${i * 0.4}s` }),
+                              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.5;0", dur: `${3 + i * 0.5}s`, repeatCount: "indefinite", begin: `${i * 0.4}s` })
                             ] })
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                           "circle",
                           {
                             cx: "0",
@@ -7374,10 +7488,10 @@ var KaleidoScopeHeroAnimation = ({
                             stroke: proto.color,
                             strokeWidth: "1",
                             opacity: "0.15",
-                            children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.15;0.4;0.15", dur: `${3 + i * 0.4}s`, repeatCount: "indefinite" })
+                            children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.15;0.4;0.15", dur: `${3 + i * 0.4}s`, repeatCount: "indefinite" })
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                           "circle",
                           {
                             cx: "0",
@@ -7387,10 +7501,10 @@ var KaleidoScopeHeroAnimation = ({
                             stroke: proto.color,
                             strokeWidth: "1.5",
                             opacity: "0.25",
-                            children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.2;0.5;0.2", dur: `${2.5 + i * 0.3}s`, repeatCount: "indefinite" })
+                            children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.2;0.5;0.2", dur: `${2.5 + i * 0.3}s`, repeatCount: "indefinite" })
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                           "circle",
                           {
                             cx: "0",
@@ -7401,8 +7515,8 @@ var KaleidoScopeHeroAnimation = ({
                             strokeWidth: "1"
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("circle", { cx: "0", cy: "0", r: iconR - 2, fill: proto.color, opacity: "0.06" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("foreignObject", { x: -iconR, y: -iconR, width: iconR * 2, height: iconR * 2, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("circle", { cx: "0", cy: "0", r: iconR - 2, fill: proto.color, opacity: "0.06" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("foreignObject", { x: -iconR, y: -iconR, width: iconR * 2, height: iconR * 2, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                           NetworkBadge,
                           {
                             network: proto.network,
@@ -7410,8 +7524,8 @@ var KaleidoScopeHeroAnimation = ({
                             className: "w-full h-full"
                           }
                         ) }),
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { opacity: isHovered ? 1 : 0, style: { transition: "opacity 0.2s ease" }, children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                        /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { opacity: isHovered ? 1 : 0, style: { transition: "opacity 0.2s ease" }, children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                             "rect",
                             {
                               x: -labelWidth / 2,
@@ -7425,7 +7539,7 @@ var KaleidoScopeHeroAnimation = ({
                               strokeOpacity: 0.4
                             }
                           ),
-                          /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                          /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                             "text",
                             {
                               x: "0",
@@ -7445,9 +7559,9 @@ var KaleidoScopeHeroAnimation = ({
                 })
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { transform: px(5), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-                anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { transform: px(5), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+                anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                   "animateTransform",
                   {
                     attributeName: "transform",
@@ -7460,28 +7574,28 @@ var KaleidoScopeHeroAnimation = ({
                 ),
                 Array.from({ length: 6 }, (_, i) => {
                   const a = Math.PI / 3 * i;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     "path",
                     {
                       d: diamondPath(10, 22),
                       transform: `translate(${c + innerR * Math.cos(a)},${c + innerR * Math.sin(a)}) rotate(${i * 60})`,
                       fill: "url(#kh-gp)",
                       opacity: "0.15",
-                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.1;0.28;0.1", dur: `${2.8 + i * 0.35}s`, repeatCount: "indefinite" })
+                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.1;0.28;0.1", dur: `${2.8 + i * 0.35}s`, repeatCount: "indefinite" })
                     },
                     `d-${i}`
                   );
                 }),
                 Array.from({ length: 6 }, (_, i) => {
                   const a = Math.PI / 3 * i + Math.PI / 6;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     "path",
                     {
                       d: triPath(8),
                       transform: `translate(${c + innerR * 0.75 * Math.cos(a)},${c + innerR * 0.75 * Math.sin(a)}) rotate(${i * 60 + 30})`,
                       fill: "url(#kh-oc)",
                       opacity: "0.1",
-                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.06;0.18;0.06", dur: `${3.2 + i * 0.3}s`, repeatCount: "indefinite" })
+                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.06;0.18;0.06", dur: `${3.2 + i * 0.3}s`, repeatCount: "indefinite" })
                     },
                     `it-${i}`
                   );
@@ -7489,7 +7603,7 @@ var KaleidoScopeHeroAnimation = ({
                 Array.from({ length: 12 }, (_, i) => {
                   const a = Math.PI / 6 * i;
                   const r = innerR * (i % 2 === 0 ? 0.55 : 0.65);
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     "circle",
                     {
                       cx: c + r * Math.cos(a),
@@ -7497,14 +7611,14 @@ var KaleidoScopeHeroAnimation = ({
                       r: i % 2 === 0 ? 2 : 1.5,
                       fill: "url(#kh-oc)",
                       opacity: "0.2",
-                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.1;0.35;0.1", dur: `${2 + i % 4 * 0.5}s`, repeatCount: "indefinite" })
+                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.1;0.35;0.1", dur: `${2 + i % 4 * 0.5}s`, repeatCount: "indefinite" })
                     },
                     `id-${i}`
                   );
                 })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-                anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+                anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                   "animateTransform",
                   {
                     attributeName: "transform",
@@ -7517,27 +7631,27 @@ var KaleidoScopeHeroAnimation = ({
                 ),
                 Array.from({ length: 6 }, (_, i) => {
                   const a = Math.PI / 3 * i + Math.PI / 6;
-                  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     "path",
                     {
                       d: hexPath2(6),
                       transform: `translate(${c + innerR * 0.42 * Math.cos(a)},${c + innerR * 0.42 * Math.sin(a)})`,
                       fill: "url(#kh-bp)",
                       opacity: "0.1",
-                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.06;0.18;0.06", dur: `${2.5 + i * 0.3}s`, repeatCount: "indefinite" })
+                      children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.06;0.18;0.06", dur: `${2.5 + i * 0.3}s`, repeatCount: "indefinite" })
                     },
                     `ih-${i}`
                   );
                 })
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("g", { transform: px(18), children: Array.from({ length: 16 }, (_, i) => {
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("g", { transform: px(18), children: Array.from({ length: 16 }, (_, i) => {
               const a = Math.PI * 2 * i / 16;
               const baseR = 60 + i % 4 * 45;
               const x = c + baseR * Math.cos(a);
               const y = c + baseR * Math.sin(a);
               const colors2 = ["#0e9dff", "#8a5cf6", "#22c55e", "#F7931A", "#06b6d4", "#15E99A"];
-              return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                 "circle",
                 {
                   cx: x,
@@ -7545,26 +7659,26 @@ var KaleidoScopeHeroAnimation = ({
                   r: 1 + i % 3 * 0.5,
                   fill: colors2[i % colors2.length],
                   opacity: "0",
-                  children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0;0.6;0", dur: `${3 + i % 5 * 0.8}s`, repeatCount: "indefinite", begin: `${i % 7 * 0.5}s` }),
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "cx", values: `${x};${x + Math.cos(a) * 15}`, dur: `${4 + i % 3 * 1.5}s`, repeatCount: "indefinite", begin: `${i % 7 * 0.5}s` }),
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "cy", values: `${y};${y + Math.sin(a) * 15}`, dur: `${4 + i % 3 * 1.5}s`, repeatCount: "indefinite", begin: `${i % 7 * 0.5}s` })
+                  children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_jsx_runtime77.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0;0.6;0", dur: `${3 + i % 5 * 0.8}s`, repeatCount: "indefinite", begin: `${i % 7 * 0.5}s` }),
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "cx", values: `${x};${x + Math.cos(a) * 15}`, dur: `${4 + i % 3 * 1.5}s`, repeatCount: "indefinite", begin: `${i % 7 * 0.5}s` }),
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "cy", values: `${y};${y + Math.sin(a) * 15}`, dur: `${4 + i % 3 * 1.5}s`, repeatCount: "indefinite", begin: `${i % 7 * 0.5}s` })
                   ] })
                 },
                 `p-${i}`
               );
             }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("circle", { cx: c, cy: c, r: "75", fill: "url(#kh-center-glow)", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "r", values: "70;80;70", dur: "4s", repeatCount: "indefinite" }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("circle", { cx: c, cy: c, r: "52", fill: "none", stroke: "url(#kh-bp)", strokeWidth: "1", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "r", values: "48;65", dur: "3s", repeatCount: "indefinite" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.4;0", dur: "3s", repeatCount: "indefinite" })
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("circle", { cx: c, cy: c, r: "75", fill: "url(#kh-center-glow)", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "r", values: "70;80;70", dur: "4s", repeatCount: "indefinite" }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("circle", { cx: c, cy: c, r: "52", fill: "none", stroke: "url(#kh-bp)", strokeWidth: "1", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_jsx_runtime77.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "r", values: "48;65", dur: "3s", repeatCount: "indefinite" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.4;0", dur: "3s", repeatCount: "indefinite" })
               ] }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("circle", { cx: c, cy: c, r: "48", fill: "none", stroke: "url(#kh-gp)", strokeWidth: "0.8", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "r", values: "48;60", dur: "3s", repeatCount: "indefinite", begin: "1.5s" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.3;0", dur: "3s", repeatCount: "indefinite", begin: "1.5s" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("circle", { cx: c, cy: c, r: "48", fill: "none", stroke: "url(#kh-gp)", strokeWidth: "0.8", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_jsx_runtime77.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "r", values: "48;60", dur: "3s", repeatCount: "indefinite", begin: "1.5s" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.3;0", dur: "3s", repeatCount: "indefinite", begin: "1.5s" })
               ] }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                 "path",
                 {
                   d: hexPath2(50),
@@ -7574,13 +7688,13 @@ var KaleidoScopeHeroAnimation = ({
                   strokeWidth: "1.5",
                   opacity: "0.4",
                   filter: "url(#kh-glow)",
-                  children: anim && /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "opacity", values: "0.3;0.65;0.3", dur: "3s", repeatCount: "indefinite" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("animate", { attributeName: "stroke-width", values: "1.5;2.5;1.5", dur: "3s", repeatCount: "indefinite" })
+                  children: anim && /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_jsx_runtime77.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "opacity", values: "0.3;0.65;0.3", dur: "3s", repeatCount: "indefinite" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("animate", { attributeName: "stroke-width", values: "1.5;2.5;1.5", dur: "3s", repeatCount: "indefinite" })
                   ] })
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                 "path",
                 {
                   d: hexPath2(46),
@@ -7590,21 +7704,21 @@ var KaleidoScopeHeroAnimation = ({
                   strokeWidth: "0.5"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("g", { transform: `translate(${c - 34},${c - 34}) scale(0.325)`, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M69.7141 207.3H0.908203L35.3243 172.936L69.7141 207.3Z", fill: "#6F32FF" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M138.441 0.96106V69.767L104.078 35.3508L138.441 0.96106Z", fill: "#17B581" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M138.415 138.547V207.352L104.051 172.936L138.415 138.547Z", fill: "#17B581" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M138.441 69.7406V0.96106L172.804 35.3772L138.441 69.767V69.7406Z", fill: "#17B581" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M69.6614 138.494V69.6879L104.025 104.104L69.6614 138.494Z", fill: "#15E99A" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M69.6615 69.7142V138.52L35.2981 104.104L69.6615 69.7142Z", fill: "#15E99A" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M138.467 207.379V138.573L172.831 172.989L138.467 207.379Z", fill: "#17B581" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M0.908203 0.908325H69.7141L35.298 35.2718L0.908203 0.908325Z", fill: "#6F32FF" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M207.22 207.3H138.415L172.831 172.936L207.22 207.3Z", fill: "#17B581" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M138.415 0.987427H207.22L172.804 35.3509L138.415 0.987427Z", fill: "#17B581" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M138.467 69.7143H69.6614L104.078 35.3508L138.467 69.7143Z", fill: "#17B581" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M69.635 138.494H138.441L104.025 172.857L69.635 138.494Z", fill: "#17B581" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M138.415 138.494H69.635L104.025 104.157L138.388 138.494H138.415Z", fill: "#15E99A" }),
-                /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M138.415 69.7142L104.051 104.051L69.6614 69.7142H138.441H138.415Z", fill: "#15E99A" })
+              /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { transform: `translate(${c - 34},${c - 34}) scale(0.325)`, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M69.7141 207.3H0.908203L35.3243 172.936L69.7141 207.3Z", fill: "#6F32FF" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M138.441 0.96106V69.767L104.078 35.3508L138.441 0.96106Z", fill: "#17B581" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M138.415 138.547V207.352L104.051 172.936L138.415 138.547Z", fill: "#17B581" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M138.441 69.7406V0.96106L172.804 35.3772L138.441 69.767V69.7406Z", fill: "#17B581" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M69.6614 138.494V69.6879L104.025 104.104L69.6614 138.494Z", fill: "#15E99A" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M69.6615 69.7142V138.52L35.2981 104.104L69.6615 69.7142Z", fill: "#15E99A" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M138.467 207.379V138.573L172.831 172.989L138.467 207.379Z", fill: "#17B581" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M0.908203 0.908325H69.7141L35.298 35.2718L0.908203 0.908325Z", fill: "#6F32FF" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M207.22 207.3H138.415L172.831 172.936L207.22 207.3Z", fill: "#17B581" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M138.415 0.987427H207.22L172.804 35.3509L138.415 0.987427Z", fill: "#17B581" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M138.467 69.7143H69.6614L104.078 35.3508L138.467 69.7143Z", fill: "#17B581" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M69.635 138.494H138.441L104.025 172.857L69.635 138.494Z", fill: "#17B581" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M138.415 138.494H69.635L104.025 104.157L138.388 138.494H138.415Z", fill: "#15E99A" }),
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("path", { d: "M138.415 69.7142L104.051 104.051L69.6614 69.7142H138.441H138.415Z", fill: "#15E99A" })
               ] })
             ] })
           ]
@@ -7757,7 +7871,7 @@ var colors = {
 };
 
 // src/web/components/deposit-ui-shared.tsx
-var import_jsx_runtime76 = require("react/jsx-runtime");
+var import_jsx_runtime78 = require("react/jsx-runtime");
 var GLOW_ALPHA = "26";
 function qrGlowStyle(hex) {
   return { boxShadow: `0 0 30px ${hex}${GLOW_ALPHA}` };
@@ -7774,7 +7888,7 @@ var NETWORK_CONFIG = {
     // On-chain uses a chain-link glyph rather than the ₿ coin — the coin reads
     // as "the BTC asset", whereas this row is specifically the *on-chain* (L1)
     // receive rail alongside Lightning/Spark/Arkade, so a chain mark disambiguates.
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "material-symbols-outlined text-icon-xs leading-none", children: "link" })
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "material-symbols-outlined text-icon-xs leading-none", children: "link" })
   },
   lightning: {
     label: "Lightning",
@@ -7784,7 +7898,7 @@ var NETWORK_CONFIG = {
     border: "border-network-lightning/40",
     qrBorder: "border-network-lightning/30",
     qrGlow: qrGlowStyle(colors.network.lightning),
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("img", { src: "/icons/lightning/lightning.svg", className: "size-3", alt: "" })
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("img", { src: "/icons/lightning/lightning.svg", className: "size-3", alt: "" })
   },
   spark: {
     label: "Spark",
@@ -7794,7 +7908,7 @@ var NETWORK_CONFIG = {
     border: "border-info/40",
     qrBorder: "border-info/30",
     qrGlow: qrGlowStyle(colors.info),
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("img", { src: "/icons/spark/Asterisk/Spark Asterisk White.svg", className: "h-3 w-3", alt: "" })
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("img", { src: "/icons/spark/Asterisk/Spark Asterisk White.svg", className: "h-3 w-3", alt: "" })
   },
   arkade: {
     label: "Arkade",
@@ -7804,7 +7918,7 @@ var NETWORK_CONFIG = {
     border: "border-network-arkade/40",
     qrBorder: "border-network-arkade/30",
     qrGlow: qrGlowStyle(colors.network.arkade),
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("img", { src: "/icons/arkade/arkade-icon.svg", className: "h-3 w-3 rounded-sm", alt: "" })
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("img", { src: "/icons/arkade/arkade-icon.svg", className: "h-3 w-3 rounded-sm", alt: "" })
   },
   liquid: {
     label: "Liquid",
@@ -7814,7 +7928,7 @@ var NETWORK_CONFIG = {
     border: "border-network-liquid/40",
     qrBorder: "border-network-liquid/30",
     qrGlow: qrGlowStyle(colors.network.liquid),
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(LiquidNetworkIcon, { className: "h-3 w-3" })
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(LiquidNetworkIcon, { className: "h-3 w-3" })
   }
 };
 var ACCOUNT_META = {
@@ -7825,14 +7939,14 @@ var ACCOUNT_META = {
     accentBorder: "border-primary/30",
     // Bundled RGB mark (protocolIcons) — a host-served /icons/rgb/... path
     // renders as a broken box in consumers that don't ship that asset.
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(RgbNetworkIcon, { className: "h-2.5 w-2.5" })
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(RgbNetworkIcon, { className: "h-2.5 w-2.5" })
   },
   SPARK: {
     shortLabel: "Spark",
     accentBg: "bg-info/10",
     accentText: "text-info",
     accentBorder: "border-info/30",
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
       "img",
       {
         src: "/icons/spark/Asterisk/Spark Asterisk White.svg",
@@ -7846,14 +7960,14 @@ var ACCOUNT_META = {
     accentBg: "bg-network-arkade/10",
     accentText: "text-network-arkade",
     accentBorder: "border-network-arkade/30",
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("img", { src: "/icons/arkade/arkade-icon.svg", alt: "", className: "h-2.5 w-2.5 rounded-[1px] object-contain" })
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("img", { src: "/icons/arkade/arkade-icon.svg", alt: "", className: "h-2.5 w-2.5 rounded-[1px] object-contain" })
   },
   LIQUID: {
     shortLabel: "Liquid",
     accentBg: "bg-network-liquid/10",
     accentText: "text-network-liquid",
     accentBorder: "border-network-liquid/30",
-    icon: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(LiquidNetworkIcon, { className: "h-2.5 w-2.5" })
+    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(LiquidNetworkIcon, { className: "h-2.5 w-2.5" })
   }
 };
 var METHOD_META = {
@@ -7870,7 +7984,7 @@ function InvoiceStatusBanner({
   isInvoiceFailedOrExpired,
   invoiceStatus
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
     "div",
     {
       className: cn(
@@ -7878,17 +7992,17 @@ function InvoiceStatusBanner({
         isInvoicePaid ? "bg-primary/10 text-primary" : isInvoiceFailedOrExpired ? "bg-danger/10 text-danger" : "bg-warning/10 text-warning"
       ),
       children: [
-        isInvoicePending && /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-sm", children: "progress_activity" }),
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { children: "Waiting for payment..." })
+        isInvoicePending && /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_jsx_runtime78.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-sm", children: "progress_activity" }),
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { children: "Waiting for payment..." })
         ] }),
-        isInvoicePaid && /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "material-symbols-outlined text-icon-sm", children: "check_circle" }),
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { children: "Payment received!" })
+        isInvoicePaid && /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_jsx_runtime78.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "material-symbols-outlined text-icon-sm", children: "check_circle" }),
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { children: "Payment received!" })
         ] }),
-        isInvoiceFailedOrExpired && /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "material-symbols-outlined text-icon-sm", children: "cancel" }),
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("span", { children: [
+        isInvoiceFailedOrExpired && /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_jsx_runtime78.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "material-symbols-outlined text-icon-sm", children: "cancel" }),
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("span", { children: [
             "Invoice ",
             invoiceStatus?.toLowerCase() === "expired" ? "expired" : "failed"
           ] })
@@ -7898,20 +8012,20 @@ function InvoiceStatusBanner({
   );
 }
 function PaidOverlay() {
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "absolute inset-0 flex items-center justify-center rounded-2xl bg-background/80", children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: "flex flex-col items-center gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "flex size-14 items-center justify-center rounded-full bg-primary", children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "material-symbols-outlined text-icon-4xl text-background", children: "check" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "text-sm font-bold text-primary", children: "Received!" })
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "absolute inset-0 flex items-center justify-center rounded-2xl bg-background/80", children: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "flex flex-col items-center gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "flex size-14 items-center justify-center rounded-full bg-primary", children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "material-symbols-outlined text-icon-4xl text-background", children: "check" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "text-sm font-bold text-primary", children: "Received!" })
   ] }) });
 }
 function CopyIcon({ copied }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "div",
     {
       className: cn(
         "flex-shrink-0 rounded-lg p-2 transition-all",
         copied ? "bg-primary/15 text-primary" : "bg-white/5 text-white/40 group-hover:bg-primary/10 group-hover:text-primary"
       ),
-      children: copied ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Icon, { name: "check", size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Icon, { name: "content_copy", size: "sm" })
+      children: copied ? /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(Icon, { name: "check", size: "sm" }) : /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(Icon, { name: "content_copy", size: "sm" })
     }
   );
 }
@@ -7922,7 +8036,7 @@ function AccountChoiceChip({
   label
 }) {
   const meta = ACCOUNT_META[account];
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
     "button",
     {
       type: "button",
@@ -7934,7 +8048,7 @@ function AccountChoiceChip({
       ),
       children: [
         meta.icon,
-        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { children: label ?? meta.shortLabel })
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { children: label ?? meta.shortLabel })
       ]
     }
   );
@@ -7992,8 +8106,8 @@ function NetworkInfoDisclosure({
 }) {
   const [open, setOpen] = (0, import_react15.useState)(false);
   if (networks.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: cn("overflow-hidden rounded-xl bg-card/70 transition-all", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: cn("overflow-hidden rounded-xl bg-card/70 transition-all", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
       "button",
       {
         type: "button",
@@ -8001,24 +8115,24 @@ function NetworkInfoDisclosure({
         "aria-expanded": open,
         className: "flex w-full items-center gap-2 px-2.5 py-1.5 text-left transition-colors hover:bg-white/4",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Icon, { name: "info", size: "xs", className: "text-white/40" }),
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "flex-1 text-xxs font-bold uppercase tracking-widest text-white/50", children: "What are these networks?" }),
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Icon, { name: open ? "expand_less" : "expand_more", size: "xs", className: "text-white/40" })
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(Icon, { name: "info", size: "xs", className: "text-white/40" }),
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "flex-1 text-xxs font-bold uppercase tracking-widest text-white/50", children: "What are these networks?" }),
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(Icon, { name: open ? "expand_less" : "expand_more", size: "xs", className: "text-white/40" })
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "space-y-2 px-2.5 pb-2.5 pt-0.5 animate-in fade-in slide-in-from-top-1 duration-200", children: networks.map((network) => {
+    open && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "space-y-2 px-2.5 pb-2.5 pt-0.5 animate-in fade-in slide-in-from-top-1 duration-200", children: networks.map((network) => {
       const info = NETWORK_INFO[network];
       const cfg = NETWORK_CONFIG[network];
-      return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: "space-y-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: "flex items-center gap-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: cn("flex size-4 flex-shrink-0 items-center justify-center rounded-md", cfg.bg), children: cfg.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: cn("text-xxs font-bold uppercase tracking-widest", cfg.text), children: info.title })
+      return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: cn("flex size-4 flex-shrink-0 items-center justify-center rounded-md", cfg.bg), children: cfg.icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: cn("text-xxs font-bold uppercase tracking-widest", cfg.text), children: info.title })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("p", { className: "pl-5 text-tiny leading-snug text-muted-foreground", children: info.detail }),
-        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("ul", { className: "space-y-0.5 pl-5", children: info.bullets.map((bullet) => /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("li", { className: "flex items-start gap-1.5 text-xxs leading-snug text-white/50", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "mt-[1px] text-white/30", children: "-" }),
-          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { children: bullet })
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("p", { className: "pl-5 text-tiny leading-snug text-muted-foreground", children: info.detail }),
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("ul", { className: "space-y-0.5 pl-5", children: info.bullets.map((bullet) => /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("li", { className: "flex items-start gap-1.5 text-xxs leading-snug text-white/50", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "mt-[1px] text-white/30", children: "-" }),
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { children: bullet })
         ] }, bullet)) })
       ] }, network);
     }) })
@@ -8032,7 +8146,7 @@ function MethodChoiceChip({
   onClick
 }) {
   const meta = METHOD_META[method];
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
     "button",
     {
       type: "button",
@@ -8045,14 +8159,14 @@ function MethodChoiceChip({
       ),
       children: [
         meta.label,
-        !enabled && disabledReason && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("span", { className: "text-xxs font-normal opacity-60", children: disabledReason })
+        !enabled && disabledReason && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "text-xxs font-normal opacity-60", children: disabledReason })
       ]
     }
   );
 }
 
 // src/web/components/deposit-success-screen.tsx
-var import_jsx_runtime77 = require("react/jsx-runtime");
+var import_jsx_runtime79 = require("react/jsx-runtime");
 function DepositSuccessScreen({
   handleDone,
   displayTicker,
@@ -8065,20 +8179,20 @@ function DepositSuccessScreen({
   const isInstant = network === "lightning" || network === "spark";
   const title = isInstant ? "Payment Received!" : "Deposit Detected!";
   const subtitle = isInstant ? `Your ${displayTicker} has arrived via ${networkLabel}.` : `Incoming deposit detected via ${networkLabel}. Funds will be available after confirmation.`;
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: "flex h-screen flex-col overflow-hidden bg-background font-display text-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: "flex flex-1 flex-col items-center justify-center p-6 text-center", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: "relative mb-8", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: "absolute inset-0 scale-150 animate-pulse rounded-full bg-primary/20 blur-2xl" }),
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: "relative flex size-20 items-center justify-center rounded-full bg-primary/15 shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: "material-symbols-outlined text-5xl text-primary animate-in zoom-in-50 duration-500", children: "check_circle" }) })
+  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "flex h-screen flex-col overflow-hidden bg-background font-display text-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "flex flex-1 flex-col items-center justify-center p-6 text-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "relative mb-8", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "absolute inset-0 scale-150 animate-pulse rounded-full bg-primary/20 blur-2xl" }),
+      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "relative flex size-20 items-center justify-center rounded-full bg-primary/15 shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: "material-symbols-outlined text-5xl text-primary animate-in zoom-in-50 duration-500", children: "check_circle" }) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("h1", { className: "mb-2 text-2xl font-bold text-white", children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("p", { className: "mb-8 max-w-[260px] text-sm leading-relaxed text-muted-foreground", children: subtitle }),
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: "mb-10 flex items-center gap-3 rounded-2xl bg-card/70 px-4 py-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(AssetIcon, { ticker: displayTicker, size: 36 }),
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: "text-left", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("p", { className: "text-sm font-bold text-white", children: displayTicker }),
-        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("p", { className: "text-xs text-white/40", children: selectedAsset?.name ?? displayTicker })
+    /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("h1", { className: "mb-2 text-2xl font-bold text-white", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { className: "mb-8 max-w-[260px] text-sm leading-relaxed text-muted-foreground", children: subtitle }),
+    /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "mb-10 flex items-center gap-3 rounded-2xl bg-card/70 px-4 py-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(AssetIcon, { ticker: displayTicker, size: 36 }),
+      /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "text-left", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { className: "text-sm font-bold text-white", children: displayTicker }),
+        /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { className: "text-xs text-white/40", children: selectedAsset?.name ?? displayTicker })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
         "div",
         {
           className: cn(
@@ -8089,27 +8203,27 @@ function DepositSuccessScreen({
           ),
           children: [
             net.icon,
-            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { children: networkLabel })
+            /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { children: networkLabel })
           ]
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(Button, { variant: "cta", size: "cta", onClick: handleDone, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: "material-symbols-outlined text-icon-lg", children: "account_balance_wallet" }),
+    /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(Button, { variant: "cta", size: "cta", onClick: handleDone, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: "material-symbols-outlined text-icon-lg", children: "account_balance_wallet" }),
       "Back to Wallet"
     ] })
   ] }) });
 }
 
 // src/web/components/deposit-network-default-modal.tsx
-var import_jsx_runtime78 = require("react/jsx-runtime");
+var import_jsx_runtime80 = require("react/jsx-runtime");
 var NETWORK_OPTIONS = {
   RGB: {
     network: "onchain",
     account: "RGB",
     label: "On-chain / Lightning",
     description: "Classic Bitcoin address or Lightning invoice via the RLN node.",
-    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "material-symbols-outlined text-icon-lg", children: "link" }),
+    icon: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "material-symbols-outlined text-icon-lg", children: "link" }),
     accentBg: "bg-network-bitcoin/10",
     accentBorder: "border-network-bitcoin/30",
     accentText: "text-network-bitcoin"
@@ -8119,7 +8233,7 @@ var NETWORK_OPTIONS = {
     account: "SPARK",
     label: "Spark",
     description: "Receive directly into your Spark account. Fast and free.",
-    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("img", { src: "/icons/spark/Asterisk/Spark Asterisk White.svg", alt: "", className: "h-[18px]" }),
+    icon: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("img", { src: "/icons/spark/Asterisk/Spark Asterisk White.svg", alt: "", className: "h-[18px]" }),
     accentBg: "bg-info/10",
     accentBorder: "border-info/30",
     accentText: "text-info"
@@ -8129,7 +8243,7 @@ var NETWORK_OPTIONS = {
     account: "ARKADE",
     label: "Arkade",
     description: "Receive directly into your Arkade account. Low fees, near-instant settlement.",
-    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("img", { src: "/icons/arkade/arkade-icon.svg", alt: "", className: "h-[18px]" }),
+    icon: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("img", { src: "/icons/arkade/arkade-icon.svg", alt: "", className: "h-[18px]" }),
     accentBg: "bg-network-arkade/10",
     accentBorder: "border-network-arkade/30",
     accentText: "text-network-arkade"
@@ -8141,7 +8255,7 @@ var NETWORK_OPTIONS = {
     account: "LIQUID",
     label: "Liquid",
     description: "Receive L-BTC or a Liquid asset (USDt) via a confidential Liquid address.",
-    icon: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(LiquidNetworkIcon, { className: "h-[18px] w-[18px]" }),
+    icon: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(LiquidNetworkIcon, { className: "h-[18px] w-[18px]" }),
     accentBg: "bg-network-liquid/10",
     accentBorder: "border-network-liquid/30",
     accentText: "text-network-liquid"
@@ -8156,20 +8270,20 @@ function DepositNetworkDefaultModal({
 }) {
   if (!open) return null;
   const options = availableAccounts.map((id) => NETWORK_OPTIONS[id]).filter(Boolean);
-  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "fixed inset-0 z-50 flex items-end justify-center bg-background/80 backdrop-blur-lg", children: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "w-full space-y-4 rounded-t-2xl bg-card px-4 pb-7 pt-5 animate-in slide-in-from-bottom-4 duration-200", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "-mt-1 mb-1 flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "h-1 w-10 rounded-full bg-white/15" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("p", { className: "text-sm font-bold text-white", children: "Choose your default network" }),
-      /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("p", { className: "mt-0.5 text-tiny text-white/45", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "fixed inset-0 z-50 flex items-end justify-center bg-background/80 backdrop-blur-lg", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "w-full space-y-4 rounded-t-2xl bg-card px-4 pb-7 pt-5 animate-in slide-in-from-bottom-4 duration-200", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "-mt-1 mb-1 flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "h-1 w-10 rounded-full bg-white/15" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { className: "text-sm font-bold text-white", children: "Choose your default network" }),
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("p", { className: "mt-0.5 text-tiny text-white/45", children: [
         "Pick how you would like to receive",
         " ",
-        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: "font-semibold text-muted-foreground", children: assetTicker }),
+        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "font-semibold text-muted-foreground", children: assetTicker }),
         " by default. You can always switch in the deposit screen."
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "space-y-2", children: options.map((option) => {
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "space-y-2", children: options.map((option) => {
       const isSuggested = option.account === suggestedAccount;
-      return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
         "button",
         {
           type: "button",
@@ -8179,7 +8293,7 @@ function DepositNetworkDefaultModal({
             isSuggested ? option.accentBg : "bg-muted/40 hover:bg-muted/60"
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
               "div",
               {
                 className: cn(
@@ -8190,10 +8304,10 @@ function DepositNetworkDefaultModal({
                 children: option.icon
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "min-w-0 flex-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: cn("text-xs font-bold", isSuggested ? option.accentText : "text-white"), children: option.label }),
-                isSuggested && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "min-w-0 flex-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: cn("text-xs font-bold", isSuggested ? option.accentText : "text-white"), children: option.label }),
+                isSuggested && /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
                   "span",
                   {
                     className: cn(
@@ -8205,9 +8319,9 @@ function DepositNetworkDefaultModal({
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("p", { className: "mt-0.5 text-xxs leading-snug text-white/45", children: option.description })
+              /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { className: "mt-0.5 text-xxs leading-snug text-white/45", children: option.description })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
               "span",
               {
                 className: cn(
@@ -8227,7 +8341,7 @@ function DepositNetworkDefaultModal({
 
 // src/web/components/btc-unified-receive.tsx
 var import_react16 = require("react");
-var import_jsx_runtime79 = require("react/jsx-runtime");
+var import_jsx_runtime81 = require("react/jsx-runtime");
 function formatSatsForRow(value) {
   if (!value || value <= 0 || !Number.isFinite(value)) return null;
   return `${value.toLocaleString("en-US")} sats`;
@@ -8259,46 +8373,46 @@ function BtcUnifiedReceive({
     setInvoiceStatus(null);
     setAccountReceiveResult(null);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "space-y-3 animate-in fade-in zoom-in-95 duration-300", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "flex flex-col items-center gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "relative flex flex-col items-center p-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(QrCode, { value: accountReceiveResult.qrValue, size: 200, tone: "onDark" }),
-        isInvoicePaid && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(PaidOverlay, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-3 animate-in fade-in zoom-in-95 duration-300", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex flex-col items-center gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "relative flex flex-col items-center p-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(QrCode, { value: accountReceiveResult.qrValue, size: 200, tone: "onDark" }),
+        isInvoicePaid && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(PaidOverlay, {})
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "flex items-center justify-center gap-2.5", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex items-center justify-center gap-2.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
           Button,
           {
             variant: "surface",
             size: "icon-xl",
             "aria-label": `Copy ${accountReceiveResult.qrLabel}`,
             onClick: () => void copyToClipboard(accountReceiveResult.qrValue),
-            children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Icon, { name: isQrCopied ? "check" : "content_copy", size: "lg" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Icon, { name: isQrCopied ? "check" : "content_copy", size: "lg" })
           }
         ),
-        showRegenerate && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+        showRegenerate && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
           Button,
           {
             variant: "surface",
             size: "icon-xl",
             "aria-label": "New address",
             onClick: handleNewAddress,
-            children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Icon, { name: "refresh", size: "lg" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Icon, { name: "refresh", size: "lg" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
           Button,
           {
             variant: "surface",
             size: "icon-xl",
             "aria-label": "Edit amount and description",
             onClick: () => setShowEdit(true),
-            children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Icon, { name: "edit", size: "lg" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Icon, { name: "edit", size: "lg" })
           }
         )
       ] })
     ] }),
-    invoiceStatus && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+    invoiceStatus && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
       InvoiceStatusBanner,
       {
         isInvoicePending,
@@ -8307,11 +8421,11 @@ function BtcUnifiedReceive({
         invoiceStatus
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "space-y-1.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/30", children: "Available Addresses" }),
+    /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/30", children: "Available Addresses" }),
       accountReceiveResult.addresses.map((address) => {
         const network = NETWORK_CONFIG[address.network];
-        return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
           "div",
           {
             className: cn(
@@ -8321,35 +8435,35 @@ function BtcUnifiedReceive({
             style: { borderLeftWidth: 3, borderLeftColor: network.color },
             onClick: () => void copyToClipboard(address.value),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: cn("flex size-5 flex-shrink-0 items-center justify-center rounded-md", network.bg), children: network.icon }),
-              /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "flex items-center gap-1.5", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { className: cn("text-xxs font-bold uppercase tracking-widest", network.text), children: address.label }),
+              /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { className: cn("flex size-5 flex-shrink-0 items-center justify-center rounded-md", network.bg), children: network.icon }),
+              /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: cn("text-xxs font-bold uppercase tracking-widest", network.text), children: address.label }),
                   (() => {
                     const amountLabel = formatSatsForRow(address.amountSats);
-                    return amountLabel ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: "rounded-full bg-white/10 px-1.5 py-0.5 text-tiny font-bold tabular-nums text-white/70", children: amountLabel }) : null;
+                    return amountLabel ? /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "rounded-full bg-white/10 px-1.5 py-0.5 text-tiny font-bold tabular-nums text-white/70", children: amountLabel }) : null;
                   })()
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { className: "mt-0.5 truncate font-mono text-tiny text-muted-foreground", children: address.value.length > 50 ? `${address.value.slice(0, 18)}...${address.value.slice(-14)}` : address.value })
+                /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "mt-0.5 truncate font-mono text-tiny text-muted-foreground", children: address.value.length > 50 ? `${address.value.slice(0, 18)}...${address.value.slice(-14)}` : address.value })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(CopyIcon, { copied: copied === address.value })
+              /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(CopyIcon, { copied: copied === address.value })
             ]
           },
           address.network
         );
       })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
       BottomSheet,
       {
         open: showEdit,
         title: "Edit request",
-        icon: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Icon, { name: "edit", size: "md" }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Icon, { name: "edit", size: "md" }),
         onClose: () => setShowEdit(false),
-        children: /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "space-y-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "space-y-1.5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "Amount (optional)" }),
-            /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "Amount (optional)" }),
+            /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
               "input",
               {
                 type: "text",
@@ -8360,14 +8474,14 @@ function BtcUnifiedReceive({
                 inputMode: "decimal"
               }
             ),
-            amount && loading && /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("p", { className: "flex items-center gap-1 text-xxs text-warning/70", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-xxs", children: "progress_activity" }),
+            amount && loading && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("p", { className: "flex items-center gap-1 text-xxs text-warning/70", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-xxs", children: "progress_activity" }),
               "Updating invoice..."
             ] })
           ] }),
-          onDescriptionChange && /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "space-y-1.5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "Description (optional)" }),
-            /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+          onDescriptionChange && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "Description (optional)" }),
+            /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
               "input",
               {
                 type: "text",
@@ -8378,7 +8492,7 @@ function BtcUnifiedReceive({
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Button, { variant: "cta", className: "w-full", onClick: () => setShowEdit(false), children: "Done" })
+          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Button, { variant: "cta", className: "w-full", onClick: () => setShowEdit(false), children: "Done" })
         ] })
       }
     )
@@ -8386,7 +8500,7 @@ function BtcUnifiedReceive({
 }
 
 // src/web/components/deposit-generated-view.tsx
-var import_jsx_runtime80 = require("react/jsx-runtime");
+var import_jsx_runtime82 = require("react/jsx-runtime");
 function parseAssetAmount(amountString, asset) {
   const value = Number(amountString);
   if (!Number.isFinite(value)) return 0;
@@ -8427,10 +8541,10 @@ function DepositGeneratedView({
   showRegenerate = true,
   onRegenerate
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "space-y-3 animate-in fade-in zoom-in-95 duration-300", children: [
-    (network === "lightning" || network === "arkade" && arkSubMode === "ark") && isBtc && /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "flex flex-col gap-1.5 rounded-xl bg-card/70 p-2.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "flex items-center justify-between px-1", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "Specify amount (optional)" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "space-y-3 animate-in fade-in zoom-in-95 duration-300", children: [
+    (network === "lightning" || network === "arkade" && arkSubMode === "ark") && isBtc && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "flex flex-col gap-1.5 rounded-xl bg-card/70 p-2.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex items-center justify-between px-1", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "Specify amount (optional)" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
         "input",
         {
           type: "text",
@@ -8441,16 +8555,16 @@ function DepositGeneratedView({
           inputMode: "decimal"
         }
       ),
-      amount && /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { className: "text-xxs text-warning/70", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("span", { className: "flex items-center gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-xxs", children: "progress_activity" }),
+      amount && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: "text-xxs text-warning/70", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("span", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-xxs", children: "progress_activity" }),
         "Updating ",
         network === "arkade" ? "URI" : "invoice",
         "..."
       ] }) : network === "arkade" ? `Unified URI for ${amount} ${getUnitLabel()}` : `Invoice for ${amount} ${getUnitLabel()}` })
     ] }),
-    network === "lightning" && !isBtc && /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "flex flex-col gap-1.5 rounded-xl bg-card/70 p-2.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "flex items-center justify-between px-1", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "Specify amount (optional)" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+    network === "lightning" && !isBtc && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "flex flex-col gap-1.5 rounded-xl bg-card/70 p-2.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex items-center justify-between px-1", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "Specify amount (optional)" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
         "input",
         {
           type: "text",
@@ -8461,25 +8575,25 @@ function DepositGeneratedView({
           inputMode: "decimal"
         }
       ),
-      amount && /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { className: "text-xxs text-warning/70", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("span", { className: "flex items-center gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-xxs", children: "progress_activity" }),
+      amount && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: "text-xxs text-warning/70", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("span", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-xxs", children: "progress_activity" }),
         "Updating invoice..."
       ] }) : `Invoice for ${amount} ${getUnitLabel()}` }),
-      amount && maxDepositAmount > 0 && parseAssetAmount(amount, selectedAsset) > maxDepositAmount && /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("p", { className: "rounded-lg bg-danger/10 px-2.5 py-1.5 text-xxs text-danger", children: [
+      amount && maxDepositAmount > 0 && parseAssetAmount(amount, selectedAsset) > maxDepositAmount && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("p", { className: "rounded-lg bg-danger/10 px-2.5 py-1.5 text-xxs text-danger", children: [
         "Exceeds max: ",
         formatAssetAmount(maxDepositAmount, selectedAsset),
         " ",
         getUnitLabel()
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "flex flex-col items-center gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "flex flex-col items-center gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
         "div",
         {
           className: "relative flex flex-col items-center rounded-2xl bg-white p-3.5 transition-all",
           style: net.qrGlow,
           children: [
-            showQrNetworkBadge && network !== "spark" && network !== "arkade" && /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
+            showQrNetworkBadge && network !== "spark" && network !== "arkade" && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
               "div",
               {
                 className: cn(
@@ -8489,21 +8603,21 @@ function DepositGeneratedView({
                 ),
                 children: [
                   net.icon,
-                  /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { children: net.label })
+                  /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { children: net.label })
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(QrCode, { value: address, size: 188 }),
-            isInvoicePaid && /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(PaidOverlay, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(QrCode, { value: address, size: 188 }),
+            isInvoicePaid && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(PaidOverlay, {}),
             loading && !isInvoicePaid && // Loading scrim — sits over the QR while a fresh address/invoice
             // is being fetched (e.g. after the New Address button).
-            /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "absolute inset-0 flex items-center justify-center rounded-2xl bg-white/80 backdrop-blur-sm", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-3xl text-network-bitcoin", children: "progress_activity" }) })
+            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "absolute inset-0 flex items-center justify-center rounded-2xl bg-white/80 backdrop-blur-sm", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-3xl text-network-bitcoin", children: "progress_activity" }) })
           ]
         }
       ),
       (() => {
         const isAddressCopied = copied === address;
-        return /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
           "button",
           {
             type: "button",
@@ -8516,14 +8630,14 @@ function DepositGeneratedView({
               void copyToClipboard(address);
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(Icon, { name: isAddressCopied ? "check" : "content_copy", size: "xs" }),
+              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: isAddressCopied ? "check" : "content_copy", size: "xs" }),
               isAddressCopied ? "Copied" : network === "lightning" ? "Copy Invoice" : "Copy Address"
             ]
           }
         );
       })()
     ] }),
-    network === "lightning" && invoiceStatus && /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+    network === "lightning" && invoiceStatus && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
       InvoiceStatusBanner,
       {
         isInvoicePending,
@@ -8532,7 +8646,7 @@ function DepositGeneratedView({
         invoiceStatus
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
       "div",
       {
         "data-testid": "deposit-generated-address",
@@ -8543,16 +8657,16 @@ function DepositGeneratedView({
         ),
         onClick: () => void copyToClipboard(address),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: cn("flex size-5 flex-shrink-0 items-center justify-center rounded-md", net.bg), children: net.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { className: cn("text-xxs font-bold uppercase tracking-widest", net.text), children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { "data-testid": "deposit-address-label", children: addressLabel }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { className: "mt-0.5 truncate font-mono text-tiny text-muted-foreground", children: address.length > 50 ? `${address.slice(0, 18)}...${address.slice(-14)}` : address })
+          /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: cn("flex size-5 flex-shrink-0 items-center justify-center rounded-md", net.bg), children: net.icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: cn("text-xxs font-bold uppercase tracking-widest", net.text), children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { "data-testid": "deposit-address-label", children: addressLabel }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: "mt-0.5 truncate font-mono text-tiny text-muted-foreground", children: address.length > 50 ? `${address.slice(0, 18)}...${address.slice(-14)}` : address })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(CopyIcon, { copied: copied === address })
+          /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(CopyIcon, { copied: copied === address })
         ]
       }
     ),
-    recipientId && /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
+    recipientId && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
       "div",
       {
         className: cn(
@@ -8561,16 +8675,16 @@ function DepositGeneratedView({
         ),
         onClick: () => void copyToClipboard(recipientId),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "flex size-5 flex-shrink-0 items-center justify-center rounded-md bg-primary/15", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(Icon, { name: "person", size: "xs", className: "text-primary" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-primary", children: "Recipient ID" }),
-            /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("p", { className: "mt-0.5 truncate font-mono text-tiny text-muted-foreground", children: recipientId.length > 50 ? `${recipientId.slice(0, 18)}...${recipientId.slice(-14)}` : recipientId })
+          /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex size-5 flex-shrink-0 items-center justify-center rounded-md bg-primary/15", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: "person", size: "xs", className: "text-primary" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-primary", children: "Recipient ID" }),
+            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: "mt-0.5 truncate font-mono text-tiny text-muted-foreground", children: recipientId.length > 50 ? `${recipientId.slice(0, 18)}...${recipientId.slice(-14)}` : recipientId })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(CopyIcon, { copied: copied === recipientId })
+          /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(CopyIcon, { copied: copied === recipientId })
         ]
       }
     ),
-    showRegenerate && /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "flex justify-center pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+    showRegenerate && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex justify-center pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
       "button",
       {
         type: "button",
@@ -8588,7 +8702,7 @@ function DepositGeneratedView({
           setInvoiceStatus(null);
         },
         className: "flex size-10 items-center justify-center rounded-full bg-primary/15 text-primary transition-all hover:bg-primary/25 active:scale-[0.98] disabled:opacity-50",
-        children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
           "span",
           {
             className: cn("material-symbols-outlined text-icon-md", loading && "animate-spin"),
@@ -8601,7 +8715,7 @@ function DepositGeneratedView({
 }
 
 // src/web/components/deposit-pre-generation.tsx
-var import_jsx_runtime81 = require("react/jsx-runtime");
+var import_jsx_runtime83 = require("react/jsx-runtime");
 var ACCOUNT_TITLES = {
   RGB: "RGB & Lightning",
   SPARK: "Spark",
@@ -8647,58 +8761,58 @@ function DepositPreGeneration({
 }) {
   const method = METHOD_META2[currentMethod];
   const isRgbOnchain = network === "onchain" && !isBtc;
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-3", children: [
-    showReceiveSummary && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "rounded-2xl bg-card/70 p-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/35", children: "Receive Summary" }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "mt-2 grid grid-cols-1 gap-2 text-xs", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "text-white/45", children: "Asset" }),
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "font-bold text-white", children: selectedAsset?.ticker ?? (isBtc ? "BTC" : "Asset") })
+  return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "space-y-3", children: [
+    showReceiveSummary && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "rounded-2xl bg-card/70 p-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/35", children: "Receive Summary" }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "mt-2 grid grid-cols-1 gap-2 text-xs", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "text-white/45", children: "Asset" }),
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "font-bold text-white", children: selectedAsset?.ticker ?? (isBtc ? "BTC" : "Asset") })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "text-white/45", children: "Destination account" }),
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "font-bold text-white", children: ACCOUNT_TITLES[selectedAccount] })
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "text-white/45", children: "Destination account" }),
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "font-bold text-white", children: ACCOUNT_TITLES[selectedAccount] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "text-white/45", children: "Transfer method" }),
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "font-bold text-white", children: method.label })
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "text-white/45", children: "Transfer method" }),
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "font-bold text-white", children: method.label })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "text-tiny text-white/35", children: method.summary })
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-tiny text-white/35", children: method.summary })
       ] })
     ] }),
-    channelsLoading && selectedAccount === "RGB" && currentMethod === "lightning" && !isBtc && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex items-center gap-2.5 rounded-xl bg-card/70 p-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-lg text-primary", children: "progress_activity" }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "text-xs font-medium text-white/60", children: "Checking channel availability..." })
+    channelsLoading && selectedAccount === "RGB" && currentMethod === "lightning" && !isBtc && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex items-center gap-2.5 rounded-xl bg-card/70 p-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-lg text-primary", children: "progress_activity" }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "text-xs font-medium text-white/60", children: "Checking channel availability..." })
     ] }),
-    showChannelWarning && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(AlertBanner, { variant: "warning", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "mb-0.5 text-xs font-bold text-warning", children: "No Lightning Channels" }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "text-tiny text-warning/70", children: "Only on-chain deposits are available." })
+    showChannelWarning && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(AlertBanner, { variant: "warning", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "mb-0.5 text-xs font-bold text-warning", children: "No Lightning Channels" }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-tiny text-warning/70", children: "Only on-chain deposits are available." })
     ] }),
-    showLiquidityWarning && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(AlertBanner, { variant: "warning", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "mb-0.5 text-xs font-bold text-warning", children: "No Inbound Liquidity" }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("p", { className: "text-tiny text-warning/70", children: [
+    showLiquidityWarning && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(AlertBanner, { variant: "warning", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "mb-0.5 text-xs font-bold text-warning", children: "No Inbound Liquidity" }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("p", { className: "text-tiny text-warning/70", children: [
         "No channels with inbound capacity for ",
         selectedAsset?.ticker ?? "this asset",
         "."
       ] })
     ] }),
-    isAutoGenerate && loading && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex flex-col items-center gap-4 py-10", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { className: cn("flex size-16 items-center justify-center rounded-2xl", net.bg), children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: cn("material-symbols-outlined animate-spin text-icon-4xl", net.text), children: "progress_activity" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-1 text-center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("p", { className: "text-sm font-bold text-muted-foreground", children: [
+    isAutoGenerate && loading && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex flex-col items-center gap-4 py-10", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: cn("flex size-16 items-center justify-center rounded-2xl", net.bg), children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: cn("material-symbols-outlined animate-spin text-icon-4xl", net.text), children: "progress_activity" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "space-y-1 text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("p", { className: "text-sm font-bold text-muted-foreground", children: [
           "Generating ",
           network === "lightning" ? "invoice" : "address",
           "..."
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("p", { className: "text-xs text-white/30", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("p", { className: "text-xs text-white/30", children: [
           net.label,
           " network"
         ] })
       ] })
     ] }),
-    isRgbOnchain && isNewRgbAsset && setNewAssetId && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-1.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "RGB Asset ID - Optional" }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+    isRgbOnchain && isNewRgbAsset && setNewAssetId && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: "RGB Asset ID - Optional" }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
         "input",
         {
           type: "text",
@@ -8710,15 +8824,15 @@ function DepositPreGeneration({
           className: "w-full rounded-xl border bg-white/5 px-3 py-2.5 font-mono text-sm text-white transition-all placeholder:text-white/20 focus:border-primary/50 focus:outline-none"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "text-xxs text-white/35", children: "Enter a specific asset ID to receive it, or leave empty to accept any RGB asset to this invoice." })
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-xxs text-white/35", children: "Enter a specific asset ID to receive it, or leave empty to accept any RGB asset to this invoice." })
     ] }),
-    isRgbOnchain && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-2.5 rounded-xl bg-card/70 p-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("h4", { className: "text-xs font-bold text-white", children: usePrivacy ? "Blinded receive" : "Witness receive" }),
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "mt-0.5 text-xxs text-muted-foreground", children: usePrivacy ? "Private - recommended" : "Simpler - less private" })
+    isRgbOnchain && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "space-y-2.5 rounded-xl bg-card/70 p-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("h4", { className: "text-xs font-bold text-white", children: usePrivacy ? "Blinded receive" : "Witness receive" }),
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "mt-0.5 text-xxs text-muted-foreground", children: usePrivacy ? "Private - recommended" : "Simpler - less private" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
           "button",
           {
             type: "button",
@@ -8728,7 +8842,7 @@ function DepositPreGeneration({
               usePrivacy ? "bg-primary" : "bg-white/10"
             ),
             onClick: () => setUsePrivacy(!usePrivacy),
-            children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
               "span",
               {
                 className: cn(
@@ -8740,8 +8854,8 @@ function DepositPreGeneration({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "text-tiny leading-relaxed text-white/45", children: usePrivacy ? "Blinded: the sender never sees which UTXO you receive into. Spends one of your colorable UTXOs as the receiving slot." : "Witness: the sender creates the receiving UTXO for you. No colorable UTXO needed, but the sender sees the receiving output." }),
-      usePrivacy && colorableUtxoCount !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-tiny leading-relaxed text-white/45", children: usePrivacy ? "Blinded: the sender never sees which UTXO you receive into. Spends one of your colorable UTXOs as the receiving slot." : "Witness: the sender creates the receiving UTXO for you. No colorable UTXO needed, but the sender sees the receiving output." }),
+      usePrivacy && colorableUtxoCount !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
         "div",
         {
           className: cn(
@@ -8749,26 +8863,26 @@ function DepositPreGeneration({
             colorableUtxoCount > 0 ? "bg-success/10 text-success/80" : "bg-warning/10 text-warning/80"
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "font-medium", children: "Available colorable UTXOs" }),
-            /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "font-bold tabular-nums", children: colorableUtxoCount })
+            /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "font-medium", children: "Available colorable UTXOs" }),
+            /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "font-bold tabular-nums", children: colorableUtxoCount })
           ]
         }
       ),
-      usePrivacy && colorableUtxoCount === 0 && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "text-tiny text-warning/70", children: "None available \u2014 create a colorable UTXO below to receive privately, or switch off privacy to use a witness receive." })
+      usePrivacy && colorableUtxoCount === 0 && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-tiny text-warning/70", children: "None available \u2014 create a colorable UTXO below to receive privately, or switch off privacy to use a witness receive." })
     ] }),
-    network === "onchain" && !isBtc && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "space-y-1.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: [
+    network === "onchain" && !isBtc && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("label", { className: "text-xxs font-bold uppercase tracking-widest text-white/40", children: [
           "Amount (",
           getUnitLabel(),
           ") - Optional"
         ] }),
-        selectedAsset && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("span", { className: "text-xxs text-white/30", children: [
+        selectedAsset && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("span", { className: "text-xxs text-white/30", children: [
           selectedAsset.precision ?? 0,
           " decimals"
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
         "input",
         {
           type: "text",
@@ -8780,18 +8894,18 @@ function DepositPreGeneration({
         }
       )
     ] }),
-    needsColorableUtxos && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(AlertBanner, { variant: "warning", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "mb-0.5 text-xs font-bold text-warning", children: "Colorable UTXOs Required" }),
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("p", { className: "text-tiny text-warning/70", children: "To receive RGB assets on-chain you need at least one uncolored UTXO. Create some now and the invoice will be generated automatically." })
+    needsColorableUtxos && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(AlertBanner, { variant: "warning", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "mb-0.5 text-xs font-bold text-warning", children: "Colorable UTXOs Required" }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-tiny text-warning/70", children: "To receive RGB assets on-chain you need at least one uncolored UTXO. Create some now and the invoice will be generated automatically." })
     ] }),
-    !isAutoGenerate && ((needsColorableUtxos || isRgbOnchain && usePrivacy && colorableUtxoCount === 0) && onOpenCreateUtxos ? /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Button, { variant: "cta", size: "cta", onClick: onOpenCreateUtxos, disabled: loading, children: /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "material-symbols-outlined text-icon-md", children: "add_circle" }),
+    !isAutoGenerate && ((needsColorableUtxos || isRgbOnchain && usePrivacy && colorableUtxoCount === 0) && onOpenCreateUtxos ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Button, { variant: "cta", size: "cta", onClick: onOpenCreateUtxos, disabled: loading, children: /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "material-symbols-outlined text-icon-md", children: "add_circle" }),
       "Create Colorable UTXOs"
-    ] }) }) : /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Button, { variant: "cta", size: "cta", onClick: generateInvoice, disabled: loading, children: loading ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-md", children: "progress_activity" }),
+    ] }) }) : /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Button, { variant: "cta", size: "cta", onClick: generateInvoice, disabled: loading, children: loading ? /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-md", children: "progress_activity" }),
       "Generating..."
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("span", { className: "material-symbols-outlined text-icon-md", children: "qr_code_2" }),
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "material-symbols-outlined text-icon-md", children: "qr_code_2" }),
       "Generate Address"
     ] }) }))
   ] });
@@ -8799,7 +8913,7 @@ function DepositPreGeneration({
 
 // src/web/components/deposit-asset-selection.tsx
 var import_react17 = require("react");
-var import_jsx_runtime82 = require("react/jsx-runtime");
+var import_jsx_runtime84 = require("react/jsx-runtime");
 var ADD_ASSET_SUBTITLE = {
   RGB: "RGB asset on Bitcoin",
   SPARK: "Spark-native asset",
@@ -8888,8 +9002,8 @@ function DepositAssetSelection({
       titleHoverClass: "group-hover:text-network-liquid"
     }
   ].filter((option) => option.enabled);
-  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "relative flex h-screen flex-col overflow-hidden bg-background pt-16 font-display text-foreground", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "absolute left-4 top-4 z-30", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "relative flex h-screen flex-col overflow-hidden bg-background pt-16 font-display text-foreground", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "absolute left-4 top-4 z-30", children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
       Button,
       {
         type: "button",
@@ -8897,10 +9011,10 @@ function DepositAssetSelection({
         size: "icon-xl",
         onClick: () => setCurrentView("dashboard"),
         "aria-label": "Go back",
-        children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: "arrow_back", size: "xl" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Icon, { name: "arrow_back", size: "xl" })
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex-shrink-0 px-5 pb-3 pt-4", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "flex-shrink-0 px-5 pb-3 pt-4", children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
       DotPagination,
       {
         count: 2,
@@ -8908,8 +9022,8 @@ function DepositAssetSelection({
         ariaLabel: "Deposit step 1 of 2: select asset"
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex-shrink-0 px-5 pb-3", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "relative", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "flex-shrink-0 px-5 pb-3", children: /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "relative", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
         Icon,
         {
           name: "search",
@@ -8917,7 +9031,7 @@ function DepositAssetSelection({
           className: "absolute left-3 top-1/2 -translate-y-1/2 text-white/30"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
         "input",
         {
           autoFocus: true,
@@ -8930,8 +9044,8 @@ function DepositAssetSelection({
         }
       )
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(ScrollArea, { className: "min-h-0 flex-1", viewportClassName: "space-y-1.5 px-5 pb-3", children: [
-      btcAsset && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(ScrollArea, { className: "min-h-0 flex-1", viewportClassName: "space-y-1.5 px-5 pb-3", children: [
+      btcAsset && /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
         "button",
         {
           type: "button",
@@ -8939,28 +9053,28 @@ function DepositAssetSelection({
           className: "group flex w-full min-w-0 items-center gap-3 overflow-hidden rounded-2xl bg-white/3 px-4 py-3 text-sm transition-all hover:bg-accent",
           onClick: () => onSelectAsset(btcAsset),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(AssetIcon, { ticker: "BTC", size: 40, className: "flex-shrink-0" }),
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "min-w-0 flex-1 text-left", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "font-bold tracking-wide text-white transition-colors group-hover:text-primary/90", children: "Bitcoin" }),
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "mt-0.5 text-xs text-white/40", children: "Choose destination account next" })
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(AssetIcon, { ticker: "BTC", size: 40, className: "flex-shrink-0" }),
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "min-w-0 flex-1 text-left", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "font-bold tracking-wide text-white transition-colors group-hover:text-primary/90", children: "Bitcoin" }),
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "mt-0.5 text-xs text-white/40", children: "Choose destination account next" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "hidden min-w-0 max-w-[42%] flex-shrink flex-wrap justify-end gap-1 min-[380px]:flex", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(NetworkBadge, { network: "L1", size: "sm" }),
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(NetworkBadge, { network: "LN", size: "sm" }),
-              isSparkConnected && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(NetworkBadge, { network: "Spark", size: "sm" }),
-              isArkadeConnected && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(NetworkBadge, { network: "Arkade", size: "sm" }),
-              isLiquidConnected && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(NetworkBadge, { network: "Liquid", size: "sm" })
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "hidden min-w-0 max-w-[42%] flex-shrink flex-wrap justify-end gap-1 min-[380px]:flex", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(NetworkBadge, { network: "L1", size: "sm" }),
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(NetworkBadge, { network: "LN", size: "sm" }),
+              isSparkConnected && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(NetworkBadge, { network: "Spark", size: "sm" }),
+              isArkadeConnected && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(NetworkBadge, { network: "Arkade", size: "sm" }),
+              isLiquidConnected && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(NetworkBadge, { network: "Liquid", size: "sm" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "material-symbols-outlined flex-shrink-0 text-icon-md text-white/20 transition-colors group-hover:text-white/50", children: "arrow_forward" })
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "material-symbols-outlined flex-shrink-0 text-icon-md text-white/20 transition-colors group-hover:text-white/50", children: "arrow_forward" })
           ]
         }
       ),
-      noResults ? /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "py-8 text-center text-sm text-white/30", children: [
+      noResults ? /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "py-8 text-center text-sm text-white/30", children: [
         'No assets match "',
         searchQuery,
         '"'
-      ] }) : ownedAssetsCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "space-y-1.5 pt-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+      ] }) : ownedAssetsCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "space-y-1.5 pt-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
           "button",
           {
             type: "button",
@@ -8973,17 +9087,17 @@ function DepositAssetSelection({
               isSearching && "cursor-default"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "text-xxs font-bold uppercase tracking-[0.18em] text-white/55", children: "Your assets" }),
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "inline-flex size-5 items-center justify-center rounded-full bg-white/10 text-tiny font-bold text-white/70", children: ownedAssetsCount }),
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex-1" }),
-              !isSearching && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: showOwnedAssets ? "expand_less" : "expand_more", size: "md", className: "text-white/40" })
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "text-xxs font-bold uppercase tracking-[0.18em] text-white/55", children: "Your assets" }),
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "inline-flex size-5 items-center justify-center rounded-full bg-white/10 text-tiny font-bold text-white/70", children: ownedAssetsCount }),
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "flex-1" }),
+              !isSearching && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Icon, { name: showOwnedAssets ? "expand_less" : "expand_more", size: "md", className: "text-white/40" })
             ]
           }
         ),
-        showOwnedAssets && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "space-y-1.5 duration-200 animate-in fade-in slide-in-from-top-1", children: ownedAssets.map((asset) => {
+        showOwnedAssets && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "space-y-1.5 duration-200 animate-in fade-in slide-in-from-top-1", children: ownedAssets.map((asset) => {
           const protocolBadge = asset.accountId ? PROTOCOL_BADGE[asset.accountId] : null;
           const balance = asset.balance ?? 0;
-          return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
             "button",
             {
               type: "button",
@@ -8991,11 +9105,11 @@ function DepositAssetSelection({
               className: "group flex w-full min-w-0 items-center gap-3 overflow-hidden rounded-2xl bg-white/3 px-4 py-3 text-sm transition-all hover:bg-accent",
               onClick: () => onSelectAsset(asset),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(AssetIcon, { ticker: asset.ticker, size: 40, className: "flex-shrink-0" }),
-                /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "min-w-0 flex-1 text-left", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "flex min-w-0 items-center gap-1.5", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "truncate font-bold tracking-wide text-white transition-colors group-hover:text-primary/90", children: asset.ticker }),
-                    protocolBadge && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(AssetIcon, { ticker: asset.ticker, size: 40, className: "flex-shrink-0" }),
+                /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "min-w-0 flex-1 text-left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "flex min-w-0 items-center gap-1.5", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "truncate font-bold tracking-wide text-white transition-colors group-hover:text-primary/90", children: asset.ticker }),
+                    protocolBadge && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
                       "span",
                       {
                         className: cn(
@@ -9006,36 +9120,36 @@ function DepositAssetSelection({
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "mt-0.5 truncate text-xs text-white/40", children: asset.name ?? "Asset" })
+                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "mt-0.5 truncate text-xs text-white/40", children: asset.name ?? "Asset" })
                 ] }),
-                balance > 0 && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "flex-shrink-0 text-right", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "text-xs font-bold tabular-nums text-white", children: formatAssetBalance(asset) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "mt-0.5 text-tiny uppercase tracking-wider text-white/35", children: asset.ticker })
+                balance > 0 && /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "flex-shrink-0 text-right", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "text-xs font-bold tabular-nums text-white", children: formatAssetBalance(asset) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "mt-0.5 text-tiny uppercase tracking-wider text-white/35", children: asset.ticker })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "material-symbols-outlined flex-shrink-0 text-icon-sm text-white/20 transition-colors group-hover:text-white/50", children: "arrow_forward" })
+                /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "material-symbols-outlined flex-shrink-0 text-icon-sm text-white/20 transition-colors group-hover:text-white/50", children: "arrow_forward" })
               ]
             },
             asset.asset_id
           );
         }) })
       ] }) : null,
-      !searchQuery && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "pb-1 pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+      !searchQuery && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "pb-1 pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
         "button",
         {
           type: "button",
           onClick: () => setCurrentView("bridge"),
           className: "group flex w-full items-center gap-3 rounded-2xl bg-gradient-to-r from-primary/10 to-primary/5 p-3 transition-all hover:from-primary/20 hover:to-primary/10",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex size-10 shrink-0 items-center justify-center rounded-xl bg-primary/20", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "material-symbols-outlined text-lg text-primary", children: "swap_calls" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "flex-1 text-left", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: "text-sm font-semibold text-white transition-colors group-hover:text-primary", children: "Bridge from another chain" }),
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: "text-xxs leading-tight text-white/40", children: "USDC, USDT, ETH, SOL via Flashnet" })
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "flex size-10 shrink-0 items-center justify-center rounded-xl bg-primary/20", children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "material-symbols-outlined text-lg text-primary", children: "swap_calls" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "flex-1 text-left", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("p", { className: "text-sm font-semibold text-white transition-colors group-hover:text-primary", children: "Bridge from another chain" }),
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("p", { className: "text-xxs leading-tight text-white/40", children: "USDC, USDT, ETH, SOL via Flashnet" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "material-symbols-outlined text-lg text-white/30 transition-colors group-hover:text-primary", children: "arrow_forward" })
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "material-symbols-outlined text-lg text-white/30 transition-colors group-hover:text-primary", children: "arrow_forward" })
           ]
         }
       ) }),
-      !searchQuery && newAssetOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "pb-1 pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+      !searchQuery && newAssetOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "pb-1 pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
         "button",
         {
           type: "button",
@@ -9043,27 +9157,27 @@ function DepositAssetSelection({
           onClick: () => setShowAddAssetModal(true),
           className: "group flex w-full items-center gap-3 rounded-2xl bg-white/3 p-3 transition-all hover:bg-accent",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex size-10 shrink-0 items-center justify-center rounded-xl bg-primary/15", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: "add", size: "md", className: "text-primary" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "flex-1 text-left", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("p", { className: "text-sm font-semibold text-white transition-colors group-hover:text-primary", children: "Add an asset" }),
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("p", { className: "text-xxs leading-tight text-white/40", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "flex size-10 shrink-0 items-center justify-center rounded-xl bg-primary/15", children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Icon, { name: "add", size: "md", className: "text-primary" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "flex-1 text-left", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("p", { className: "text-sm font-semibold text-white transition-colors group-hover:text-primary", children: "Add an asset" }),
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("p", { className: "text-xxs leading-tight text-white/40", children: [
                 "Receive a new ",
                 newAssetOptions.map((o) => o.ticker).join(", "),
                 " asset"
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "material-symbols-outlined text-lg text-white/30 transition-colors group-hover:text-primary", children: "arrow_forward" })
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "material-symbols-outlined text-lg text-white/30 transition-colors group-hover:text-primary", children: "arrow_forward" })
           ]
         }
       ) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
       BottomSheet,
       {
         open: showAddAssetModal,
         title: "Add an asset",
         onClose: () => setShowAddAssetModal(false),
-        children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "space-y-2", children: newAssetOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "space-y-2", children: newAssetOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
           "button",
           {
             type: "button",
@@ -9077,12 +9191,12 @@ function DepositAssetSelection({
               handleAddNewAsset(option.account);
             },
             children: [
-              option.account === "LIQUID" ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "flex size-9 shrink-0 items-center justify-center rounded-full bg-network-liquid/10", children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(LiquidNetworkIcon, { className: "size-5" }) }) : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(AssetIcon, { ticker: option.ticker, size: 36, className: "flex-shrink-0" }),
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: cn("text-sm font-bold tracking-wide text-white", option.titleHoverClass), children: option.title }),
-                /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "mt-0.5 text-xxs text-white/40", children: ADD_ASSET_SUBTITLE[option.account] })
+              option.account === "LIQUID" ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "flex size-9 shrink-0 items-center justify-center rounded-full bg-network-liquid/10", children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(LiquidNetworkIcon, { className: "size-5" }) }) : /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(AssetIcon, { ticker: option.ticker, size: 36, className: "flex-shrink-0" }),
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: cn("text-sm font-bold tracking-wide text-white", option.titleHoverClass), children: option.title }),
+                /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "mt-0.5 text-xxs text-white/40", children: ADD_ASSET_SUBTITLE[option.account] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: "add", size: "sm", className: "text-white/30 transition-colors group-hover:text-white/60" })
+              /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Icon, { name: "add", size: "sm", className: "text-white/30 transition-colors group-hover:text-white/60" })
             ]
           },
           option.account
@@ -9093,7 +9207,7 @@ function DepositAssetSelection({
 }
 
 // src/web/components/deposit-invoice-generation.tsx
-var import_jsx_runtime83 = require("react/jsx-runtime");
+var import_jsx_runtime85 = require("react/jsx-runtime");
 var ACCOUNT_TITLES2 = {
   RGB: "RGB & Lightning",
   SPARK: "Spark",
@@ -9252,7 +9366,7 @@ function DepositInvoiceGeneration({
     if (nextMethod) applyMethodSelection(account, nextMethod);
   };
   if (depositDetected) {
-    return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
       DepositSuccessScreen,
       {
         handleDone,
@@ -9269,15 +9383,15 @@ function DepositInvoiceGeneration({
   const showChannelWarning = selectedAccount === "RGB" && network === "lightning" && !channelsLoading && channels.length === 0 && !isSparkConnected;
   const showLiquidityWarning = !isSparkLightning && network === "lightning" && maxDepositAmount === 0 && !channelsLoading && !isBtc;
   const isNewRgbAsset = isNewAsset && assetFamily === "RGB";
-  return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "relative flex h-screen flex-col overflow-hidden bg-background pt-16 font-display text-foreground", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: "absolute left-4 top-4 z-30", children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Button, { type: "button", variant: "ghost", size: "icon-xl", onClick: handleBack, "aria-label": "Go back", children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Icon, { name: "arrow_back", size: "xl" }) }) }),
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: "relative flex h-screen flex-col overflow-hidden bg-background pt-16 font-display text-foreground", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: "absolute left-4 top-4 z-30", children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Button, { type: "button", variant: "ghost", size: "icon-xl", onClick: handleBack, "aria-label": "Go back", children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Icon, { name: "arrow_back", size: "xl" }) }) }),
     (() => {
       const hideDestinationRail = isNewAsset && (network === "spark" || network === "arkade");
       if (hideDestinationRail) return null;
-      return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: "flex-shrink-0 bg-background px-4 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/35", children: "Destination Account" }),
-          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: "mt-1.5 flex gap-1.5 overflow-x-auto no-scrollbar", children: availableAccounts.map((account) => /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: "flex-shrink-0 bg-background px-4 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/35", children: "Destination Account" }),
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: "mt-1.5 flex gap-1.5 overflow-x-auto no-scrollbar", children: availableAccounts.map((account) => /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
             AccountChoiceChip,
             {
               account,
@@ -9302,9 +9416,9 @@ function DepositInvoiceGeneration({
             account
           )) })
         ] }),
-        !isBtc && !(isNewAsset && (network === "spark" || network === "arkade")) && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/35", children: "Transfer Method" }),
-          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: "mt-1.5 flex gap-1.5 overflow-x-auto no-scrollbar", children: methodOptions.map(({ method, enabled, disabledReason }) => /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+        !isBtc && !(isNewAsset && (network === "spark" || network === "arkade")) && /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/35", children: "Transfer Method" }),
+          /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: "mt-1.5 flex gap-1.5 overflow-x-auto no-scrollbar", children: methodOptions.map(({ method, enabled, disabledReason }) => /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
             MethodChoiceChip,
             {
               method,
@@ -9318,7 +9432,7 @@ function DepositInvoiceGeneration({
         ] })
       ] }) });
     })(),
-    /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(ScrollArea, { className: "flex-1", viewportAs: "main", viewportClassName: "space-y-2.5 px-4 py-2.5", children: isBtc && accountReceiveResult ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(ScrollArea, { className: "flex-1", viewportAs: "main", viewportClassName: "space-y-2.5 px-4 py-2.5", children: isBtc && accountReceiveResult ? /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
       BtcUnifiedReceive,
       {
         btcSelectedAccount,
@@ -9338,15 +9452,15 @@ function DepositInvoiceGeneration({
         setAccountReceiveResult,
         handleDone
       }
-    ) : isBtc && !accountReceiveResult && loading ? /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex flex-col items-center gap-4 py-10", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+    ) : isBtc && !accountReceiveResult && loading ? /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: "flex flex-col items-center gap-4 py-10", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
         "div",
         {
           className: cn(
             "flex size-16 items-center justify-center rounded-2xl",
             NETWORK_CONFIG[btcSelectedAccount === "SPARK" ? "spark" : btcSelectedAccount === "ARKADE" ? "arkade" : "onchain"].bg
           ),
-          children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
             "span",
             {
               className: cn(
@@ -9358,11 +9472,11 @@ function DepositInvoiceGeneration({
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "space-y-1 text-center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-sm font-bold text-muted-foreground", children: "Generating addresses..." }),
-        /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("p", { className: "text-xs text-white/30", children: ACCOUNT_TITLES2[btcSelectedAccount] })
+      /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: "space-y-1 text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("p", { className: "text-sm font-bold text-muted-foreground", children: "Generating addresses..." }),
+        /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("p", { className: "text-xs text-white/30", children: ACCOUNT_TITLES2[btcSelectedAccount] })
       ] })
-    ] }) : !address ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+    ] }) : !address ? /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
       DepositPreGeneration,
       {
         selectedAsset,
@@ -9386,7 +9500,7 @@ function DepositInvoiceGeneration({
         onOpenCreateUtxos,
         showReceiveSummary: !isNewRgbAsset
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+    ) : /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
       DepositGeneratedView,
       {
         network,
@@ -9540,7 +9654,9 @@ function DepositInvoiceGeneration({
   StatusBadge,
   StatusIconBadge,
   StepperNumberInput,
+  SummaryRows,
   SwapInputCard,
+  SwapStepList,
   Switch,
   SwitchRow,
   Tabs,