@tokenflight/swap 0.0.0 → 0.0.2

package/dist/tokenflight-swap.js

@@ -4783,7 +4783,7 @@ const styles$6 = {
   footerBrandAccent,
   footerArrow
 };
-var _tmpl$$d = /* @__PURE__ */ template(`<span aria-label=TokenFlight role=img style=line-height:1>✈️`), _tmpl$3$8 = /* @__PURE__ */ template(`<div>`), _tmpl$4$8 = /* @__PURE__ */ template(`<img>`), _tmpl$5$8 = /* @__PURE__ */ template(`<img alt>`), _tmpl$6$6 = /* @__PURE__ */ template(`<a href=https://tokenflight.ai target=_blank rel="noopener noreferrer"part=fee-info data-testid=footer><span>Powered by</span><span>✈️</span><span>Token<span>Flight`);
+var _tmpl$$d = /* @__PURE__ */ template(`<span aria-label=TokenFlight role=img style=line-height:1>✈️`), _tmpl$3$8 = /* @__PURE__ */ template(`<div>`), _tmpl$4$8 = /* @__PURE__ */ template(`<img>`), _tmpl$5$8 = /* @__PURE__ */ template(`<img alt>`), _tmpl$6$7 = /* @__PURE__ */ template(`<a href=https://tokenflight.ai target=_blank rel="noopener noreferrer"part=fee-info data-testid=footer><span>Powered by</span><span>✈️</span><span>Token<span>Flight`);
 function chainIconUrl(apiEndpoint, chainId) {
   if (!apiEndpoint) return void 0;
   return `${apiEndpoint.replace(/\/$/, "")}/v1/chain/${chainId}/icon`;
@@ -4902,7 +4902,7 @@ function ChainDot(props) {
 }
 function PoweredByTokenFlight() {
   return (() => {
-    var _el$7 = _tmpl$6$6(), _el$8 = _el$7.firstChild, _el$9 = _el$8.nextSibling, _el$0 = _el$9.nextSibling, _el$1 = _el$0.firstChild, _el$10 = _el$1.nextSibling;
+    var _el$7 = _tmpl$6$7(), _el$8 = _el$7.firstChild, _el$9 = _el$8.nextSibling, _el$0 = _el$9.nextSibling, _el$1 = _el$0.firstChild, _el$10 = _el$1.nextSibling;
     insert(_el$7, createComponent(external_link_default, {
       size: 12,
       get ["class"]() {
@@ -5613,7 +5613,7 @@ const actionStyles = {
   btnInner,
   spinner
 };
-var _tmpl$$8 = /* @__PURE__ */ template(`<div part=button-primary data-testid=btn-primary>`), _tmpl$2$7 = /* @__PURE__ */ template(`<button part=button-primary data-testid=btn-primary>`), _tmpl$3$6 = /* @__PURE__ */ template(`<button part=button-secondary data-testid=btn-connect>`), _tmpl$4$6 = /* @__PURE__ */ template(`<button part=button-primary data-testid=btn-primary disabled><span><span>`), _tmpl$5$6 = /* @__PURE__ */ template(`<button part=button-primary data-testid=btn-recipient>`), _tmpl$6$5 = /* @__PURE__ */ template(`<button part=button-primary data-testid=btn-primary disabled style=opacity:0.6>`);
+var _tmpl$$8 = /* @__PURE__ */ template(`<div part=button-primary data-testid=btn-primary>`), _tmpl$2$7 = /* @__PURE__ */ template(`<button part=button-primary data-testid=btn-primary>`), _tmpl$3$6 = /* @__PURE__ */ template(`<button part=button-secondary data-testid=btn-connect>`), _tmpl$4$6 = /* @__PURE__ */ template(`<button part=button-primary data-testid=btn-primary disabled><span><span>`), _tmpl$5$6 = /* @__PURE__ */ template(`<button part=button-primary data-testid=btn-recipient>`), _tmpl$6$6 = /* @__PURE__ */ template(`<button part=button-primary data-testid=btn-primary disabled style=opacity:0.6>`);
 function ActionButton(props) {
   return createComponent(Switch, {
     get children() {
@@ -5691,7 +5691,7 @@ function ActionButton(props) {
           return props.insufficientBalance;
         },
         get children() {
-          var _el$8 = _tmpl$6$5();
+          var _el$8 = _tmpl$6$6();
           insert(_el$8, () => t("error.insufficientBalance"));
           createRenderEffect(() => className(_el$8, actionStyles.btnPrimary));
           return _el$8;
@@ -5712,7 +5712,7 @@ function ActionButton(props) {
           return props.phase === "idle" || props.phase === "quoting" || props.phase === "quoted";
         },
         get children() {
-          var _el$0 = _tmpl$6$5();
+          var _el$0 = _tmpl$6$6();
           insert(_el$0, () => t("swap.reviewSwap"));
           createRenderEffect(() => className(_el$0, actionStyles.btnPrimary));
           return _el$0;
@@ -5759,6 +5759,8 @@ function shortenTxHash(hash) {
 const progress = "tf-5835df";
 const header$4 = "tf-9322ae";
 const tokenCol = "tf-7d5519";
+const tokenColFrom = "tf-0b8d30";
+const tokenColInner = "tf-bfbd0b";
 const tokenIconWrap$2 = "tf-7e8fdf";
 const chainBadge = "tf-37f3cf";
 const tokenInfo = "tf-9401fd";
@@ -5794,6 +5796,8 @@ const styles$3 = {
   progress,
   header: header$4,
   tokenCol,
+  tokenColFrom,
+  tokenColInner,
   tokenIconWrap: tokenIconWrap$2,
   chainBadge,
   tokenInfo,
@@ -5826,7 +5830,15 @@ const styles$3 = {
   retryHidden,
   retryBtn
 };
-var _tmpl$$7 = /* @__PURE__ */ template(`<div><div><div><div></div></div><div><div></div><span></span></div></div><div></div><div><div><div></div></div><div><div></div><span>`), _tmpl$2$6 = /* @__PURE__ */ template(`<img>`), _tmpl$3$5 = /* @__PURE__ */ template(`<div>`), _tmpl$4$5 = /* @__PURE__ */ template(`<div><button>`), _tmpl$5$5 = /* @__PURE__ */ template(`<a target=_blank rel="noopener noreferrer"> `), _tmpl$6$4 = /* @__PURE__ */ template(`<button>`), _tmpl$7$4 = /* @__PURE__ */ template(`<div><div>`), _tmpl$8$4 = /* @__PURE__ */ template(`<div part=progress><div>`), _tmpl$9$4 = /* @__PURE__ */ template(`<div><div></div><div><div></div><div><span>`), _tmpl$0$3 = /* @__PURE__ */ template(`<span style=font-size:14px>!`), _tmpl$1$3 = /* @__PURE__ */ template(`<span>`);
+var _tmpl$$7 = /* @__PURE__ */ template(`<div><div><div><div><div></div></div><div><div></div><span></span></div></div></div><div></div><div><div><div><div></div></div><div><div></div><span>`), _tmpl$2$6 = /* @__PURE__ */ template(`<img>`), _tmpl$3$5 = /* @__PURE__ */ template(`<div>`), _tmpl$4$5 = /* @__PURE__ */ template(`<div><button>`), _tmpl$5$5 = /* @__PURE__ */ template(`<a target=_blank rel="noopener noreferrer"> `), _tmpl$6$5 = /* @__PURE__ */ template(`<button>`), _tmpl$7$4 = /* @__PURE__ */ template(`<div><div>`), _tmpl$8$4 = /* @__PURE__ */ template(`<div part=progress><div>`), _tmpl$9$4 = /* @__PURE__ */ template(`<div><div></div><div><div></div><div><span>`), _tmpl$0$3 = /* @__PURE__ */ template(`<span style=font-size:14px>!`), _tmpl$1$3 = /* @__PURE__ */ template(`<span>`);
+function autoScale(el) {
+  el.style.transform = "";
+  if (el.scrollWidth > el.clientWidth) {
+    const scale = el.clientWidth / el.scrollWidth;
+    el.style.transform = `scale(${scale})`;
+    el.style.transformOrigin = "left";
+  }
+}
 function OrderProgress(props) {
   const fromChainName = () => props.fromToken ? getChainName(props.fromToken.chainId, props.chainMap) : "";
   const toChainName = () => props.toToken ? getChainName(props.toToken.chainId, props.chainMap) : "";
@@ -5970,15 +5982,15 @@ function OrderProgress(props) {
     return txHash && chainId ? getExplorerTxUrl(chainId, txHash, props.chainMap) : null;
   };
   return (() => {
-    var _el$ = _tmpl$8$4(), _el$16 = _el$.firstChild;
+    var _el$ = _tmpl$8$4(), _el$18 = _el$.firstChild;
     insert(_el$, createComponent(Show, {
       get when() {
         return memo(() => !!props.fromToken)() && props.toToken;
       },
       get children() {
         return [(() => {
-          var _el$2 = _tmpl$$7(), _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$4.nextSibling, _el$7 = _el$6.firstChild, _el$8 = _el$7.nextSibling, _el$9 = _el$3.nextSibling, _el$0 = _el$9.nextSibling, _el$1 = _el$0.firstChild, _el$10 = _el$1.firstChild, _el$11 = _el$1.nextSibling, _el$12 = _el$11.firstChild, _el$13 = _el$12.nextSibling;
-          insert(_el$4, createComponent(TokenIcon, {
+          var _el$2 = _tmpl$$7(), _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$5.firstChild, _el$7 = _el$5.nextSibling, _el$8 = _el$7.firstChild, _el$9 = _el$8.nextSibling, _el$0 = _el$3.nextSibling, _el$1 = _el$0.nextSibling, _el$10 = _el$1.firstChild, _el$11 = _el$10.firstChild, _el$12 = _el$11.firstChild, _el$13 = _el$11.nextSibling, _el$14 = _el$13.firstChild, _el$15 = _el$14.nextSibling;
+          insert(_el$5, createComponent(TokenIcon, {
             get symbol() {
               return props.fromToken.symbol ?? "?";
             },
@@ -5987,15 +5999,20 @@ function OrderProgress(props) {
             get logoURI() {
               return props.fromToken.logoURI;
             }
-          }), _el$5);
-          insert(_el$5, createComponent(ChainDot, {
+          }), _el$6);
+          insert(_el$6, createComponent(ChainDot, {
             color: null,
             size: 14,
             get iconUrl() {
               return chainIconUrl(props.apiEndpoint, props.fromToken.chainId);
             }
           }));
-          insert(_el$7, createComponent(Show, {
+          use((el) => createEffect(() => {
+            void props.inputAmount;
+            void props.fromToken;
+            autoScale(el);
+          }), _el$8);
+          insert(_el$8, createComponent(Show, {
             get when() {
               return props.inputAmount;
             },
@@ -6008,12 +6025,12 @@ function OrderProgress(props) {
               }), " "];
             }
           }), null);
-          insert(_el$7, () => props.fromToken.symbol ?? "", null);
-          insert(_el$8, fromChainName);
-          insert(_el$9, createComponent(arrow_right_default, {
+          insert(_el$8, () => props.fromToken.symbol ?? "", null);
+          insert(_el$9, fromChainName);
+          insert(_el$0, createComponent(arrow_right_default, {
             size: 14
           }));
-          insert(_el$1, createComponent(TokenIcon, {
+          insert(_el$11, createComponent(TokenIcon, {
             get symbol() {
               return props.toToken.symbol ?? "?";
             },
@@ -6022,15 +6039,20 @@ function OrderProgress(props) {
             get logoURI() {
               return props.toToken.logoURI;
             }
-          }), _el$10);
-          insert(_el$10, createComponent(ChainDot, {
+          }), _el$12);
+          insert(_el$12, createComponent(ChainDot, {
             color: null,
             size: 14,
             get iconUrl() {
               return chainIconUrl(props.apiEndpoint, props.toToken.chainId);
             }
           }));
-          insert(_el$12, createComponent(Show, {
+          use((el) => createEffect(() => {
+            void props.outputAmount;
+            void props.toToken;
+            autoScale(el);
+          }), _el$14);
+          insert(_el$14, createComponent(Show, {
             get when() {
               return props.outputAmount;
             },
@@ -6043,10 +6065,10 @@ function OrderProgress(props) {
               }), " "];
             }
           }), null);
-          insert(_el$12, () => props.toToken.symbol ?? "", null);
-          insert(_el$13, toChainName);
+          insert(_el$14, () => props.toToken.symbol ?? "", null);
+          insert(_el$15, toChainName);
           createRenderEffect((_p$) => {
-            var _v$ = styles$3.header, _v$2 = styles$3.tokenCol, _v$3 = styles$3.tokenIconWrap, _v$4 = styles$3.chainBadge, _v$5 = styles$3.tokenInfo, _v$6 = styles$3.tokenAmount, _v$7 = styles$3.tokenChain, _v$8 = styles$3.arrow, _v$9 = styles$3.tokenCol, _v$0 = styles$3.tokenIconWrap, _v$1 = styles$3.chainBadge, _v$10 = styles$3.tokenInfo, _v$11 = styles$3.tokenAmount, _v$12 = styles$3.tokenChain;
+            var _v$ = styles$3.header, _v$2 = `${styles$3.tokenCol} ${styles$3.tokenColFrom}`, _v$3 = styles$3.tokenColInner, _v$4 = styles$3.tokenIconWrap, _v$5 = styles$3.chainBadge, _v$6 = styles$3.tokenInfo, _v$7 = styles$3.tokenAmount, _v$8 = styles$3.tokenChain, _v$9 = styles$3.arrow, _v$0 = styles$3.tokenCol, _v$1 = styles$3.tokenColInner, _v$10 = styles$3.tokenIconWrap, _v$11 = styles$3.chainBadge, _v$12 = styles$3.tokenInfo, _v$13 = styles$3.tokenAmount, _v$14 = styles$3.tokenChain;
             _v$ !== _p$.e && className(_el$2, _p$.e = _v$);
             _v$2 !== _p$.t && className(_el$3, _p$.t = _v$2);
             _v$3 !== _p$.a && className(_el$4, _p$.a = _v$3);
@@ -6061,6 +6083,8 @@ function OrderProgress(props) {
             _v$10 !== _p$.u && className(_el$11, _p$.u = _v$10);
             _v$11 !== _p$.c && className(_el$12, _p$.c = _v$11);
             _v$12 !== _p$.w && className(_el$13, _p$.w = _v$12);
+            _v$13 !== _p$.m && className(_el$14, _p$.m = _v$13);
+            _v$14 !== _p$.f && className(_el$15, _p$.f = _v$14);
             return _p$;
           }, {
             e: void 0,
@@ -6076,7 +6100,9 @@ function OrderProgress(props) {
             l: void 0,
             u: void 0,
             c: void 0,
-            w: void 0
+            w: void 0,
+            m: void 0,
+            f: void 0
           });
           return _el$2;
         })(), createComponent(Show, {
@@ -6084,37 +6110,37 @@ function OrderProgress(props) {
             return props.providerName;
           },
           get children() {
-            var _el$14 = _tmpl$3$5();
-            insert(_el$14, createComponent(Show, {
+            var _el$16 = _tmpl$3$5();
+            insert(_el$16, createComponent(Show, {
               get when() {
                 return props.providerIcon;
               },
               get children() {
-                var _el$15 = _tmpl$2$6();
+                var _el$17 = _tmpl$2$6();
                 createRenderEffect((_p$) => {
-                  var _v$13 = props.providerIcon, _v$14 = props.providerName, _v$15 = styles$3.viaIcon;
-                  _v$13 !== _p$.e && setAttribute(_el$15, "src", _p$.e = _v$13);
-                  _v$14 !== _p$.t && setAttribute(_el$15, "alt", _p$.t = _v$14);
-                  _v$15 !== _p$.a && className(_el$15, _p$.a = _v$15);
+                  var _v$15 = props.providerIcon, _v$16 = props.providerName, _v$17 = styles$3.viaIcon;
+                  _v$15 !== _p$.e && setAttribute(_el$17, "src", _p$.e = _v$15);
+                  _v$16 !== _p$.t && setAttribute(_el$17, "alt", _p$.t = _v$16);
+                  _v$17 !== _p$.a && className(_el$17, _p$.a = _v$17);
                   return _p$;
                 }, {
                   e: void 0,
                   t: void 0,
                   a: void 0
                 });
-                return _el$15;
+                return _el$17;
               }
             }), null);
-            insert(_el$14, () => t("tracking.via", {
+            insert(_el$16, () => t("tracking.via", {
               provider: props.providerName
             }), null);
-            createRenderEffect(() => className(_el$14, styles$3.via));
-            return _el$14;
+            createRenderEffect(() => className(_el$16, styles$3.via));
+            return _el$16;
           }
         })];
       }
-    }), _el$16);
-    insert(_el$16, createComponent(For, {
+    }), _el$18);
+    insert(_el$18, createComponent(For, {
       get each() {
         return steps2();
       },
@@ -6126,52 +6152,52 @@ function OrderProgress(props) {
           return `${styles$3.step} ${styles$3.pending}`;
         };
         return (() => {
-          var _el$24 = _tmpl$9$4(), _el$25 = _el$24.firstChild, _el$26 = _el$25.nextSibling, _el$27 = _el$26.firstChild, _el$28 = _el$27.nextSibling, _el$29 = _el$28.firstChild;
-          insert(_el$25, (() => {
+          var _el$26 = _tmpl$9$4(), _el$27 = _el$26.firstChild, _el$28 = _el$27.nextSibling, _el$29 = _el$28.firstChild, _el$30 = _el$29.nextSibling, _el$31 = _el$30.firstChild;
+          insert(_el$27, (() => {
             var _c$3 = memo(() => !!(step2.status === "completed" && !step2.isWarning));
             return () => _c$3() ? createComponent(check_default, {
               size: 14
             }) : memo(() => !!(step2.status === "active" && step2.isWarning))() ? _tmpl$0$3() : memo(() => step2.status === "active")() ? (() => {
-              var _el$33 = _tmpl$3$5();
-              createRenderEffect(() => className(_el$33, styles$3.stepSpinner));
-              return _el$33;
-            })() : memo(() => !!(step2.isWarning && step2.status === "completed"))() ? _tmpl$0$3() : (() => {
-              var _el$35 = _tmpl$1$3();
-              insert(_el$35, () => index() + 1);
+              var _el$35 = _tmpl$3$5();
+              createRenderEffect(() => className(_el$35, styles$3.stepSpinner));
               return _el$35;
+            })() : memo(() => !!(step2.isWarning && step2.status === "completed"))() ? _tmpl$0$3() : (() => {
+              var _el$37 = _tmpl$1$3();
+              insert(_el$37, () => index() + 1);
+              return _el$37;
             })();
           })());
-          insert(_el$27, () => step2.title);
-          insert(_el$29, () => step2.subtitle);
-          insert(_el$28, createComponent(Show, {
+          insert(_el$29, () => step2.title);
+          insert(_el$31, () => step2.subtitle);
+          insert(_el$30, createComponent(Show, {
             get when() {
               return step2.explorerUrl;
             },
             get children() {
-              var _el$30 = _tmpl$5$5(), _el$31 = _el$30.firstChild;
-              insert(_el$30, () => t("tracking.viewOnExplorer"), _el$31);
-              insert(_el$30, createComponent(external_link_default, {
+              var _el$32 = _tmpl$5$5(), _el$33 = _el$32.firstChild;
+              insert(_el$32, () => t("tracking.viewOnExplorer"), _el$33);
+              insert(_el$32, createComponent(external_link_default, {
                 size: 10
               }), null);
               createRenderEffect((_p$) => {
-                var _v$24 = step2.explorerUrl, _v$25 = styles$3.stepExplorer;
-                _v$24 !== _p$.e && setAttribute(_el$30, "href", _p$.e = _v$24);
-                _v$25 !== _p$.t && className(_el$30, _p$.t = _v$25);
+                var _v$26 = step2.explorerUrl, _v$27 = styles$3.stepExplorer;
+                _v$26 !== _p$.e && setAttribute(_el$32, "href", _p$.e = _v$26);
+                _v$27 !== _p$.t && className(_el$32, _p$.t = _v$27);
                 return _p$;
               }, {
                 e: void 0,
                 t: void 0
               });
-              return _el$30;
+              return _el$32;
             }
           }), null);
           createRenderEffect((_p$) => {
-            var _v$26 = stepClass(), _v$27 = `${styles$3.stepIcon} ${step2.isWarning && (step2.status === "completed" || step2.status === "active") ? styles$3.stepIconWarning : step2.status === "completed" ? styles$3.stepIconCompleted : step2.status === "active" ? styles$3.stepIconActive : styles$3.stepIconPending}`, _v$28 = styles$3.stepBody, _v$29 = styles$3.stepTitle, _v$30 = styles$3.stepSubtitle;
-            _v$26 !== _p$.e && className(_el$24, _p$.e = _v$26);
-            _v$27 !== _p$.t && className(_el$25, _p$.t = _v$27);
-            _v$28 !== _p$.a && className(_el$26, _p$.a = _v$28);
-            _v$29 !== _p$.o && className(_el$27, _p$.o = _v$29);
-            _v$30 !== _p$.i && className(_el$28, _p$.i = _v$30);
+            var _v$28 = stepClass(), _v$29 = `${styles$3.stepIcon} ${step2.isWarning && (step2.status === "completed" || step2.status === "active") ? styles$3.stepIconWarning : step2.status === "completed" ? styles$3.stepIconCompleted : step2.status === "active" ? styles$3.stepIconActive : styles$3.stepIconPending}`, _v$30 = styles$3.stepBody, _v$31 = styles$3.stepTitle, _v$32 = styles$3.stepSubtitle;
+            _v$28 !== _p$.e && className(_el$26, _p$.e = _v$28);
+            _v$29 !== _p$.t && className(_el$27, _p$.t = _v$29);
+            _v$30 !== _p$.a && className(_el$28, _p$.a = _v$30);
+            _v$31 !== _p$.o && className(_el$29, _p$.o = _v$31);
+            _v$32 !== _p$.i && className(_el$30, _p$.i = _v$32);
             return _p$;
           }, {
             e: void 0,
@@ -6180,7 +6206,7 @@ function OrderProgress(props) {
             o: void 0,
             i: void 0
           });
-          return _el$24;
+          return _el$26;
         })();
       }
     }));
@@ -6189,19 +6215,19 @@ function OrderProgress(props) {
         return props.onRetry;
       },
       get children() {
-        var _el$17 = _tmpl$4$5(), _el$18 = _el$17.firstChild;
-        addEventListener(_el$18, "click", props.onRetry);
-        insert(_el$18, () => t("tracking.retry"));
+        var _el$19 = _tmpl$4$5(), _el$20 = _el$19.firstChild;
+        addEventListener(_el$20, "click", props.onRetry);
+        insert(_el$20, () => t("tracking.retry"));
         createRenderEffect((_p$) => {
-          var _v$16 = `${styles$3.retry}${props.executionError ? "" : ` ${styles$3.retryHidden}`}`, _v$17 = styles$3.retryBtn;
-          _v$16 !== _p$.e && className(_el$17, _p$.e = _v$16);
-          _v$17 !== _p$.t && className(_el$18, _p$.t = _v$17);
+          var _v$18 = `${styles$3.retry}${props.executionError ? "" : ` ${styles$3.retryHidden}`}`, _v$19 = styles$3.retryBtn;
+          _v$18 !== _p$.e && className(_el$19, _p$.e = _v$18);
+          _v$19 !== _p$.t && className(_el$20, _p$.t = _v$19);
           return _p$;
         }, {
           e: void 0,
           t: void 0
         });
-        return _el$17;
+        return _el$19;
       }
     }), null);
     insert(_el$, createComponent(Show, {
@@ -6209,64 +6235,64 @@ function OrderProgress(props) {
         return isTerminalFailure();
       },
       get children() {
-        var _el$19 = _tmpl$7$4(), _el$20 = _el$19.firstChild;
-        insert(_el$20, (() => {
+        var _el$21 = _tmpl$7$4(), _el$22 = _el$21.firstChild;
+        insert(_el$22, (() => {
           var _c$ = memo(() => props.order?.status === "refunded");
           return () => _c$() ? t("failure.refundedSubtitle") : t("failure.subtitle");
         })());
-        insert(_el$19, createComponent(Show, {
+        insert(_el$21, createComponent(Show, {
           get when() {
             return refundExplorerUrl();
           },
           get children() {
-            var _el$21 = _tmpl$5$5(), _el$22 = _el$21.firstChild;
-            insert(_el$21, () => t("failure.refundTx"), _el$22);
-            insert(_el$21, createComponent(external_link_default, {
+            var _el$23 = _tmpl$5$5(), _el$24 = _el$23.firstChild;
+            insert(_el$23, () => t("failure.refundTx"), _el$24);
+            insert(_el$23, createComponent(external_link_default, {
               size: 10
             }), null);
             createRenderEffect((_p$) => {
-              var _v$18 = refundExplorerUrl(), _v$19 = styles$3.failureLink;
-              _v$18 !== _p$.e && setAttribute(_el$21, "href", _p$.e = _v$18);
-              _v$19 !== _p$.t && className(_el$21, _p$.t = _v$19);
+              var _v$20 = refundExplorerUrl(), _v$21 = styles$3.failureLink;
+              _v$20 !== _p$.e && setAttribute(_el$23, "href", _p$.e = _v$20);
+              _v$21 !== _p$.t && className(_el$23, _p$.t = _v$21);
               return _p$;
             }, {
               e: void 0,
               t: void 0
             });
-            return _el$21;
+            return _el$23;
           }
         }), null);
-        insert(_el$19, createComponent(Show, {
+        insert(_el$21, createComponent(Show, {
           get when() {
             return props.onNewSwap;
           },
           get children() {
-            var _el$23 = _tmpl$6$4();
-            addEventListener(_el$23, "click", props.onNewSwap);
-            insert(_el$23, (() => {
+            var _el$25 = _tmpl$6$5();
+            addEventListener(_el$25, "click", props.onNewSwap);
+            insert(_el$25, (() => {
               var _c$2 = memo(() => props.mode === "receive");
               return () => _c$2() ? t("success.newPurchase") : t("success.newSwap");
             })());
-            createRenderEffect(() => className(_el$23, styles$3.failureBtn));
-            return _el$23;
+            createRenderEffect(() => className(_el$25, styles$3.failureBtn));
+            return _el$25;
           }
         }), null);
         createRenderEffect((_p$) => {
-          var _v$20 = styles$3.failure, _v$21 = styles$3.failureMessage;
-          _v$20 !== _p$.e && className(_el$19, _p$.e = _v$20);
-          _v$21 !== _p$.t && className(_el$20, _p$.t = _v$21);
+          var _v$22 = styles$3.failure, _v$23 = styles$3.failureMessage;
+          _v$22 !== _p$.e && className(_el$21, _p$.e = _v$22);
+          _v$23 !== _p$.t && className(_el$22, _p$.t = _v$23);
           return _p$;
         }, {
           e: void 0,
           t: void 0
         });
-        return _el$19;
+        return _el$21;
       }
     }), null);
     createRenderEffect((_p$) => {
-      var _v$22 = styles$3.progress, _v$23 = styles$3.steps;
-      _v$22 !== _p$.e && className(_el$, _p$.e = _v$22);
-      _v$23 !== _p$.t && className(_el$16, _p$.t = _v$23);
+      var _v$24 = styles$3.progress, _v$25 = styles$3.steps;
+      _v$24 !== _p$.e && className(_el$, _p$.e = _v$24);
+      _v$25 !== _p$.t && className(_el$18, _p$.t = _v$25);
       return _p$;
     }, {
       e: void 0,
@@ -6281,10 +6307,11 @@ const heroIcon = "tf-73631f";
 const title$2 = "tf-9e3a66";
 const subtitle = "tf-db06d4";
 const receivedCard = "tf-c9a5e1";
-const receivedIcon = "tf-789d4e";
+const receivedIconWrap = "tf-7b3b5b";
+const receivedChainBadge = "tf-651299";
 const receivedAmount = "tf-f52291";
 const receivedSymbol = "tf-8cfc86";
-const receivedChain = "tf-4f945b";
+const receivedChainName = "tf-5f768d";
 const journey = "tf-75f592";
 const journeyToggle = "tf-73910d";
 const journeyChevron = "tf-1afb0a";
@@ -6301,10 +6328,11 @@ const styles$2 = {
   title: title$2,
   subtitle,
   receivedCard,
-  receivedIcon,
+  receivedIconWrap,
+  receivedChainBadge,
   receivedAmount,
   receivedSymbol,
-  receivedChain,
+  receivedChainName,
   journey,
   journeyToggle,
   "journeyToggle--open": "tf-ae94a0",
@@ -6317,7 +6345,7 @@ const styles$2 = {
   journeyLink,
   primaryBtn
 };
-var _tmpl$$6 = /* @__PURE__ */ template(`<div>`), _tmpl$2$5 = /* @__PURE__ */ template(`<div><span></span><span>`), _tmpl$3$4 = /* @__PURE__ */ template(`<div><span></span><a target=_blank rel="noopener noreferrer"> `), _tmpl$4$4 = /* @__PURE__ */ template(`<div><button><span> <span style="font-family:'JetBrains Mono', monospace;font-weight:600;color:var(--tf-text)"> </span> </span><span>`), _tmpl$5$4 = /* @__PURE__ */ template(`<div part=success data-testid=success-page><div><div></div></div><div data-testid=success-title></div><div></div><div><div><span></span></div><div><span></span></div></div><button data-testid=success-primary-btn>`);
+var _tmpl$$6 = /* @__PURE__ */ template(`<div><div>`), _tmpl$2$5 = /* @__PURE__ */ template(`<div><span></span><span>`), _tmpl$3$4 = /* @__PURE__ */ template(`<div><span></span><a target=_blank rel="noopener noreferrer"> `), _tmpl$4$4 = /* @__PURE__ */ template(`<div>`), _tmpl$5$4 = /* @__PURE__ */ template(`<div><button><span> <span style=font-family:var(--tf-font-family-mono);font-weight:600;color:var(--tf-text)> </span> </span><span>`), _tmpl$6$4 = /* @__PURE__ */ template(`<div part=success data-testid=success-page><div><div></div></div><div data-testid=success-title></div><div></div><div><div><span></span><span></span></div></div><button data-testid=success-primary-btn>`);
 function TransactionComplete(props) {
   const [detailsOpen, setDetailsOpen] = createSignal(false);
   const receivedAmount2 = () => {
@@ -6354,7 +6382,7 @@ function TransactionComplete(props) {
   const fromChainName = () => getChainName(props.order.fromChainId, props.chainMap);
   const buttonLabel = () => props.mode === "receive" ? t("success.newPurchase") : t("success.newSwap");
   return (() => {
-    var _el$ = _tmpl$5$4(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$2.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling, _el$8 = _el$6.firstChild, _el$9 = _el$8.firstChild, _el$0 = _el$8.nextSibling, _el$1 = _el$0.firstChild, _el$36 = _el$6.nextSibling;
+    var _el$ = _tmpl$6$4(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$2.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling, _el$9 = _el$6.firstChild, _el$0 = _el$9.firstChild, _el$1 = _el$0.nextSibling, _el$36 = _el$6.nextSibling;
     insert(_el$3, createComponent(AirplaneLogo, {
       size: 28
     }));
@@ -6370,7 +6398,7 @@ function TransactionComplete(props) {
         return props.toToken;
       },
       get children() {
-        var _el$7 = _tmpl$$6();
+        var _el$7 = _tmpl$$6(), _el$8 = _el$7.firstChild;
         insert(_el$7, createComponent(TokenIcon, {
           get symbol() {
             return props.toToken.symbol ?? "?";
@@ -6380,32 +6408,42 @@ function TransactionComplete(props) {
           get logoURI() {
             return props.toToken.logoURI;
           }
+        }), _el$8);
+        insert(_el$8, createComponent(ChainDot, {
+          color: null,
+          size: 14,
+          get iconUrl() {
+            return chainIconUrl(props.apiEndpoint, props.order.toChainId);
+          }
         }));
-        createRenderEffect(() => className(_el$7, styles$2.receivedIcon));
+        createRenderEffect((_p$) => {
+          var _v$ = styles$2.receivedIconWrap, _v$2 = styles$2.receivedChainBadge;
+          _v$ !== _p$.e && className(_el$7, _p$.e = _v$);
+          _v$2 !== _p$.t && className(_el$8, _p$.t = _v$2);
+          return _p$;
+        }, {
+          e: void 0,
+          t: void 0
+        });
         return _el$7;
       }
-    }), _el$8);
-    insert(_el$8, createComponent(SignificantNumber, {
+    }), _el$9);
+    insert(_el$9, createComponent(SignificantNumber, {
       get value() {
         return receivedAmount2();
       },
       digits: 8
-    }), _el$9);
-    insert(_el$9, () => props.toToken?.symbol ?? "");
-    insert(_el$0, createComponent(ChainDot, {
-      color: null,
-      size: 12,
-      get iconUrl() {
-        return chainIconUrl(props.apiEndpoint, props.order.toChainId);
-      }
-    }), _el$1);
-    insert(_el$1, toChainName);
+    }), _el$0);
+    insert(_el$0, () => props.toToken?.symbol ?? "");
+    insert(_el$1, () => t("success.onChain", {
+      chain: toChainName()
+    }));
     insert(_el$, createComponent(Show, {
       get when() {
         return props.fromToken;
       },
       get children() {
-        var _el$10 = _tmpl$4$4(), _el$11 = _el$10.firstChild, _el$12 = _el$11.firstChild, _el$13 = _el$12.firstChild, _el$14 = _el$13.nextSibling, _el$15 = _el$14.firstChild;
+        var _el$10 = _tmpl$5$4(), _el$11 = _el$10.firstChild, _el$12 = _el$11.firstChild, _el$13 = _el$12.firstChild, _el$14 = _el$13.nextSibling, _el$15 = _el$14.firstChild;
         _el$14.nextSibling;
         var _el$17 = _el$12.nextSibling;
         addEventListener(_el$11, "click", () => setDetailsOpen(!detailsOpen()));
@@ -6428,7 +6466,7 @@ function TransactionComplete(props) {
             return detailsOpen();
           },
           get children() {
-            var _el$18 = _tmpl$$6();
+            var _el$18 = _tmpl$4$4();
             insert(_el$18, createComponent(Show, {
               get when() {
                 return props.order.author;
@@ -6438,10 +6476,10 @@ function TransactionComplete(props) {
                 insert(_el$20, () => t("success.sender"));
                 insert(_el$21, () => truncateAddress(props.order.author));
                 createRenderEffect((_p$) => {
-                  var _v$ = styles$2.journeyRow, _v$2 = styles$2.journeyLabel, _v$3 = styles$2.journeyValue;
-                  _v$ !== _p$.e && className(_el$19, _p$.e = _v$);
-                  _v$2 !== _p$.t && className(_el$20, _p$.t = _v$2);
-                  _v$3 !== _p$.a && className(_el$21, _p$.a = _v$3);
+                  var _v$3 = styles$2.journeyRow, _v$4 = styles$2.journeyLabel, _v$5 = styles$2.journeyValue;
+                  _v$3 !== _p$.e && className(_el$19, _p$.e = _v$3);
+                  _v$4 !== _p$.t && className(_el$20, _p$.t = _v$4);
+                  _v$5 !== _p$.a && className(_el$21, _p$.a = _v$5);
                   return _p$;
                 }, {
                   e: void 0,
@@ -6460,10 +6498,10 @@ function TransactionComplete(props) {
                 insert(_el$23, () => t("success.recipient"));
                 insert(_el$24, () => truncateAddress(props.order.recipient));
                 createRenderEffect((_p$) => {
-                  var _v$4 = styles$2.journeyRow, _v$5 = styles$2.journeyLabel, _v$6 = styles$2.journeyValue;
-                  _v$4 !== _p$.e && className(_el$22, _p$.e = _v$4);
-                  _v$5 !== _p$.t && className(_el$23, _p$.t = _v$5);
-                  _v$6 !== _p$.a && className(_el$24, _p$.a = _v$6);
+                  var _v$6 = styles$2.journeyRow, _v$7 = styles$2.journeyLabel, _v$8 = styles$2.journeyValue;
+                  _v$6 !== _p$.e && className(_el$22, _p$.e = _v$6);
+                  _v$7 !== _p$.t && className(_el$23, _p$.t = _v$7);
+                  _v$8 !== _p$.a && className(_el$24, _p$.a = _v$8);
                   return _p$;
                 }, {
                   e: void 0,
@@ -6485,11 +6523,11 @@ function TransactionComplete(props) {
                   size: 10
                 }), null);
                 createRenderEffect((_p$) => {
-                  var _v$7 = styles$2.journeyRow, _v$8 = styles$2.journeyLabel, _v$9 = depositExplorerUrl(), _v$0 = styles$2.journeyLink;
-                  _v$7 !== _p$.e && className(_el$25, _p$.e = _v$7);
-                  _v$8 !== _p$.t && className(_el$26, _p$.t = _v$8);
-                  _v$9 !== _p$.a && setAttribute(_el$27, "href", _p$.a = _v$9);
-                  _v$0 !== _p$.o && className(_el$27, _p$.o = _v$0);
+                  var _v$9 = styles$2.journeyRow, _v$0 = styles$2.journeyLabel, _v$1 = depositExplorerUrl(), _v$10 = styles$2.journeyLink;
+                  _v$9 !== _p$.e && className(_el$25, _p$.e = _v$9);
+                  _v$0 !== _p$.t && className(_el$26, _p$.t = _v$0);
+                  _v$1 !== _p$.a && setAttribute(_el$27, "href", _p$.a = _v$1);
+                  _v$10 !== _p$.o && className(_el$27, _p$.o = _v$10);
                   return _p$;
                 }, {
                   e: void 0,
@@ -6512,11 +6550,11 @@ function TransactionComplete(props) {
                   size: 10
                 }), null);
                 createRenderEffect((_p$) => {
-                  var _v$1 = styles$2.journeyRow, _v$10 = styles$2.journeyLabel, _v$11 = fillExplorerUrl(), _v$12 = styles$2.journeyLink;
-                  _v$1 !== _p$.e && className(_el$29, _p$.e = _v$1);
-                  _v$10 !== _p$.t && className(_el$30, _p$.t = _v$10);
-                  _v$11 !== _p$.a && setAttribute(_el$31, "href", _p$.a = _v$11);
-                  _v$12 !== _p$.o && className(_el$31, _p$.o = _v$12);
+                  var _v$11 = styles$2.journeyRow, _v$12 = styles$2.journeyLabel, _v$13 = fillExplorerUrl(), _v$14 = styles$2.journeyLink;
+                  _v$11 !== _p$.e && className(_el$29, _p$.e = _v$11);
+                  _v$12 !== _p$.t && className(_el$30, _p$.t = _v$12);
+                  _v$13 !== _p$.a && setAttribute(_el$31, "href", _p$.a = _v$13);
+                  _v$14 !== _p$.o && className(_el$31, _p$.o = _v$14);
                   return _p$;
                 }, {
                   e: void 0,
@@ -6536,10 +6574,10 @@ function TransactionComplete(props) {
                 insert(_el$34, () => t("success.provider"));
                 insert(_el$35, () => props.providerName);
                 createRenderEffect((_p$) => {
-                  var _v$13 = styles$2.journeyRow, _v$14 = styles$2.journeyLabel, _v$15 = styles$2.journeyValue;
-                  _v$13 !== _p$.e && className(_el$33, _p$.e = _v$13);
-                  _v$14 !== _p$.t && className(_el$34, _p$.t = _v$14);
-                  _v$15 !== _p$.a && className(_el$35, _p$.a = _v$15);
+                  var _v$15 = styles$2.journeyRow, _v$16 = styles$2.journeyLabel, _v$17 = styles$2.journeyValue;
+                  _v$15 !== _p$.e && className(_el$33, _p$.e = _v$15);
+                  _v$16 !== _p$.t && className(_el$34, _p$.t = _v$16);
+                  _v$17 !== _p$.a && className(_el$35, _p$.a = _v$17);
                   return _p$;
                 }, {
                   e: void 0,
@@ -6554,10 +6592,10 @@ function TransactionComplete(props) {
           }
         }), null);
         createRenderEffect((_p$) => {
-          var _v$16 = styles$2.journey, _v$17 = `${styles$2.journeyToggle}${detailsOpen() ? ` ${styles$2["journeyToggle--open"]}` : ""}`, _v$18 = `${styles$2.journeyChevron}${detailsOpen() ? ` ${styles$2["journeyChevron--open"]}` : ""}`;
-          _v$16 !== _p$.e && className(_el$10, _p$.e = _v$16);
-          _v$17 !== _p$.t && className(_el$11, _p$.t = _v$17);
-          _v$18 !== _p$.a && className(_el$17, _p$.a = _v$18);
+          var _v$18 = styles$2.journey, _v$19 = `${styles$2.journeyToggle}${detailsOpen() ? ` ${styles$2["journeyToggle--open"]}` : ""}`, _v$20 = `${styles$2.journeyChevron}${detailsOpen() ? ` ${styles$2["journeyChevron--open"]}` : ""}`;
+          _v$18 !== _p$.e && className(_el$10, _p$.e = _v$18);
+          _v$19 !== _p$.t && className(_el$11, _p$.t = _v$19);
+          _v$20 !== _p$.a && className(_el$17, _p$.a = _v$20);
           return _p$;
         }, {
           e: void 0,
@@ -6570,17 +6608,17 @@ function TransactionComplete(props) {
     addEventListener(_el$36, "click", props.onNewSwap);
     insert(_el$36, buttonLabel);
     createRenderEffect((_p$) => {
-      var _v$19 = styles$2.page, _v$20 = styles$2.hero, _v$21 = styles$2.heroIcon, _v$22 = styles$2.title, _v$23 = styles$2.subtitle, _v$24 = styles$2.receivedCard, _v$25 = styles$2.receivedAmount, _v$26 = styles$2.receivedSymbol, _v$27 = styles$2.receivedChain, _v$28 = styles$2.primaryBtn;
-      _v$19 !== _p$.e && className(_el$, _p$.e = _v$19);
-      _v$20 !== _p$.t && className(_el$2, _p$.t = _v$20);
-      _v$21 !== _p$.a && className(_el$3, _p$.a = _v$21);
-      _v$22 !== _p$.o && className(_el$4, _p$.o = _v$22);
-      _v$23 !== _p$.i && className(_el$5, _p$.i = _v$23);
-      _v$24 !== _p$.n && className(_el$6, _p$.n = _v$24);
-      _v$25 !== _p$.s && className(_el$8, _p$.s = _v$25);
-      _v$26 !== _p$.h && className(_el$9, _p$.h = _v$26);
-      _v$27 !== _p$.r && className(_el$0, _p$.r = _v$27);
-      _v$28 !== _p$.d && className(_el$36, _p$.d = _v$28);
+      var _v$21 = styles$2.page, _v$22 = styles$2.hero, _v$23 = styles$2.heroIcon, _v$24 = styles$2.title, _v$25 = styles$2.subtitle, _v$26 = styles$2.receivedCard, _v$27 = styles$2.receivedAmount, _v$28 = styles$2.receivedSymbol, _v$29 = styles$2.receivedChainName, _v$30 = styles$2.primaryBtn;
+      _v$21 !== _p$.e && className(_el$, _p$.e = _v$21);
+      _v$22 !== _p$.t && className(_el$2, _p$.t = _v$22);
+      _v$23 !== _p$.a && className(_el$3, _p$.a = _v$23);
+      _v$24 !== _p$.o && className(_el$4, _p$.o = _v$24);
+      _v$25 !== _p$.i && className(_el$5, _p$.i = _v$25);
+      _v$26 !== _p$.n && className(_el$6, _p$.n = _v$26);
+      _v$27 !== _p$.s && className(_el$9, _p$.s = _v$27);
+      _v$28 !== _p$.h && className(_el$0, _p$.h = _v$28);
+      _v$29 !== _p$.r && className(_el$1, _p$.r = _v$29);
+      _v$30 !== _p$.d && className(_el$36, _p$.d = _v$30);
       return _p$;
     }, {
       e: void 0,
@@ -8364,267 +8402,135 @@ function RecipientEditor(props) {
     return _el$;
   })();
 }
-const VALID_TRANSITIONS = {
-  idle: ["quoting", "quoted", "error"],
-  quoting: ["quoted", "error", "idle"],
-  quoted: ["building", "quoting", "idle", "error"],
-  building: ["awaiting-wallet", "error", "quoted"],
-  "awaiting-wallet": ["submitting", "error", "quoted"],
-  submitting: ["tracking", "error", "quoted"],
-  tracking: ["success", "error"],
-  success: ["idle", "error"],
-  error: ["idle", "quoting", "quoted"]
-};
-function createSwapStateMachine() {
-  const [state, setState] = createSignal({
-    phase: "idle",
-    fromToken: null,
-    toToken: null,
-    inputAmount: "",
-    outputAmount: "",
-    routes: [],
-    quoteId: null,
-    selectedRouteId: null,
-    order: null,
-    walletAddress: null,
-    isStreaming: false,
-    error: null,
-    errorCode: null,
-    recipient: null
-  });
-  function transition(nextPhase) {
-    const current = state().phase;
-    const allowed = VALID_TRANSITIONS[current];
-    if (!allowed?.includes(nextPhase)) {
-      console.warn(
-        `[TokenFlight] Invalid state transition: ${current} → ${nextPhase}`
-      );
-      return false;
-    }
-    setState((prev) => ({ ...prev, phase: nextPhase }));
-    return true;
-  }
-  function setFromToken(token) {
-    setState((prev) => ({ ...prev, fromToken: token }));
-  }
-  function setToToken(token) {
-    setState((prev) => ({ ...prev, toToken: token }));
-  }
-  function setInputAmount(amount2) {
-    setState((prev) => ({ ...prev, inputAmount: amount2 }));
-  }
-  function setOutputAmount(amount2) {
-    setState((prev) => ({ ...prev, outputAmount: amount2 }));
-  }
-  function setQuoteData(quoteId, routes, selectedRouteId) {
+function deriveSwapPhase(execPhase, error2, isFetching, routeCount, hasQuoteRequest) {
+  if (execPhase) return execPhase;
+  if (error2) return "error";
+  if (isFetching && routeCount === 0 && hasQuoteRequest) return "quoting";
+  if (routeCount > 0) return "quoted";
+  return "idle";
+}
+function deriveReceivePhase(execPhase, error2, loadingQuotes, quoteCount) {
+  if (execPhase) return execPhase;
+  if (error2) return "error";
+  if (loadingQuotes && quoteCount === 0) return "quoting";
+  if (quoteCount > 0) return "quoted";
+  return "idle";
+}
+function createSwapStore() {
+  const [fromToken, setFromToken] = createSignal(null);
+  const [toToken, setToToken] = createSignal(null);
+  const [inputAmount, setInputAmount] = createSignal("");
+  const [recipient, _setRecipient] = createSignal(null);
+  const [walletAddress2, _setWalletAddress] = createSignal(null);
+  const [execPhase, setExecPhase] = createSignal(null);
+  const [order, setOrder] = createSignal(null);
+  const [error2, setError] = createSignal(null);
+  const [errorCode, setErrorCode] = createSignal(null);
+  function setWalletAddress(addr) {
+    if (walletAddress2() === addr) return;
+    _setWalletAddress(addr);
+  }
+  function setRecipient(r) {
+    if (recipient() === r) return;
+    _setRecipient(r);
+  }
+  function clearError() {
     batch(() => {
-      setState((prev) => ({
-        ...prev,
-        quoteId,
-        routes,
-        selectedRouteId
-      }));
-    });
-  }
-  function addStreamingRoute(quoteId, route) {
-    setState((prev) => {
-      if (prev.routes.some((r) => r.routeId === route.routeId)) {
-        return { ...prev, quoteId };
-      }
-      return { ...prev, quoteId, routes: [...prev.routes, route] };
+      setError(null);
+      setErrorCode(null);
     });
   }
-  function clearRoutes() {
-    setState((prev) => ({
-      ...prev,
-      routes: [],
-      quoteId: null,
-      selectedRouteId: null
-    }));
-  }
-  function setSelectedRouteId(routeId) {
-    setState((prev) => ({ ...prev, selectedRouteId: routeId }));
-  }
-  function setStreaming(isStreaming) {
-    setState((prev) => ({ ...prev, isStreaming }));
-  }
-  function setOrder(order) {
-    setState((prev) => ({ ...prev, order }));
-  }
-  function setWalletAddress(address) {
-    if (state().walletAddress === address) return;
-    setState((prev) => ({ ...prev, walletAddress: address }));
-  }
-  function setError(error2, errorCode = null) {
-    const current = state().phase;
-    const allowed = VALID_TRANSITIONS[current];
-    if (allowed?.includes("error")) {
-      setState((prev) => ({ ...prev, error: error2, errorCode, phase: "error" }));
-    } else {
-      setState((prev) => ({ ...prev, error: error2, errorCode }));
-    }
-  }
-  function setRecipient(recipient) {
-    if (state().recipient === recipient) return;
-    setState((prev) => ({ ...prev, recipient }));
-  }
   function reset() {
-    setState((prev) => ({
-      ...prev,
-      phase: "idle",
-      inputAmount: "",
-      outputAmount: "",
-      routes: [],
-      quoteId: null,
-      selectedRouteId: null,
-      order: null,
-      isStreaming: false,
-      error: null,
-      errorCode: null
-    }));
+    batch(() => {
+      setInputAmount("");
+      setOrder(null);
+      setExecPhase(null);
+      setError(null);
+      setErrorCode(null);
+    });
   }
   return {
-    state,
-    transition,
+    // Accessors
+    fromToken,
+    toToken,
+    inputAmount,
+    recipient,
+    walletAddress: walletAddress2,
+    execPhase,
+    order,
+    error: error2,
+    errorCode,
+    // Setters
     setFromToken,
     setToToken,
     setInputAmount,
-    setOutputAmount,
-    setQuoteData,
-    addStreamingRoute,
-    clearRoutes,
-    setSelectedRouteId,
-    setStreaming,
-    setOrder,
+    setRecipient,
     setWalletAddress,
+    setExecPhase,
+    setOrder,
     setError,
-    setRecipient,
+    setErrorCode,
+    // Batch helpers
+    clearError,
     reset
   };
 }
-function createReceiveStateMachine() {
-  const [state, setState] = createSignal({
-    phase: "idle",
-    targetToken: null,
-    fromToken: null,
-    targetAmount: "",
-    paymentAmount: "",
-    routes: [],
-    quoteId: null,
-    selectedRouteId: null,
-    order: null,
-    walletAddress: null,
-    isStreaming: false,
-    error: null,
-    errorCode: null,
-    recipient: null
-  });
-  function transition(nextPhase) {
-    const current = state().phase;
-    const allowed = VALID_TRANSITIONS[current];
-    if (!allowed?.includes(nextPhase)) {
-      console.warn(
-        `[TokenFlight] Invalid state transition: ${current} → ${nextPhase}`
-      );
-      return false;
-    }
-    setState((prev) => ({ ...prev, phase: nextPhase }));
-    return true;
-  }
-  function setTargetToken(token) {
-    setState((prev) => ({ ...prev, targetToken: token }));
-  }
-  function setFromToken(token) {
-    setState((prev) => ({ ...prev, fromToken: token }));
-  }
-  function setTargetAmount(amount2) {
-    setState((prev) => ({ ...prev, targetAmount: amount2 }));
-  }
-  function setPaymentAmount(amount2) {
-    setState((prev) => ({ ...prev, paymentAmount: amount2 }));
-  }
-  function setQuoteData(quoteId, routes, selectedRouteId) {
+function createReceiveStore() {
+  const [targetToken, setTargetToken] = createSignal(null);
+  const [targetAmount, setTargetAmount] = createSignal("");
+  const [fromToken, setFromToken] = createSignal(null);
+  const [recipient, _setRecipient] = createSignal(null);
+  const [walletAddress2, _setWalletAddress] = createSignal(null);
+  const [execPhase, setExecPhase] = createSignal(null);
+  const [order, setOrder] = createSignal(null);
+  const [error2, setError] = createSignal(null);
+  const [errorCode, setErrorCode] = createSignal(null);
+  function setWalletAddress(addr) {
+    if (walletAddress2() === addr) return;
+    _setWalletAddress(addr);
+  }
+  function setRecipient(r) {
+    if (recipient() === r) return;
+    _setRecipient(r);
+  }
+  function clearError() {
     batch(() => {
-      setState((prev) => ({
-        ...prev,
-        quoteId,
-        routes,
-        selectedRouteId
-      }));
-    });
-  }
-  function addStreamingRoute(quoteId, route) {
-    setState((prev) => {
-      if (prev.routes.some((r) => r.routeId === route.routeId)) {
-        return { ...prev, quoteId };
-      }
-      return { ...prev, quoteId, routes: [...prev.routes, route] };
+      setError(null);
+      setErrorCode(null);
     });
   }
-  function clearRoutes() {
-    setState((prev) => ({
-      ...prev,
-      routes: [],
-      quoteId: null,
-      selectedRouteId: null
-    }));
-  }
-  function setSelectedRouteId(routeId) {
-    setState((prev) => ({ ...prev, selectedRouteId: routeId }));
-  }
-  function setStreaming(isStreaming) {
-    setState((prev) => ({ ...prev, isStreaming }));
-  }
-  function setOrder(order) {
-    setState((prev) => ({ ...prev, order }));
-  }
-  function setWalletAddress(address) {
-    if (state().walletAddress === address) return;
-    setState((prev) => ({ ...prev, walletAddress: address }));
-  }
-  function setRecipient(recipient) {
-    if (state().recipient === recipient) return;
-    setState((prev) => ({ ...prev, recipient }));
-  }
-  function setError(error2, errorCode = null) {
-    const current = state().phase;
-    const allowed = VALID_TRANSITIONS[current];
-    if (allowed?.includes("error")) {
-      setState((prev) => ({ ...prev, error: error2, errorCode, phase: "error" }));
-    } else {
-      setState((prev) => ({ ...prev, error: error2, errorCode }));
-    }
-  }
   function reset() {
-    setState((prev) => ({
-      ...prev,
-      phase: "idle",
-      routes: [],
-      quoteId: null,
-      selectedRouteId: null,
-      order: null,
-      error: null,
-      errorCode: null,
-      paymentAmount: "",
-      isStreaming: false
-    }));
+    batch(() => {
+      setFromToken(null);
+      setOrder(null);
+      setExecPhase(null);
+      setError(null);
+      setErrorCode(null);
+    });
   }
   return {
-    state,
-    transition,
+    // Accessors
+    targetToken,
+    targetAmount,
+    fromToken,
+    recipient,
+    walletAddress: walletAddress2,
+    execPhase,
+    order,
+    error: error2,
+    errorCode,
+    // Setters
     setTargetToken,
-    setFromToken,
     setTargetAmount,
-    setPaymentAmount,
-    setQuoteData,
-    addStreamingRoute,
-    clearRoutes,
-    setSelectedRouteId,
-    setStreaming,
-    setOrder,
-    setWalletAddress,
+    setFromToken,
     setRecipient,
+    setWalletAddress,
+    setExecPhase,
+    setOrder,
     setError,
+    setErrorCode,
+    // Batch helpers
+    clearError,
     reset
   };
 }
@@ -8820,6 +8726,328 @@ function getBestOverallRouteId(routes, tradeType) {
   const ranked = rankOffers(offers);
   return ranked[0] ?? null;
 }
+function useWalletConnection(params) {
+  const [isConnected, setIsConnected] = createSignal(false);
+  const [walletAddress2, setWalletAddress] = createSignal(null);
+  const detectChainType = () => {
+    const adapter = params.walletAdapter();
+    if (!adapter) return "evm";
+    return adapter.supportedActionTypes.some((t2) => t2.startsWith("solana_")) ? "solana" : "evm";
+  };
+  let cleanupPrev;
+  createEffect(
+    on(params.walletAdapter, (adapter) => {
+      cleanupPrev?.();
+      cleanupPrev = void 0;
+      if (!adapter) return;
+      const connected = adapter.isConnected();
+      setIsConnected(connected);
+      if (connected) {
+        void adapter.getAddress().then((addr) => {
+          setWalletAddress(addr);
+          params.onAddressChange(addr);
+          params.callbacks()?.onWalletConnected?.({
+            address: addr ?? "",
+            chainType: detectChainType()
+          });
+        });
+      }
+      const handleWalletConnect = async () => {
+        const addr = await adapter.getAddress();
+        if (isConnected() && walletAddress2() === addr) return;
+        batch(() => {
+          setIsConnected(true);
+          setWalletAddress(addr);
+          params.onAddressChange(addr);
+        });
+        params.callbacks()?.onWalletConnected?.({
+          address: addr ?? "",
+          chainType: detectChainType()
+        });
+      };
+      const handleWalletDisconnect = () => {
+        if (!isConnected()) return;
+        batch(() => {
+          setIsConnected(false);
+          setWalletAddress(null);
+          params.onAddressChange(null);
+        });
+        params.onDisconnect?.();
+      };
+      adapter.on("connect", handleWalletConnect);
+      adapter.on("disconnect", handleWalletDisconnect);
+      cleanupPrev = () => {
+        adapter.off("connect", handleWalletConnect);
+        adapter.off("disconnect", handleWalletDisconnect);
+      };
+    })
+  );
+  onCleanup(() => cleanupPrev?.());
+  const handleConnect = async () => {
+    const adapter = params.walletAdapter();
+    if (!adapter) {
+      console.warn(
+        "[TokenFlight] No wallet adapter configured. Pass a walletAdapter to enable wallet connection.\nSee: https://embed.tokenflight.ai/guides/wallet-adapter/"
+      );
+      params.callbacks()?.onConnectWallet?.();
+      return;
+    }
+    try {
+      await adapter.connect();
+    } catch {
+      params.onConnectError?.(
+        "Failed to connect wallet",
+        ErrorCode.WALLET_CONNECTION_FAILED
+      );
+    }
+  };
+  return {
+    isConnected,
+    walletAddress: walletAddress2,
+    detectChainType,
+    handleConnect
+  };
+}
+function useQuoteCountdown(params) {
+  const interval = params.intervalSeconds ?? QUOTE_REFRESH_SECONDS;
+  const [countdownSeconds, setCountdownSeconds] = createSignal(interval);
+  createEffect(
+    on(params.phase, (p) => {
+      if (p !== "quoted") {
+        setCountdownSeconds(interval);
+        return;
+      }
+      setCountdownSeconds(interval);
+      const timer = setInterval(() => {
+        setCountdownSeconds((prev) => {
+          if (prev <= 1) {
+            params.onExpired();
+            return interval;
+          }
+          return prev - 1;
+        });
+      }, 1e3);
+      onCleanup(() => clearInterval(timer));
+    })
+  );
+  return { countdownSeconds };
+}
+function useRecipient(params) {
+  const needRecipient = createMemo(() => {
+    const to = params.toToken();
+    if (!to || !params.isConnected()) return false;
+    const addr = params.walletAddress();
+    if (!addr) return false;
+    const toChainType = getChainType(to.chainId);
+    return !isAddressForChainType(addr, toChainType);
+  });
+  const recipientDisplay = createMemo(() => {
+    const r = params.recipient();
+    if (r) return r;
+    if (params.isConnected() && params.walletAddress() && !needRecipient())
+      return params.walletAddress();
+    return null;
+  });
+  createEffect(
+    on(needRecipient, (need) => {
+      if (need && !params.recipient() && params.walletAdapter()) {
+        const to = params.toToken();
+        if (!to) return;
+        const targetChainType = getChainType(to.chainId);
+        params.walletAdapter().getAddress(targetChainType).then((addr) => {
+          if (addr && isAddressForChainType(addr, targetChainType) && !params.recipient() && needRecipient()) {
+            params.setRecipient(addr);
+          }
+        }).catch(() => {
+        });
+      }
+    })
+  );
+  const handleRecipientChange = (value2) => {
+    params.setRecipient(value2.trim() || null);
+  };
+  return {
+    needRecipient,
+    recipientDisplay,
+    handleRecipientChange
+  };
+}
+function useOrderTracking(params) {
+  const orderQuery = createOrderQuery(
+    params.client,
+    params.walletAddress,
+    params.trackingOrderId,
+    () => params.phase() === "tracking" && !!params.trackingOrderId()
+  );
+  createEffect(
+    on(
+      () => orderQuery.data,
+      (order) => {
+        if (!order || params.execPhase() !== "tracking") return;
+        const isFilled = order.status === "filled" || order.stepsCompleted?.includes("filled");
+        const isFailed = order.status === "failed" || order.status === "refunded";
+        batch(() => {
+          params.setOrder(order);
+          if (isFilled) {
+            params.setExecPhase("success");
+            queryClient.invalidateQueries({
+              queryKey: ["tokenBalances", params.client().baseUrl]
+            });
+            params.onOrderFilled(order);
+          } else if (isFailed) {
+            queryClient.invalidateQueries({
+              queryKey: ["tokenBalances", params.client().baseUrl]
+            });
+            params.onOrderFailed(order);
+          }
+        });
+      }
+    )
+  );
+  return { orderQuery };
+}
+function useSwapExecution(params) {
+  const [trackingOrderId, setTrackingOrderId] = createSignal(
+    null
+  );
+  const [trackingProviderName, setTrackingProviderName] = createSignal(null);
+  const [trackingProviderIcon, setTrackingProviderIcon] = createSignal(null);
+  const [executionError, setExecutionError] = createSignal(null);
+  const handleConfirm = async () => {
+    const currentRoutes = params.routes();
+    const currentQuoteId = params.quoteId();
+    const selectedRoute = currentRoutes.find((r) => r.routeId === params.selectedRouteId()) ?? currentRoutes[0];
+    if (!selectedRoute || !currentQuoteId || !params.client() || !params.walletAdapter())
+      return;
+    if (params.needRecipient() && !params.recipient()) {
+      params.setError("Recipient address is required for cross-chain swaps");
+      params.setErrorCode(ErrorCode.INVALID_CONFIG);
+      return;
+    }
+    const fromChainType = getChainType(params.fromToken().chainId);
+    const addr = params.walletAddress();
+    if (!addr) {
+      params.setError("Wallet not connected");
+      params.setErrorCode(ErrorCode.WALLET_CONNECTION_FAILED);
+      return;
+    }
+    if (!isAddressForChainType(addr, fromChainType)) {
+      params.setError(t("error.walletChainMismatch"));
+      params.setErrorCode(ErrorCode.INVALID_CONFIG);
+      return;
+    }
+    setTrackingProviderName(selectedRoute.routeId ?? null);
+    const apiBase = params.apiEndpoint() ?? DEFAULT_API_ENDPOINT;
+    setTrackingProviderIcon(
+      selectedRoute.icon ? `${apiBase}${selectedRoute.icon}` : null
+    );
+    setExecutionError(null);
+    params.setExecPhase("building");
+    try {
+      const depositData = await params.client().buildDeposit({
+        from: addr,
+        quoteId: currentQuoteId,
+        routeId: selectedRoute.routeId
+      });
+      params.setExecPhase("awaiting-wallet");
+      let txHash;
+      let signedTransaction;
+      if (depositData.kind === "CONTRACT_CALL" && depositData.approvals) {
+        for (const approval of depositData.approvals) {
+          if (approval.type === "eip1193_request") {
+            const result = await params.walletAdapter().executeWalletAction({
+              type: "eip1193_request",
+              chainId: params.fromToken().chainId,
+              method: approval.request.method,
+              params: approval.request.params
+            });
+            if (!result.success) {
+              throw new TokenFlightError(
+                ErrorCode.WALLET_ACTION_FAILED,
+                result.error ?? "Wallet action failed"
+              );
+            }
+            if (approval.deposit) {
+              txHash = result.txHash ?? txHash;
+            }
+          } else if (approval.type === "solana_sendTransaction") {
+            const result = await params.walletAdapter().executeWalletAction({
+              type: "solana_signTransaction",
+              transaction: approval.transaction
+            });
+            if (!result.success) {
+              throw new TokenFlightError(
+                ErrorCode.WALLET_ACTION_FAILED,
+                result.error ?? "Wallet action failed"
+              );
+            }
+            if (approval.deposit) {
+              signedTransaction = typeof result.data === "string" ? result.data : void 0;
+            }
+          }
+        }
+      }
+      if (!txHash && !signedTransaction) {
+        throw new TokenFlightError(
+          ErrorCode.TRANSACTION_FAILED,
+          "No deposit transaction received"
+        );
+      }
+      params.setExecPhase("submitting");
+      const submitResult = await params.client().submitDeposit(
+        signedTransaction ? {
+          quoteId: currentQuoteId,
+          routeId: selectedRoute.routeId,
+          signedTransaction
+        } : {
+          quoteId: currentQuoteId,
+          routeId: selectedRoute.routeId,
+          txHash
+        }
+      );
+      params.setExecPhase("tracking");
+      setTrackingOrderId(submitResult.orderId);
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : typeof err === "string" ? err : "Transaction failed";
+      setExecutionError(errorMsg);
+      if (err instanceof TokenFlightError) {
+        params.callbacks()?.onSwapError?.({
+          code: err.code,
+          message: err.message,
+          details: err.details
+        });
+      } else {
+        params.callbacks()?.onSwapError?.({
+          code: ErrorCode.TRANSACTION_FAILED,
+          message: String(err)
+        });
+      }
+    }
+  };
+  const handleRetry = () => {
+    setExecutionError(null);
+    params.setExecPhase(null);
+  };
+  const handleNewSwap = () => {
+    params.storeReset();
+    setTrackingOrderId(null);
+    setTrackingProviderName(null);
+    setTrackingProviderIcon(null);
+    setExecutionError(null);
+    queryClient.removeQueries({ queryKey: ["quote", params.client().baseUrl] });
+    queryClient.removeQueries({ queryKey: ["order", params.client().baseUrl] });
+    params.onReset?.();
+  };
+  return {
+    trackingOrderId,
+    trackingProviderName,
+    trackingProviderIcon,
+    executionError,
+    handleConfirm,
+    handleRetry,
+    handleNewSwap
+  };
+}
 const header$1 = "tf-dc5721";
 const headerLeft = "tf-68123c";
 const headerLogoImage = "tf-532d07";
@@ -8882,23 +9110,23 @@ const swapStyles = {
 };
 var _tmpl$$3 = /* @__PURE__ */ template(`<div data-testid=selector-overlay>`), _tmpl$2$2 = /* @__PURE__ */ template(`<div>`), _tmpl$3$2 = /* @__PURE__ */ template(`<div part=container><div part=accent-line data-testid=accent-line>`), _tmpl$4$2 = /* @__PURE__ */ template(`<img width=22 height=22>`), _tmpl$5$2 = /* @__PURE__ */ template(`<button part=wallet-info><div data-testid=wallet-dot></div><span data-testid=wallet-address>`), _tmpl$6$2 = /* @__PURE__ */ template(`<div part=header><div><span data-testid=header-title>`), _tmpl$7$2 = /* @__PURE__ */ template(`<div><span part=balance data-testid=panel-balance></span><button data-testid=max-btn>`), _tmpl$8$2 = /* @__PURE__ */ template(`<button part=token-display data-testid=token-btn><div data-testid=token-icon-wrap><div data-testid=token-chain-dot></div></div><span data-testid=token-name></span><span data-testid=caret>`), _tmpl$9$2 = /* @__PURE__ */ template(`<div part=panel-from><div><div><span data-testid=panel-label></span></div><div></div><div><span data-testid=fiat>`), _tmpl$0$2 = /* @__PURE__ */ template(`<div part=swap-arrow><button type=button data-testid=swap-arrow-inner>`), _tmpl$1$2 = /* @__PURE__ */ template(`<button part=recipient-badge data-testid=recipient-badge><span>`), _tmpl$10$2 = /* @__PURE__ */ template(`<span part=amount-display data-testid=amount style=cursor:default>`), _tmpl$11$1 = /* @__PURE__ */ template(`<div part=panel-to data-testid=panel-wrapper-to><div><div><span data-testid=panel-label></span></div><div></div><div><span data-testid=fiat>`), _tmpl$12$1 = /* @__PURE__ */ template(`<div part=price-preview data-testid=quote>`), _tmpl$13 = /* @__PURE__ */ template(`<div part=no-offer><div><svg width=28 height=28 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round><circle cx=11 cy=11 r=8></circle><path d="m21 21-4.35-4.35"></path><path d="M8 11h6"></path></svg></div><span>`), _tmpl$14 = /* @__PURE__ */ template(`<div part=cta-wrapper>`), _tmpl$15 = /* @__PURE__ */ template(`<span>Flight`), _tmpl$16 = /* @__PURE__ */ template(`<button data-testid=token-btn><span data-testid=token-name></span><span data-testid=caret>`), _tmpl$17 = /* @__PURE__ */ template(`<div style=width:120px;height:28px>`);
 function SwapComponent(props) {
-  const sm = createSwapStateMachine();
+  const store = createSwapStore();
   const [selectorOpen, setSelectorOpen] = createSignal(null);
-  const [isConnected, setIsConnected] = createSignal(false);
-  const [walletAddress2, setWalletAddress] = createSignal(null);
-  const [trackingOrderId, setTrackingOrderId] = createSignal(null);
   const [recipientEditorOpen, setRecipientEditorOpen] = createSignal(false);
-  const [noRoutes, setNoRoutes] = createSignal(false);
-  const [trackingProviderName, setTrackingProviderName] = createSignal(null);
-  const [trackingProviderIcon, setTrackingProviderIcon] = createSignal(null);
-  const [executionError, setExecutionError] = createSignal(null);
+  const {
+    isConnected,
+    walletAddress: walletAddress2,
+    handleConnect
+  } = useWalletConnection({
+    walletAdapter: () => props.walletAdapter,
+    callbacks: () => props.callbacks,
+    onAddressChange: (addr) => store.setWalletAddress(addr),
+    onConnectError: (msg, code) => {
+      store.setError(msg);
+      store.setErrorCode(code);
+    }
+  });
   const [debouncedAmount, setDebouncedAmount, setDebouncedAmountImmediate] = createDebounced("", 300);
-  const phase = createMemo(() => sm.state().phase);
-  const fromToken = createMemo(() => sm.state().fromToken);
-  const toToken = createMemo(() => sm.state().toToken);
-  const inputAmount = createMemo(() => sm.state().inputAmount);
-  const outputAmount = createMemo(() => sm.state().outputAmount);
-  const recipient = createMemo(() => sm.state().recipient);
   const client = createMemo(() => {
     const endpoint = props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
     return new HyperstreamApi({
@@ -8907,7 +9135,7 @@ function SwapComponent(props) {
   });
   const balancesQuery = createTokenBalancesQuery(client, walletAddress2, () => isConnected() && !!walletAddress2(), () => props.walletAdapter?.supportedChainIds);
   const fromBalance = createMemo(() => {
-    const from = fromToken();
+    const from = store.fromToken();
     if (!from || typeof from.decimals !== "number" || !balancesQuery.data) return null;
     const match = balancesQuery.data.find((tk) => tk.address.toLowerCase() === from.address.toLowerCase() && tk.chainId === from.chainId);
     if (match?.extensions?.balance) {
@@ -8916,14 +9144,14 @@ function SwapComponent(props) {
     return "0";
   });
   const fromBalanceRaw = createMemo(() => {
-    const from = fromToken();
+    const from = store.fromToken();
     if (!from || typeof from.decimals !== "number" || !balancesQuery.data) return null;
     const match = balancesQuery.data.find((tk) => tk.address.toLowerCase() === from.address.toLowerCase() && tk.chainId === from.chainId);
     return match?.extensions?.balance ?? "0";
   });
   const insufficientBalance = createMemo(() => {
-    const input = inputAmount();
-    const from = fromToken();
+    const input = store.inputAmount();
+    const from = store.fromToken();
     const balRaw = fromBalanceRaw();
     if (!from || typeof from.decimals !== "number" || !balRaw || !input || input === "0" || input === "") {
       return false;
@@ -8935,7 +9163,7 @@ function SwapComponent(props) {
     }
   });
   const fromUnitPriceUsd = createMemo(() => {
-    const from = fromToken();
+    const from = store.fromToken();
     if (!from) return null;
     if (typeof from.priceUsd === "number" && Number.isFinite(from.priceUsd)) {
       return from.priceUsd;
@@ -8945,7 +9173,7 @@ function SwapComponent(props) {
     return Number.isFinite(parsed) ? parsed : null;
   });
   const toUnitPriceUsd = createMemo(() => {
-    const to = toToken();
+    const to = store.toToken();
     if (!to) return null;
     if (typeof to.priceUsd === "number" && Number.isFinite(to.priceUsd)) {
       return to.priceUsd;
@@ -8957,8 +9185,83 @@ function SwapComponent(props) {
     if (value2 < 0.01) return "<0.01";
     return value2.toFixed(2).replace(/\.?0+$/, "");
   };
+  const {
+    needRecipient,
+    recipientDisplay,
+    handleRecipientChange
+  } = useRecipient({
+    fromToken: store.fromToken,
+    toToken: store.toToken,
+    recipient: store.recipient,
+    isConnected,
+    walletAddress: walletAddress2,
+    walletAdapter: () => props.walletAdapter,
+    setRecipient: store.setRecipient
+  });
+  const quoteRequest = createMemo(() => {
+    const amount2 = debouncedAmount();
+    const from = store.fromToken();
+    const to = store.toToken();
+    const r = store.recipient();
+    if (!amount2 || parseFloat(amount2) <= 0 || !from || typeof from.decimals !== "number" || !to || !client()) return null;
+    if (needRecipient() && !r) return null;
+    return {
+      tradeType: "EXACT_INPUT",
+      fromChainId: from.chainId,
+      fromToken: from.address,
+      toChainId: to.chainId,
+      toToken: to.address,
+      amount: toBaseUnits(amount2, from.decimals),
+      fromAddress: walletAddress2() ?? getDefaultAddress(from.chainId),
+      ...r && {
+        recipient: r
+      }
+    };
+  });
+  const quoteQueryEnabled = createMemo(() => !!quoteRequest() && !store.execPhase());
+  const quoteQuery = createQuoteQuery(client, quoteRequest, quoteQueryEnabled);
+  const routes = createMemo(() => {
+    const amount2 = store.inputAmount();
+    if (!amount2 || parseFloat(amount2) <= 0) return [];
+    if (!store.fromToken() || !store.toToken()) return [];
+    return quoteQuery.data?.routes ?? [];
+  });
+  const quoteId = createMemo(() => quoteQuery.data?.quoteId ?? null);
+  const selectedRouteId = createMemo(() => {
+    const r = routes();
+    return r.length > 0 ? getBestOverallSwapRouteId(r) : null;
+  });
+  const bestRoute = createMemo(() => {
+    const r = routes();
+    const sel = selectedRouteId();
+    return r.find((rt) => rt.routeId === sel) ?? r[0] ?? null;
+  });
+  const outputAmount = createMemo(() => {
+    const route = bestRoute();
+    const to = store.toToken();
+    if (!route || !to || typeof to.decimals !== "number") return "";
+    return formatDisplayAmount(toDisplayAmount(route.quote.amountOut, to.decimals));
+  });
+  const phase = createMemo(() => deriveSwapPhase(store.execPhase(), store.error(), quoteQuery.isFetching, routes().length, !!quoteRequest()));
+  const noRoutes = createMemo(() => {
+    if (store.execPhase()) return false;
+    if (!quoteRequest()) return false;
+    return !quoteQuery.isFetching && quoteQuery.isSuccess && routes().length === 0;
+  });
+  const showQuote = createMemo(() => {
+    const p = phase();
+    return p === "quoted" || p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking" || p === "success";
+  });
+  const isExecuting = createMemo(() => {
+    const p = phase();
+    return p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking";
+  });
+  const isQuoteLoading = createMemo(() => {
+    if (!store.fromToken() || !store.toToken()) return false;
+    return phase() === "quoting" && parseFloat(store.inputAmount()) > 0 && routes().length === 0;
+  });
   const inputFiatText = createMemo(() => {
-    const amount2 = Number(inputAmount());
+    const amount2 = Number(store.inputAmount());
     const price = fromUnitPriceUsd();
     if (!Number.isFinite(amount2) || amount2 <= 0 || price === null) return null;
     return t("swap.fiatValue", {
@@ -8968,45 +9271,95 @@ function SwapComponent(props) {
   const outputFiatText = createMemo(() => {
     const amount2 = Number(outputAmount() || "0");
     const price = toUnitPriceUsd();
-    const p = phase();
-    const show = p === "quoted" || p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking" || p === "success";
-    if (!show || !Number.isFinite(amount2) || amount2 <= 0 || price === null) return null;
+    if (!showQuote() || !Number.isFinite(amount2) || amount2 <= 0 || price === null) return null;
     return t("swap.fiatValue", {
       value: formatUsd(amount2 * price)
     });
   });
-  const orderQuery = createOrderQuery(client, walletAddress2, trackingOrderId, () => phase() === "tracking" && !!trackingOrderId());
-  createEffect(on(() => orderQuery.data, (order) => {
-    if (!order || sm.state().phase !== "tracking") return;
-    const isFilled = order.status === "filled" || order.stepsCompleted?.includes("filled");
-    const isFailed = order.status === "failed" || order.status === "refunded";
-    batch(() => {
-      sm.setOrder(order);
-      if (isFilled) {
-        sm.transition("success");
-        queryClient.invalidateQueries({
-          queryKey: ["tokenBalances", client().baseUrl]
-        });
-        const state2 = sm.state();
-        props.callbacks?.onSwapSuccess?.({
-          orderId: order.id,
-          fromToken: state2.fromToken.symbol ?? state2.fromToken.address,
-          toToken: state2.toToken.symbol ?? state2.toToken.address,
-          fromAmount: order.srcAmount,
-          toAmount: order.destAmount,
-          txHash: order.depositTxHash
-        });
-      } else if (isFailed) {
-        queryClient.invalidateQueries({
-          queryKey: ["tokenBalances", client().baseUrl]
-        });
-        props.callbacks?.onSwapError?.({
-          code: ErrorCode.ORDER_FAILED,
-          message: "Order " + order.status
-        });
+  const {
+    trackingOrderId,
+    trackingProviderName,
+    trackingProviderIcon,
+    executionError,
+    handleConfirm,
+    handleRetry,
+    handleNewSwap
+  } = useSwapExecution({
+    client,
+    walletAdapter: () => props.walletAdapter,
+    callbacks: () => props.callbacks,
+    apiEndpoint: () => props.config.apiEndpoint,
+    fromToken: store.fromToken,
+    recipient: store.recipient,
+    needRecipient,
+    walletAddress: walletAddress2,
+    routes,
+    quoteId,
+    selectedRouteId,
+    setExecPhase: store.setExecPhase,
+    setError: store.setError,
+    setErrorCode: store.setErrorCode,
+    storeReset: store.reset,
+    onReset: () => setDebouncedAmountImmediate("")
+  });
+  useOrderTracking({
+    client,
+    walletAddress: walletAddress2,
+    trackingOrderId,
+    phase,
+    execPhase: store.execPhase,
+    setOrder: store.setOrder,
+    setExecPhase: store.setExecPhase,
+    onOrderFilled: (order) => {
+      props.callbacks?.onSwapSuccess?.({
+        orderId: order.id,
+        fromToken: store.fromToken().symbol ?? store.fromToken().address,
+        toToken: store.toToken().symbol ?? store.toToken().address,
+        fromAmount: order.srcAmount,
+        toAmount: order.destAmount,
+        txHash: order.depositTxHash
+      });
+    },
+    onOrderFailed: (order) => {
+      props.callbacks?.onSwapError?.({
+        code: ErrorCode.ORDER_FAILED,
+        message: "Order " + order.status
+      });
+    }
+  });
+  createEffect(on(() => quoteQuery.data, (data) => {
+    if (data) props.callbacks?.onQuoteReceived?.(data);
+  }));
+  createEffect(on(() => ({
+    isError: quoteQuery.isError,
+    error: quoteQuery.error,
+    data: quoteQuery.data
+  }), ({
+    isError,
+    error: error2,
+    data
+  }) => {
+    if (store.execPhase()) return;
+    if (isError && !data) {
+      if (error2 instanceof TokenFlightError) {
+        store.setError(error2.message);
+        store.setErrorCode(error2.code);
+      } else {
+        store.setError(String(error2));
+        store.setErrorCode(null);
       }
-    });
+    } else if (store.error() && !isError) {
+      store.clearError();
+    }
   }));
+  const {
+    countdownSeconds
+  } = useQuoteCountdown({
+    phase,
+    onExpired: () => {
+      quoteQuery.refetch();
+    }
+  });
   onMount(() => {
     if (props.config.locale) {
       setLocale(props.config.locale);
@@ -9026,7 +9379,7 @@ function SwapComponent(props) {
         if (typeof resolved.decimals !== "number") {
           throw new TokenFlightError(ErrorCode.INVALID_TOKEN_IDENTIFIER, "Failed to resolve fromToken metadata");
         }
-        sm.setFromToken(resolved);
+        store.setFromToken(resolved);
       } catch (err) {
         props.callbacks?.onSwapError?.({
           code: ErrorCode.INVALID_TOKEN_IDENTIFIER,
@@ -9041,7 +9394,7 @@ function SwapComponent(props) {
         if (typeof resolved.decimals !== "number") {
           throw new TokenFlightError(ErrorCode.INVALID_TOKEN_IDENTIFIER, "Failed to resolve toToken metadata");
         }
-        sm.setToToken(resolved);
+        store.setToToken(resolved);
       } catch (err) {
         props.callbacks?.onSwapError?.({
           code: ErrorCode.INVALID_TOKEN_IDENTIFIER,
@@ -9050,333 +9403,20 @@ function SwapComponent(props) {
       }
     }
   });
-  const detectChainType = () => {
-    if (!props.walletAdapter) return "evm";
-    return props.walletAdapter.supportedActionTypes.some((t2) => t2.startsWith("solana_")) ? "solana" : "evm";
-  };
-  const needRecipient = createMemo(() => {
-    const from = fromToken();
-    const to = toToken();
-    if (!from || !to || !isConnected()) return false;
-    return isCrossChainSwap(from.chainId, to.chainId);
-  });
-  const recipientDisplay = createMemo(() => {
-    const r = recipient();
-    if (r) return r;
-    if (isConnected() && walletAddress2() && !needRecipient()) return walletAddress2();
-    return null;
-  });
   onMount(() => {
     if (props.config.recipient) {
-      sm.setRecipient(props.config.recipient);
-    }
-  });
-  const handleRecipientChange = (value2) => {
-    const trimmed = value2.trim() || null;
-    sm.setRecipient(trimmed);
-    if (!trimmed) {
-      sm.clearRoutes();
-      sm.setOutputAmount("");
-      if (sm.state().phase !== "idle") {
-        sm.transition("idle");
-      }
-    }
-  };
-  onMount(async () => {
-    if (props.walletAdapter) {
-      const connected = props.walletAdapter.isConnected();
-      setIsConnected(connected);
-      if (connected) {
-        const addr = await props.walletAdapter.getAddress();
-        setWalletAddress(addr);
-        sm.setWalletAddress(addr);
-        props.callbacks?.onWalletConnected?.({
-          address: addr ?? "",
-          chainType: detectChainType()
-        });
-      }
-      const handleWalletConnect = async () => {
-        const addr = await props.walletAdapter.getAddress();
-        if (isConnected() && walletAddress2() === addr) return;
-        batch(() => {
-          setIsConnected(true);
-          setWalletAddress(addr);
-          sm.setWalletAddress(addr);
-        });
-        props.callbacks?.onWalletConnected?.({
-          address: addr ?? "",
-          chainType: detectChainType()
-        });
-      };
-      const handleWalletDisconnect = () => {
-        if (!isConnected()) return;
-        batch(() => {
-          setIsConnected(false);
-          setWalletAddress(null);
-          sm.setWalletAddress(null);
-        });
-      };
-      props.walletAdapter.on("connect", handleWalletConnect);
-      props.walletAdapter.on("disconnect", handleWalletDisconnect);
-      onCleanup(() => {
-        props.walletAdapter.off("connect", handleWalletConnect);
-        props.walletAdapter.off("disconnect", handleWalletDisconnect);
-      });
+      store.setRecipient(props.config.recipient);
     }
   });
-  const quoteRequest = createMemo(() => {
-    const amount2 = debouncedAmount();
-    const from = fromToken();
-    const to = toToken();
-    const r = recipient();
-    if (!amount2 || parseFloat(amount2) <= 0 || !from || typeof from.decimals !== "number" || !to || !client()) return null;
-    if (needRecipient() && !r) return null;
-    return {
-      tradeType: "EXACT_INPUT",
-      fromChainId: from.chainId,
-      fromToken: from.address,
-      toChainId: to.chainId,
-      toToken: to.address,
-      amount: toBaseUnits(amount2, from.decimals),
-      fromAddress: walletAddress2() ?? getDefaultAddress(from.chainId),
-      ...r && {
-        recipient: r
-      }
-    };
-  });
-  const quoteQueryEnabled = createMemo(() => {
-    const p = phase();
-    const hasRequest = !!quoteRequest();
-    return hasRequest && (p === "idle" || p === "quoting" || p === "quoted");
-  });
-  const quoteQuery = createQuoteQuery(client, quoteRequest, quoteQueryEnabled);
-  createEffect(on(() => quoteQuery.data, (data) => {
-    if (data) props.callbacks?.onQuoteReceived?.(data);
-  }));
-  createEffect(on(() => ({
-    data: quoteQuery.data,
-    isFetching: quoteQuery.isFetching,
-    isError: quoteQuery.isError,
-    error: quoteQuery.error
-  }), ({
-    data,
-    isFetching,
-    isError,
-    error: error2
-  }) => {
-    const phase2 = sm.state().phase;
-    if (phase2 === "building" || phase2 === "awaiting-wallet" || phase2 === "submitting" || phase2 === "tracking" || phase2 === "success") return;
-    if (isFetching && !data) {
-      if (phase2 !== "quoting") {
-        sm.clearRoutes();
-        setNoRoutes(false);
-        sm.transition("quoting");
-      }
-      return;
-    }
-    if (isError && !data) {
-      if (error2 instanceof TokenFlightError) {
-        sm.setError(error2.message, error2.code);
-      } else {
-        sm.setError(String(error2));
-      }
-      return;
-    }
-    if (data) {
-      const toDecimals = sm.state().toToken?.decimals ?? 18;
-      const bestId = getBestOverallSwapRouteId(data.routes);
-      sm.setQuoteData(data.quoteId, data.routes, bestId);
-      if (bestId) {
-        const bestRoute2 = data.routes.find((r) => r.routeId === bestId);
-        if (bestRoute2) {
-          sm.setOutputAmount(formatDisplayAmount(toDisplayAmount(bestRoute2.quote.amountOut, toDecimals)));
-        }
-      }
-      if (data.routes.length > 0) {
-        setNoRoutes(false);
-        if (phase2 !== "quoted") sm.transition("quoted");
-      } else {
-        setNoRoutes(true);
-        if (phase2 !== "idle") sm.transition("idle");
-      }
-    }
-  }));
-  const [countdownSeconds, setCountdownSeconds] = createSignal(QUOTE_REFRESH_SECONDS);
-  createEffect(on(phase, (p) => {
-    if (p !== "quoted") {
-      setCountdownSeconds(QUOTE_REFRESH_SECONDS);
-      return;
-    }
-    setCountdownSeconds(QUOTE_REFRESH_SECONDS);
-    const timer = setInterval(() => {
-      setCountdownSeconds((prev) => {
-        if (prev <= 1) {
-          quoteQuery.refetch();
-          return QUOTE_REFRESH_SECONDS;
-        }
-        return prev - 1;
-      });
-    }, 1e3);
-    onCleanup(() => clearInterval(timer));
-  }));
   const handleAmountChange = (amount2) => {
-    sm.setInputAmount(amount2);
+    store.setInputAmount(amount2);
     props.callbacks?.onAmountChanged?.({
       amount: amount2,
       direction: "from"
     });
-    if (!amount2 || parseFloat(amount2) <= 0) {
-      sm.clearRoutes();
-      sm.setOutputAmount("");
-      setNoRoutes(false);
-      if (sm.state().phase !== "idle") {
-        sm.transition("idle");
-      }
-    } else if (sm.state().phase === "error") {
-      sm.transition("idle");
-    }
+    if (store.error()) store.clearError();
     setDebouncedAmount(amount2);
   };
-  createEffect(on(needRecipient, (need) => {
-    if (need && !recipient() && props.walletAdapter) {
-      const to = toToken();
-      if (!to) return;
-      const targetChainType = getChainType(to.chainId);
-      props.walletAdapter.getAddress(targetChainType).then((addr) => {
-        if (addr && isAddressForChainType(addr, targetChainType) && !recipient() && needRecipient()) {
-          sm.setRecipient(addr);
-        }
-      }).catch(() => {
-      });
-    }
-  }));
-  const handleConnect = async () => {
-    if (!props.walletAdapter) {
-      console.warn("[TokenFlight] No wallet adapter configured. Pass a walletAdapter to enable wallet connection.\nSee: https://embed.tokenflight.ai/guides/wallet-adapter/");
-      props.callbacks?.onConnectWallet?.();
-      return;
-    }
-    try {
-      await props.walletAdapter.connect();
-    } catch {
-      sm.setError("Failed to connect wallet", ErrorCode.WALLET_CONNECTION_FAILED);
-    }
-  };
-  const handleConfirm = async () => {
-    const state2 = sm.state();
-    const selectedRoute = state2.routes.find((r) => r.routeId === state2.selectedRouteId) ?? state2.routes[0];
-    if (!selectedRoute || !state2.quoteId || !client() || !props.walletAdapter) return;
-    if (needRecipient() && !state2.recipient) {
-      sm.setError("Recipient address is required for cross-chain swaps", ErrorCode.INVALID_CONFIG);
-      return;
-    }
-    const fromChainType = getChainType(state2.fromToken.chainId);
-    const addr = walletAddress2();
-    if (!addr) {
-      sm.setError("Wallet not connected", ErrorCode.WALLET_CONNECTION_FAILED);
-      return;
-    }
-    if (!isAddressForChainType(addr, fromChainType)) {
-      sm.setError(t("error.walletChainMismatch"), ErrorCode.INVALID_CONFIG);
-      return;
-    }
-    setTrackingProviderName(selectedRoute.routeId ?? null);
-    const apiBase = props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
-    setTrackingProviderIcon(selectedRoute.icon ? `${apiBase}${selectedRoute.icon}` : null);
-    setExecutionError(null);
-    sm.transition("building");
-    try {
-      const depositData = await client().buildDeposit({
-        from: walletAddress2(),
-        quoteId: state2.quoteId,
-        routeId: selectedRoute.routeId
-      });
-      sm.transition("awaiting-wallet");
-      let txHash;
-      let signedTransaction;
-      if (depositData.kind === "CONTRACT_CALL" && depositData.approvals) {
-        for (const approval of depositData.approvals) {
-          if (approval.type === "eip1193_request") {
-            const result = await props.walletAdapter.executeWalletAction({
-              type: "eip1193_request",
-              chainId: state2.fromToken.chainId,
-              method: approval.request.method,
-              params: approval.request.params
-            });
-            if (!result.success) {
-              throw new TokenFlightError(ErrorCode.WALLET_ACTION_FAILED, result.error ?? "Wallet action failed");
-            }
-            if (approval.deposit) {
-              txHash = result.txHash ?? txHash;
-            }
-          } else if (approval.type === "solana_sendTransaction") {
-            const result = await props.walletAdapter.executeWalletAction({
-              type: "solana_signTransaction",
-              transaction: approval.transaction
-            });
-            if (!result.success) {
-              throw new TokenFlightError(ErrorCode.WALLET_ACTION_FAILED, result.error ?? "Wallet action failed");
-            }
-            if (approval.deposit) {
-              signedTransaction = typeof result.data === "string" ? result.data : void 0;
-            }
-          }
-        }
-      }
-      if (!txHash && !signedTransaction) {
-        throw new TokenFlightError(ErrorCode.TRANSACTION_FAILED, "No deposit transaction received");
-      }
-      sm.transition("submitting");
-      const submitResult = await client().submitDeposit(signedTransaction ? {
-        quoteId: state2.quoteId,
-        routeId: selectedRoute.routeId,
-        signedTransaction
-      } : {
-        quoteId: state2.quoteId,
-        routeId: selectedRoute.routeId,
-        txHash
-      });
-      sm.transition("tracking");
-      setTrackingOrderId(submitResult.orderId);
-    } catch (err) {
-      const errorMsg = err instanceof Error ? err.message : typeof err === "string" ? err : "Transaction failed";
-      setExecutionError(errorMsg);
-      if (err instanceof TokenFlightError) {
-        props.callbacks?.onSwapError?.({
-          code: err.code,
-          message: err.message,
-          details: err.details
-        });
-      } else {
-        props.callbacks?.onSwapError?.({
-          code: ErrorCode.TRANSACTION_FAILED,
-          message: String(err)
-        });
-      }
-    }
-  };
-  const handleRetry = () => {
-    setExecutionError(null);
-    sm.transition("quoted");
-  };
-  const handleNewSwap = () => {
-    sm.clearRoutes();
-    sm.setOutputAmount("");
-    sm.setInputAmount("");
-    sm.setOrder(null);
-    setDebouncedAmountImmediate("");
-    setTrackingOrderId(null);
-    setTrackingProviderName(null);
-    setTrackingProviderIcon(null);
-    setExecutionError(null);
-    queryClient.removeQueries({
-      queryKey: ["quote", client().baseUrl]
-    });
-    queryClient.removeQueries({
-      queryKey: ["order", client().baseUrl]
-    });
-    sm.transition("idle");
-  };
   const handleTokenSelect = (token) => {
     const resolved = {
       chainId: token.chainId,
@@ -9388,43 +9428,29 @@ function SwapComponent(props) {
       priceUsd: token.priceUsd
     };
     if (selectorOpen() === "from") {
-      sm.setFromToken(resolved);
+      store.setFromToken(resolved);
     } else {
-      sm.setToToken(resolved);
+      store.setToToken(resolved);
     }
     setSelectorOpen(null);
-    const amount2 = sm.state().inputAmount;
-    if (!amount2 || parseFloat(amount2) <= 0) {
-      sm.clearRoutes();
-      sm.setOutputAmount("");
-      if (sm.state().phase !== "idle") {
-        sm.transition("idle");
-      }
-    }
   };
   const handleSwapTokens = () => {
-    const current = sm.state();
-    const phase2 = current.phase;
-    const isBusy = phase2 === "building" || phase2 === "awaiting-wallet" || phase2 === "submitting" || phase2 === "tracking";
-    if (isBusy || !current.fromToken || !current.toToken) return;
-    sm.setFromToken(current.toToken);
-    sm.setToToken(current.fromToken);
-    sm.clearRoutes();
-    sm.setOutputAmount("");
-    if (phase2 === "success") {
-      sm.transition("idle");
-    }
-    const amount2 = current.inputAmount;
-    if (!amount2 || parseFloat(amount2) <= 0) {
-      if (sm.state().phase !== "idle") {
-        sm.transition("idle");
-      }
-    }
+    if (isExecuting() || !store.fromToken() || !store.toToken()) return;
+    const from = store.fromToken();
+    const to = store.toToken();
+    batch(() => {
+      store.setFromToken(to);
+      store.setToToken(from);
+      if (store.execPhase() === "success") store.setExecPhase(null);
+    });
   };
   const handleMaxClick = () => {
-    const bal = fromBalance();
-    if (bal && bal !== "0") {
-      handleAmountChange(bal);
+    const from = store.fromToken();
+    const balRaw = fromBalanceRaw();
+    if (!from || typeof from.decimals !== "number" || !balRaw || balRaw === "0") return;
+    const fullPrecision = toDisplayAmount(balRaw, from.decimals);
+    if (fullPrecision && fullPrecision !== "0") {
+      handleAmountChange(fullPrecision);
     }
   };
   const handleAccountClick = async () => {
@@ -9435,20 +9461,12 @@ function SwapComponent(props) {
     }
   };
   const truncateAddress = (addr) => `${addr.slice(0, 6)}...${addr.slice(-4)}`;
-  const showQuote = () => {
-    const p = phase();
-    return p === "quoted" || p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking" || p === "success";
-  };
-  const isExecuting = () => {
-    const p = phase();
-    return p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking";
-  };
-  const state = sm.state;
-  const bestRoute = () => {
-    const s = sm.state();
-    if (s.routes.length === 0) return null;
-    return s.routes.find((r) => r.routeId === s.selectedRouteId) ?? s.routes[0] ?? null;
-  };
+  const quotePreviewRoute = createMemo(() => {
+    const route = bestRoute();
+    if (!route || !store.fromToken() || !store.toToken()) return null;
+    if (phase() === "quoting" || showQuote()) return route;
+    return null;
+  });
   const titleText = createMemo(() => {
     const raw = props.config.titleText?.trim();
     return raw && raw.length > 0 ? raw : "TokenFlight";
@@ -9461,23 +9479,11 @@ function SwapComponent(props) {
     const raw = props.config.titleImageUrl?.trim();
     return raw && raw.length > 0 ? raw : null;
   });
-  const isQuoteLoading = createMemo(() => {
-    const s = sm.state();
-    if (!s.fromToken || !s.toToken) return false;
-    return s.phase === "quoting" && parseFloat(s.inputAmount) > 0 && s.routes.length === 0;
-  });
-  const quotePreviewRoute = createMemo(() => {
-    const s = sm.state();
-    const route = bestRoute();
-    if (!route || !s.fromToken || !s.toToken) return null;
-    if (s.phase === "quoting" || showQuote()) return route;
-    return null;
-  });
   return (() => {
     var _el$ = _tmpl$3$2(), _el$2 = _el$.firstChild;
     insert(_el$, createComponent(Show, {
       get when() {
-        return memo(() => state().phase === "success")() && state().order;
+        return memo(() => phase() === "success")() && store.order();
       },
       get fallback() {
         return createComponent(Show, {
@@ -9595,7 +9601,7 @@ function SwapComponent(props) {
               }), null);
               insert(_el$17, createComponent(AmountInput, {
                 get value() {
-                  return state().inputAmount;
+                  return store.inputAmount();
                 },
                 onChange: handleAmountChange,
                 get disabled() {
@@ -9604,7 +9610,7 @@ function SwapComponent(props) {
               }), null);
               insert(_el$17, createComponent(Show, {
                 get when() {
-                  return state().fromToken;
+                  return store.fromToken();
                 },
                 get fallback() {
                   return (() => {
@@ -9633,21 +9639,21 @@ function SwapComponent(props) {
                   addEventListener(_el$18, "click", () => setSelectorOpen("from"));
                   insert(_el$19, createComponent(TokenIcon, {
                     get symbol() {
-                      return state().fromToken.symbol ?? "?";
+                      return store.fromToken().symbol ?? "?";
                     },
                     color: "#2775CA",
                     size: 24,
                     get logoURI() {
-                      return state().fromToken.logoURI;
+                      return store.fromToken().logoURI;
                     }
                   }), _el$20);
                   insert(_el$20, createComponent(ChainDot, {
                     size: 10,
                     get iconUrl() {
-                      return chainIconUrl(client().baseUrl, state().fromToken.chainId);
+                      return chainIconUrl(client().baseUrl, store.fromToken().chainId);
                     }
                   }));
-                  insert(_el$21, () => state().fromToken.symbol);
+                  insert(_el$21, () => store.fromToken().symbol);
                   insert(_el$22, createComponent(chevron_down_default, {
                     size: 14
                   }));
@@ -9713,7 +9719,7 @@ function SwapComponent(props) {
               insert(_el$30, () => t("swap.youReceive"));
               insert(_el$29, createComponent(Show, {
                 get when() {
-                  return memo(() => !!isConnected())() && state().toToken;
+                  return memo(() => !!isConnected())() && store.toToken();
                 },
                 get children() {
                   var _el$31 = _tmpl$1$2(), _el$32 = _el$31.firstChild;
@@ -9752,17 +9758,17 @@ function SwapComponent(props) {
                   var _el$34 = _tmpl$10$2();
                   insert(_el$34, createComponent(SignificantNumber, {
                     get value() {
-                      return memo(() => !!(showQuote() || state().phase === "quoting"))() ? state().outputAmount || "0" : "0";
+                      return memo(() => !!(showQuote() || phase() === "quoting"))() ? outputAmount() || "0" : "0";
                     },
                     digits: 8
                   }));
-                  createRenderEffect(() => className(_el$34, `${amountStyles.amount} ${!showQuote() && state().phase !== "quoting" ? amountStyles.muted : ""}`));
+                  createRenderEffect(() => className(_el$34, `${amountStyles.amount} ${!showQuote() && phase() !== "quoting" ? amountStyles.muted : ""}`));
                   return _el$34;
                 }
               }), null);
               insert(_el$33, createComponent(Show, {
                 get when() {
-                  return state().toToken;
+                  return store.toToken();
                 },
                 get fallback() {
                   return (() => {
@@ -9791,21 +9797,21 @@ function SwapComponent(props) {
                   addEventListener(_el$35, "click", () => setSelectorOpen("to"));
                   insert(_el$36, createComponent(TokenIcon, {
                     get symbol() {
-                      return state().toToken.symbol ?? "?";
+                      return store.toToken().symbol ?? "?";
                     },
                     color: "#0052FF",
                     size: 24,
                     get logoURI() {
-                      return state().toToken.logoURI;
+                      return store.toToken().logoURI;
                     }
                   }), _el$37);
                   insert(_el$37, createComponent(ChainDot, {
                     size: 10,
                     get iconUrl() {
-                      return chainIconUrl(client().baseUrl, state().toToken.chainId);
+                      return chainIconUrl(client().baseUrl, store.toToken().chainId);
                     }
                   }));
-                  insert(_el$38, () => state().toToken.symbol);
+                  insert(_el$38, () => store.toToken().symbol);
                   insert(_el$39, createComponent(chevron_down_default, {
                     size: 14
                   }));
@@ -9857,7 +9863,7 @@ function SwapComponent(props) {
               }
             }), createComponent(Show, {
               get when() {
-                return memo(() => !!(quotePreviewRoute() && state().fromToken))() && state().toToken;
+                return memo(() => !!(quotePreviewRoute() && store.fromToken()))() && store.toToken();
               },
               get children() {
                 var _el$42 = _tmpl$12$1();
@@ -9866,15 +9872,15 @@ function SwapComponent(props) {
                     return quotePreviewRoute();
                   },
                   get fromToken() {
-                    return state().fromToken;
+                    return store.fromToken();
                   },
                   get toToken() {
-                    return state().toToken;
+                    return store.toToken();
                   },
                   inline: true,
                   countdownSeconds,
                   countdownTotal: QUOTE_REFRESH_SECONDS,
-                  showCountdown: () => state().phase === "quoted"
+                  showCountdown: () => phase() === "quoted"
                 }));
                 createRenderEffect(() => className(_el$42, quoteStyles.quote));
                 return _el$42;
@@ -9903,7 +9909,7 @@ function SwapComponent(props) {
               var _el$46 = _tmpl$14();
               insert(_el$46, createComponent(ActionButton, {
                 get phase() {
-                  return state().phase;
+                  return phase();
                 },
                 get isConnected() {
                   return isConnected();
@@ -9915,10 +9921,10 @@ function SwapComponent(props) {
                 onConfirm: handleConfirm,
                 onRetry: handleRetry,
                 get errorLabel() {
-                  return state().error ?? void 0;
+                  return store.error() ?? void 0;
                 },
                 get needsRecipient() {
-                  return memo(() => !!needRecipient())() && !state().recipient;
+                  return memo(() => !!needRecipient())() && !store.recipient();
                 },
                 onEnterRecipient: () => setRecipientEditorOpen(true),
                 get insufficientBalance() {
@@ -9932,13 +9938,13 @@ function SwapComponent(props) {
           get children() {
             return createComponent(OrderProgress, {
               get order() {
-                return state().order;
+                return store.order();
               },
               get fromToken() {
-                return state().fromToken;
+                return store.fromToken();
               },
               get toToken() {
-                return state().toToken;
+                return store.toToken();
               },
               get providerName() {
                 return trackingProviderName();
@@ -9950,10 +9956,10 @@ function SwapComponent(props) {
                 return props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
               },
               get inputAmount() {
-                return state().inputAmount;
+                return store.inputAmount();
               },
               get outputAmount() {
-                return state().outputAmount;
+                return outputAmount();
               },
               onNewSwap: handleNewSwap,
               onRetry: handleRetry,
@@ -9974,13 +9980,13 @@ function SwapComponent(props) {
       get children() {
         return createComponent(TransactionComplete, {
           get order() {
-            return state().order;
+            return store.order();
           },
           get fromToken() {
-            return state().fromToken;
+            return store.fromToken();
           },
           get toToken() {
-            return state().toToken;
+            return store.toToken();
           },
           onNewSwap: handleNewSwap,
           get apiEndpoint() {
@@ -10032,16 +10038,16 @@ function SwapComponent(props) {
     }), null);
     insert(_el$, createComponent(Show, {
       get when() {
-        return memo(() => !!recipientEditorOpen())() && state().toToken;
+        return memo(() => !!recipientEditorOpen())() && store.toToken();
       },
       get children() {
         var _el$4 = _tmpl$2$2();
         insert(_el$4, createComponent(RecipientEditor, {
           get initialValue() {
-            return state().recipient ?? "";
+            return store.recipient() ?? "";
           },
           get chainType() {
-            return getChainType(state().toToken.chainId);
+            return getChainType(store.toToken().chainId);
           },
           onConfirm: (addr) => {
             handleRecipientChange(addr);
@@ -10624,21 +10630,219 @@ function rankPayTokens(balances, targetSymbol, targetChainId, targetAddress, des
     if (!hasEnoughGasOnChain(t2.address, t2.chainId, nativeBalanceByChain)) {
       continue;
     }
-    const tier = getTier(
-      { symbol: t2.symbol, chainId: t2.chainId },
-      { symbol: targetSymbol, chainId: targetChainId }
-    );
-    candidates.push({
-      token: t2,
-      tier,
-      gasCostScore: getChainGasCostScore(t2.chainId)
+    const tier = getTier(
+      { symbol: t2.symbol, chainId: t2.chainId },
+      { symbol: targetSymbol, chainId: targetChainId }
+    );
+    candidates.push({
+      token: t2,
+      tier,
+      gasCostScore: getChainGasCostScore(t2.chainId)
+    });
+  }
+  candidates.sort((a, b) => {
+    if (a.tier !== b.tier) return a.tier - b.tier;
+    return a.gasCostScore - b.gasCostScore;
+  });
+  return candidates.map((c) => c.token);
+}
+function isSameToken$1(a, b) {
+  return a.chainId === b.chainId && a.address.toLowerCase() === b.address.toLowerCase();
+}
+function useReceiveExecution(params) {
+  const [trackingOrderId, setTrackingOrderId] = createSignal(
+    null
+  );
+  const [trackingProviderName, setTrackingProviderName] = createSignal(null);
+  const [trackingProviderIcon, setTrackingProviderIcon] = createSignal(null);
+  const [trackingInputAmount, setTrackingInputAmount] = createSignal(null);
+  const [executionError, setExecutionError] = createSignal(null);
+  const handleConfirm = async () => {
+    const selectedToken = params.selectedPayToken();
+    const selected2 = selectedToken ? params.payTokenQuotes().find((quote2) => isSameToken$1(quote2.token, selectedToken)) : null;
+    const addr = params.walletAddress();
+    if (!selected2 || !params.client() || !params.walletAdapter() || !addr)
+      return;
+    if (params.needRecipient() && !params.recipient()) {
+      params.setError("Recipient address is required for cross-chain swaps");
+      params.setErrorCode(ErrorCode.INVALID_CONFIG);
+      return;
+    }
+    const validBefore = selected2.route.quote.validBefore;
+    if (validBefore && Date.now() / 1e3 > validBefore) {
+      params.setLoadingQuotes(true);
+      try {
+        const target2 = params.targetToken();
+        if (!target2 || typeof target2.decimals !== "number") return;
+        const baseAmount = toBaseUnits(params.configAmount(), target2.decimals);
+        const refreshed = await params.fetchSingleQuote(
+          params.client(),
+          selected2.token,
+          baseAmount,
+          addr,
+          target2,
+          params.recipient()
+        );
+        if (refreshed) {
+          const updated = [...params.payTokenQuotes()];
+          const existingIdx = updated.findIndex(
+            (quote2) => isSameToken$1(quote2.token, selected2.token)
+          );
+          if (existingIdx >= 0) {
+            updated[existingIdx] = refreshed;
+          } else {
+            updated.push(refreshed);
+          }
+          params.setPayTokenQuotes(updated);
+        } else {
+          params.setError("Quote expired and could not be refreshed");
+          params.setErrorCode(ErrorCode.QUOTE_EXPIRED);
+          return;
+        }
+      } catch {
+        params.setError("Quote expired and could not be refreshed");
+        params.setErrorCode(ErrorCode.QUOTE_EXPIRED);
+        return;
+      } finally {
+        params.setLoadingQuotes(false);
+      }
+    }
+    const confirmedToken = params.selectedPayToken();
+    const confirmedQuote = confirmedToken ? params.payTokenQuotes().find((quote2) => isSameToken$1(quote2.token, confirmedToken)) : null;
+    if (!confirmedQuote) return;
+    params.setFromToken({
+      chainId: confirmedQuote.token.chainId,
+      address: confirmedQuote.token.address,
+      symbol: confirmedQuote.token.symbol,
+      name: confirmedQuote.token.name,
+      decimals: confirmedQuote.token.decimals,
+      logoURI: confirmedQuote.token.logoURI
+    });
+    setTrackingProviderName(confirmedQuote.route.routeId ?? null);
+    const apiBase = params.apiEndpoint() ?? DEFAULT_API_ENDPOINT;
+    setTrackingProviderIcon(
+      confirmedQuote.route.icon ? `${apiBase}${confirmedQuote.route.icon}` : null
+    );
+    setTrackingInputAmount(
+      toDisplayAmount(
+        confirmedQuote.route.quote.amountIn,
+        confirmedQuote.token.decimals
+      )
+    );
+    setExecutionError(null);
+    params.setExecPhase("building");
+    try {
+      const depositData = await params.client().buildDeposit({
+        from: addr,
+        quoteId: confirmedQuote.quoteId,
+        routeId: confirmedQuote.route.routeId
+      });
+      params.setExecPhase("awaiting-wallet");
+      let txHash;
+      let signedTransaction;
+      if (depositData.kind === "CONTRACT_CALL" && depositData.approvals) {
+        for (const approval of depositData.approvals) {
+          if (approval.type === "eip1193_request") {
+            const result = await params.walletAdapter().executeWalletAction({
+              type: "eip1193_request",
+              chainId: confirmedQuote.token.chainId,
+              method: approval.request.method,
+              params: approval.request.params
+            });
+            if (!result.success) {
+              throw new TokenFlightError(
+                ErrorCode.WALLET_ACTION_FAILED,
+                result.error ?? "Wallet action failed"
+              );
+            }
+            if (approval.deposit) txHash = result.txHash ?? txHash;
+          } else if (approval.type === "solana_sendTransaction") {
+            const result = await params.walletAdapter().executeWalletAction({
+              type: "solana_signTransaction",
+              transaction: approval.transaction
+            });
+            if (!result.success) {
+              throw new TokenFlightError(
+                ErrorCode.WALLET_ACTION_FAILED,
+                result.error ?? "Wallet action failed"
+              );
+            }
+            if (approval.deposit) {
+              signedTransaction = typeof result.data === "string" ? result.data : void 0;
+            }
+          }
+        }
+      }
+      if (!txHash && !signedTransaction) {
+        throw new TokenFlightError(
+          ErrorCode.TRANSACTION_FAILED,
+          "No deposit transaction received"
+        );
+      }
+      params.setExecPhase("submitting");
+      const submitResult = await params.client().submitDeposit(
+        signedTransaction ? {
+          quoteId: confirmedQuote.quoteId,
+          routeId: confirmedQuote.route.routeId,
+          signedTransaction
+        } : {
+          quoteId: confirmedQuote.quoteId,
+          routeId: confirmedQuote.route.routeId,
+          txHash
+        }
+      );
+      params.setExecPhase("tracking");
+      setTrackingOrderId(submitResult.orderId);
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : typeof err === "string" ? err : "Transaction failed";
+      setExecutionError(errorMsg);
+      if (err instanceof TokenFlightError) {
+        params.callbacks()?.onSwapError?.({
+          code: err.code,
+          message: err.message,
+          details: err.details
+        });
+      } else {
+        params.callbacks()?.onSwapError?.({
+          code: ErrorCode.TRANSACTION_FAILED,
+          message: String(err)
+        });
+      }
+    }
+  };
+  const handleRetry = () => {
+    batch(() => {
+      setExecutionError(null);
+      params.setExecPhase(null);
+      params.storeClearError();
+      params.setPayTokenQuotes([]);
     });
-  }
-  candidates.sort((a, b) => {
-    if (a.tier !== b.tier) return a.tier - b.tier;
-    return a.gasCostScore - b.gasCostScore;
-  });
-  return candidates.map((c) => c.token);
+    params.onRetry?.();
+  };
+  const handleNewSwap = () => {
+    batch(() => {
+      params.storeReset();
+      setTrackingOrderId(null);
+      setTrackingProviderName(null);
+      setTrackingProviderIcon(null);
+      setTrackingInputAmount(null);
+      setExecutionError(null);
+      params.setPayTokenQuotes([]);
+    });
+    queryClient.removeQueries({ queryKey: ["quote", params.client().baseUrl] });
+    queryClient.removeQueries({ queryKey: ["order", params.client().baseUrl] });
+    params.onReset?.();
+  };
+  return {
+    trackingOrderId,
+    trackingProviderName,
+    trackingProviderIcon,
+    trackingInputAmount,
+    executionError,
+    handleConfirm,
+    handleRetry,
+    handleNewSwap
+  };
 }
 const header = "tf-9b71d6";
 const section = "tf-4c9136";
@@ -10661,24 +10865,40 @@ const styles = {
   fiat
 };
 var _tmpl$$1 = /* @__PURE__ */ template(`<div data-testid=selector-overlay>`), _tmpl$2 = /* @__PURE__ */ template(`<div>`), _tmpl$3 = /* @__PURE__ */ template(`<div part=container><div part=accent-line data-testid=accent-line>`), _tmpl$4 = /* @__PURE__ */ template(`<img width=22 height=22>`), _tmpl$5 = /* @__PURE__ */ template(`<button part=wallet-info><div data-testid=wallet-dot></div><span data-testid=wallet-address>`), _tmpl$6 = /* @__PURE__ */ template(`<div part=header><div><span data-testid=header-title>`), _tmpl$7 = /* @__PURE__ */ template(`<button part=recipient-badge data-testid=recipient-badge><span>`), _tmpl$8 = /* @__PURE__ */ template(`<div><div data-testid=receive-section-label style=display:flex;justify-content:space-between;align-items:center><span></span></div><div part=target-token><div data-testid=receive-target-icon></div><span data-testid=receive-amount></span><span data-testid=receive-symbol></span><span>`), _tmpl$9 = /* @__PURE__ */ template(`<div style="padding:0 20px"><div>`), _tmpl$0 = /* @__PURE__ */ template(`<div part=price-preview data-testid=quote>`), _tmpl$1 = /* @__PURE__ */ template(`<div part=cta-wrapper>`), _tmpl$10 = /* @__PURE__ */ template(`<span>Flight`), _tmpl$11 = /* @__PURE__ */ template(`<div style="padding:0 20px"><div><div><div></div><div><div></div><div></div></div></div><div><div></div><div>`), _tmpl$12 = /* @__PURE__ */ template(`<div part=no-offer><div><svg width=28 height=28 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round><circle cx=11 cy=11 r=8></circle><path d="m21 21-4.35-4.35"></path><path d="M8 11h6"></path></svg></div><span>`);
+function normalizeTokenAddress(address) {
+  if (isNativeToken(address) && (address.startsWith("0x") || address.startsWith("0X"))) {
+    return "0x0000000000000000000000000000000000000000";
+  }
+  return address.toLowerCase();
+}
 function isSameToken(a, b) {
-  return a.chainId === b.chainId && a.address.toLowerCase() === b.address.toLowerCase();
+  return a.chainId === b.chainId && normalizeTokenAddress(a.address) === normalizeTokenAddress(b.address);
 }
 function ReceiveComponent(props) {
-  const sm = createReceiveStateMachine();
+  const store = createReceiveStore();
   const [selectedPayIndex, setSelectedPayIndex] = createSignal(0);
   const [payTokenSelectorOpen, setPayTokenSelectorOpen] = createSignal(false);
   const [selectorOpen, setSelectorOpen] = createSignal(false);
-  const [isConnected, setIsConnected] = createSignal(false);
-  const [walletAddress2, setWalletAddress] = createSignal(null);
   const [payTokenQuotes, setPayTokenQuotes] = createSignal([]);
   const [loadingQuotes, setLoadingQuotes] = createSignal(false);
-  const [trackingOrderId, setTrackingOrderId] = createSignal(null);
-  const [trackingProviderName, setTrackingProviderName] = createSignal(null);
-  const [trackingProviderIcon, setTrackingProviderIcon] = createSignal(null);
-  const [trackingInputAmount, setTrackingInputAmount] = createSignal(null);
-  const [executionError, setExecutionError] = createSignal(null);
   const [selectedPayToken, setSelectedPayToken] = createSignal(null);
+  const {
+    isConnected,
+    walletAddress: walletAddress2,
+    handleConnect
+  } = useWalletConnection({
+    walletAdapter: () => props.walletAdapter,
+    callbacks: () => props.callbacks,
+    onAddressChange: (addr) => store.setWalletAddress(addr),
+    onDisconnect: () => {
+      setPayTokenQuotes([]);
+      setSelectedPayToken(null);
+    },
+    onConnectError: (msg, code) => {
+      store.setError(msg);
+      store.setErrorCode(code);
+    }
+  });
   const client = createMemo(() => {
     const endpoint = props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
     return new HyperstreamApi({
@@ -10686,79 +10906,35 @@ function ReceiveComponent(props) {
     });
   });
   const apiBase = () => client().baseUrl;
-  const targetToken = createMemo(() => sm.state().targetToken);
-  const phase = createMemo(() => sm.state().phase);
+  const phase = createMemo(() => deriveReceivePhase(store.execPhase(), store.error(), loadingQuotes(), payTokenQuotes().length));
+  const isExecuting = createMemo(() => {
+    const p = phase();
+    return p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking";
+  });
   const [recipientEditorOpen, setRecipientEditorOpen] = createSignal(false);
-  const recipientR = createMemo(() => sm.state().recipient);
   const recipientLocked = createMemo(() => !!props.config.recipient);
-  const needRecipient = createMemo(() => {
-    const target2 = targetToken();
-    const from = selectedPayToken();
-    if (!target2 || !from || !isConnected()) return false;
-    return isCrossChainSwap(from.chainId, target2.chainId);
-  });
-  const recipientDisplay = createMemo(() => {
-    const r = recipientR();
-    if (r) return r;
-    if (isConnected() && walletAddress2() && !needRecipient()) return walletAddress2();
-    return null;
+  const {
+    needRecipient,
+    recipientDisplay,
+    handleRecipientChange
+  } = useRecipient({
+    fromToken: selectedPayToken,
+    toToken: store.targetToken,
+    recipient: store.recipient,
+    isConnected,
+    walletAddress: walletAddress2,
+    walletAdapter: () => props.walletAdapter,
+    setRecipient: store.setRecipient
   });
-  const handleRecipientChange = (value2) => {
-    const trimmed = value2.trim() || null;
-    sm.setRecipient(trimmed);
-  };
   const balancesQuery = createTokenBalancesQuery(client, walletAddress2, () => isConnected() && !!walletAddress2(), () => props.walletAdapter?.supportedChainIds);
-  const orderQuery = createOrderQuery(client, walletAddress2, trackingOrderId, () => phase() === "tracking" && !!trackingOrderId());
-  createEffect(on(() => orderQuery.data, (order) => {
-    if (!order || phase() !== "tracking") return;
-    sm.setOrder(order);
-    if (order.status === "failed" || order.status === "refunded") {
-      queryClient.invalidateQueries({
-        queryKey: ["tokenBalances", client().baseUrl]
-      });
-      props.callbacks?.onSwapError?.({
-        code: ErrorCode.ORDER_FAILED,
-        message: "Order " + order.status
-      });
-      return;
-    }
-    if (order.status === "filled") {
-      sm.transition("success");
-      queryClient.invalidateQueries({
-        queryKey: ["tokenBalances", client().baseUrl]
-      });
-      const selected2 = selectedPayToken();
-      props.callbacks?.onSwapSuccess?.({
-        orderId: order.id,
-        fromToken: selected2?.symbol ?? "",
-        toToken: sm.state().targetToken?.symbol ?? "",
-        fromAmount: order.srcAmount,
-        toAmount: order.destAmount,
-        txHash: order.depositTxHash
-      });
-    }
-  }));
   onMount(() => {
     if (props.config.locale) {
       setLocale(props.config.locale);
     }
     if (props.config.recipient) {
-      sm.setRecipient(props.config.recipient);
+      store.setRecipient(props.config.recipient);
     }
   });
-  createEffect(on(needRecipient, (need) => {
-    if (need && !sm.state().recipient && props.walletAdapter) {
-      const target2 = sm.state().targetToken;
-      if (!target2) return;
-      const targetChainType = getChainType(target2.chainId);
-      props.walletAdapter.getAddress(targetChainType).then((addr) => {
-        if (addr && isAddressForChainType(addr, targetChainType) && !sm.state().recipient && needRecipient()) {
-          sm.setRecipient(addr);
-        }
-      }).catch(() => {
-      });
-    }
-  }));
   const chainsQuery = createChainsQuery(client, () => true);
   const chainMap = createMemo(() => {
     const data = chainsQuery.data;
@@ -10768,18 +10944,20 @@ function ReceiveComponent(props) {
     const c = client();
     const amount2 = Number(props.config.amount);
     if (!Number.isFinite(amount2) || amount2 <= 0) {
-      sm.setError("Invalid amount: must be greater than zero", ErrorCode.INVALID_AMOUNT);
+      store.setError("Invalid amount: must be greater than zero");
+      store.setErrorCode(ErrorCode.INVALID_AMOUNT);
       return;
     }
     try {
       const target2 = parseTokenIdentifier(props.config.target);
       const resolved = await resolveToken(target2.chainId, target2.address, props.config.apiEndpoint, c);
       if (typeof resolved.decimals !== "number") {
-        sm.setError("Failed to resolve target token metadata", ErrorCode.INVALID_CONFIG);
+        store.setError("Failed to resolve target token metadata");
+        store.setErrorCode(ErrorCode.INVALID_CONFIG);
         return;
       }
-      sm.setTargetToken(resolved);
-      sm.setTargetAmount(props.config.amount);
+      store.setTargetToken(resolved);
+      store.setTargetAmount(props.config.amount);
       if (props.config.fromToken) {
         try {
           const fromTarget = parseTokenIdentifier(props.config.fromToken);
@@ -10809,60 +10987,13 @@ function ReceiveComponent(props) {
         }
       }
     } catch (err) {
-      sm.setError(err instanceof Error ? err.message : "Failed to resolve target token", ErrorCode.INVALID_CONFIG);
-    }
-  });
-  const detectChainType = () => {
-    if (!props.walletAdapter) return "evm";
-    return props.walletAdapter.supportedActionTypes.some((t2) => t2.startsWith("solana_")) ? "solana" : "evm";
-  };
-  onMount(async () => {
-    if (props.walletAdapter) {
-      const connected = props.walletAdapter.isConnected();
-      setIsConnected(connected);
-      if (connected) {
-        const addr = await props.walletAdapter.getAddress();
-        setWalletAddress(addr);
-        sm.setWalletAddress(addr);
-        props.callbacks?.onWalletConnected?.({
-          address: addr ?? "",
-          chainType: detectChainType()
-        });
-      }
-      const handleWalletConnect = async () => {
-        const addr = await props.walletAdapter.getAddress();
-        if (isConnected() && walletAddress2() === addr) return;
-        batch(() => {
-          setIsConnected(true);
-          setWalletAddress(addr);
-          sm.setWalletAddress(addr);
-        });
-        props.callbacks?.onWalletConnected?.({
-          address: addr ?? "",
-          chainType: detectChainType()
-        });
-      };
-      const handleWalletDisconnect = () => {
-        if (!isConnected()) return;
-        batch(() => {
-          setIsConnected(false);
-          setWalletAddress(null);
-          sm.setWalletAddress(null);
-        });
-        setPayTokenQuotes([]);
-        setSelectedPayToken(null);
-      };
-      props.walletAdapter.on("connect", handleWalletConnect);
-      props.walletAdapter.on("disconnect", handleWalletDisconnect);
-      onCleanup(() => {
-        props.walletAdapter.off("connect", handleWalletConnect);
-        props.walletAdapter.off("disconnect", handleWalletDisconnect);
-      });
+      store.setError(err instanceof Error ? err.message : "Failed to resolve target token");
+      store.setErrorCode(ErrorCode.INVALID_CONFIG);
     }
   });
   const balancePayTokens = createMemo(() => {
     const data = balancesQuery.data;
-    const target2 = targetToken();
+    const target2 = store.targetToken();
     if (!data || data.length === 0 || !target2) return [];
     const supported = props.walletAdapter?.supportedChainIds;
     const filtered = supported?.length ? data.filter((t2) => supported.includes(t2.chainId)) : data;
@@ -10872,17 +11003,26 @@ function ReceiveComponent(props) {
     return rankPayTokens(filtered, target2.symbol ?? "", target2.chainId, target2.address, desiredUsdAmount > 0 ? desiredUsdAmount : void 0);
   });
   createEffect(on(balancePayTokens, (tokens) => {
-    const p = sm.state().phase;
+    const p = phase();
     if (tokens.length > 0 && (p === "idle" || p === "error")) {
       fetchPayTokenQuotes(tokens);
     }
   }));
+  createEffect(on(() => store.recipient(), () => {
+    const tokens = balancePayTokens();
+    const p = phase();
+    if (tokens.length > 0 && (p === "idle" || p === "quoted" || p === "error")) {
+      fetchPayTokenQuotes(tokens);
+    }
+  }, {
+    defer: true
+  }));
   const selectedQuoteRequest = createMemo(() => {
     const token = selectedPayToken();
     if (!token) return null;
-    const target2 = targetToken();
+    const target2 = store.targetToken();
     const addr = walletAddress2();
-    const recipient = sm.state().recipient;
+    const recipient = store.recipient();
     if (!target2 || typeof target2.decimals !== "number" || !addr) return null;
     if (needRecipient() && !recipient) return null;
     return {
@@ -10925,25 +11065,15 @@ function ReceiveComponent(props) {
       }
     }
   }));
-  const [countdownSeconds, setCountdownSeconds] = createSignal(QUOTE_REFRESH_SECONDS);
-  createEffect(() => {
-    if (phase() !== "quoted") {
-      setCountdownSeconds(QUOTE_REFRESH_SECONDS);
-      return;
+  const {
+    countdownSeconds
+  } = useQuoteCountdown({
+    phase,
+    onExpired: () => {
+      selectedQuoteQuery.refetch();
     }
-    setCountdownSeconds(QUOTE_REFRESH_SECONDS);
-    const timer = setInterval(() => {
-      setCountdownSeconds((prev) => {
-        if (prev <= 1) {
-          selectedQuoteQuery.refetch();
-          return QUOTE_REFRESH_SECONDS;
-        }
-        return prev - 1;
-      });
-    }, 1e3);
-    onCleanup(() => clearInterval(timer));
   });
-  const fetchSingleQuote = async (c, payToken, baseAmount, addr, target2, recipient) => {
+  const fetchSingleQuote = async (c, payToken, baseAmount, addr, target2, recipient, signal) => {
     try {
       const request = {
         tradeType: "EXACT_OUTPUT",
@@ -10957,9 +11087,11 @@ function ReceiveComponent(props) {
           recipient
         }
       };
-      const quoteResp = await queryClient.ensureQueryData({
+      const quoteResp = await queryClient.fetchQuery({
         queryKey: ["quote", c.baseUrl, request],
-        queryFn: () => c.getQuotes(request),
+        queryFn: ({
+          signal: querySignal
+        }) => c.getQuotes(request, signal ?? querySignal),
         staleTime: 15e3
       });
       if (quoteResp.routes.length > 0) {
@@ -10982,13 +11114,10 @@ function ReceiveComponent(props) {
   const fetchPayTokenQuotes = async (tokensToQuote) => {
     const c = client();
     const addr = walletAddress2();
-    const target2 = sm.state().targetToken;
+    const target2 = store.targetToken();
     if (!c || !addr || !target2 || typeof target2.decimals !== "number" || tokensToQuote.length === 0) return;
-    const phase2 = sm.state().phase;
-    if (phase2 === "idle" || phase2 === "quoted" || phase2 === "error") {
-      if (phase2 === "error") sm.transition("idle");
-      sm.transition("quoting");
-    }
+    if (payTokenQuotes().length > 0) setPayTokenQuotes([]);
+    if (store.error()) store.clearError();
     setLoadingQuotes(true);
     fetchAbortController?.abort();
     const abortController = new AbortController();
@@ -11000,7 +11129,7 @@ function ReceiveComponent(props) {
       const orderedTokens = preferredToken ? [preferredToken, ...tokensToQuote.filter((token) => !isSameToken(token, preferredToken))] : tokensToQuote;
       for (const payToken of orderedTokens) {
         if (abortController.signal.aborted) return;
-        const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, sm.state().recipient);
+        const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, store.recipient(), abortController.signal);
         if (abortController.signal.aborted) return;
         if (quote2) {
           setPayTokenQuotes([quote2]);
@@ -11008,18 +11137,13 @@ function ReceiveComponent(props) {
           setSelectedPayIndex(index >= 0 ? index : 0);
           setSelectedPayToken(payToken);
           setLoadingQuotes(false);
-          sm.transition("quoted");
           return;
         }
       }
       if (!abortController.signal.aborted) {
         setPayTokenQuotes([]);
-        sm.transition("idle");
       }
     } catch {
-      if (!abortController.signal.aborted) {
-        sm.transition("idle");
-      }
     } finally {
       setLoadingQuotes(false);
     }
@@ -11030,7 +11154,7 @@ function ReceiveComponent(props) {
   const paymentTokens = createMemo(() => {
     const tokens = balancePayTokens();
     const quotes = payTokenQuotes();
-    const target2 = targetToken();
+    const target2 = store.targetToken();
     const chains = chainMap();
     if (tokens.length === 0 || !target2) return [];
     const quoteMap = /* @__PURE__ */ new Map();
@@ -11110,13 +11234,81 @@ function ReceiveComponent(props) {
       logoURI: q.token.logoURI
     };
   });
+  const {
+    trackingOrderId,
+    trackingProviderName,
+    trackingProviderIcon,
+    trackingInputAmount,
+    executionError,
+    handleConfirm,
+    handleRetry,
+    handleNewSwap
+  } = useReceiveExecution({
+    client,
+    walletAdapter: () => props.walletAdapter,
+    callbacks: () => props.callbacks,
+    apiEndpoint: () => props.config.apiEndpoint,
+    recipient: store.recipient,
+    needRecipient,
+    walletAddress: walletAddress2,
+    targetToken: store.targetToken,
+    selectedPayToken,
+    payTokenQuotes,
+    setPayTokenQuotes,
+    setLoadingQuotes,
+    fetchSingleQuote,
+    configAmount: () => props.config.amount,
+    setExecPhase: store.setExecPhase,
+    setFromToken: store.setFromToken,
+    setError: store.setError,
+    setErrorCode: store.setErrorCode,
+    storeReset: store.reset,
+    storeClearError: store.clearError,
+    onRetry: () => {
+      setSelectedPayToken(null);
+      const tokens = balancePayTokens();
+      if (tokens.length > 0) fetchPayTokenQuotes(tokens);
+    },
+    onReset: () => {
+      setSelectedPayIndex(0);
+      setSelectedPayToken(null);
+      const tokens = balancePayTokens();
+      if (tokens.length > 0) fetchPayTokenQuotes(tokens);
+    }
+  });
+  useOrderTracking({
+    client,
+    walletAddress: walletAddress2,
+    trackingOrderId,
+    phase,
+    execPhase: store.execPhase,
+    setOrder: store.setOrder,
+    setExecPhase: store.setExecPhase,
+    onOrderFilled: (order) => {
+      const selected2 = selectedPayToken();
+      props.callbacks?.onSwapSuccess?.({
+        orderId: order.id,
+        fromToken: selected2?.symbol ?? "",
+        toToken: store.targetToken()?.symbol ?? "",
+        fromAmount: order.srcAmount,
+        toAmount: order.destAmount,
+        txHash: order.depositTxHash
+      });
+    },
+    onOrderFailed: (order) => {
+      props.callbacks?.onSwapError?.({
+        code: ErrorCode.ORDER_FAILED,
+        message: "Order " + order.status
+      });
+    }
+  });
   const refreshSinglePayTokenQuote = async (payToken) => {
     const c = client();
     const addr = walletAddress2();
-    const target2 = sm.state().targetToken;
+    const target2 = store.targetToken();
     if (!c || !addr || !target2 || typeof target2.decimals !== "number") return;
     const baseAmount = toBaseUnits(props.config.amount, target2.decimals);
-    const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, sm.state().recipient);
+    const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, store.recipient());
     if (quote2) {
       const existing = payTokenQuotes();
       const updated = [...existing];
@@ -11127,10 +11319,6 @@ function ReceiveComponent(props) {
         updated.push(quote2);
       }
       setPayTokenQuotes(updated);
-      if (sm.state().phase === "idle" || sm.state().phase === "quoting") {
-        if (sm.state().phase === "idle") sm.transition("quoting");
-        sm.transition("quoted");
-      }
     }
   };
   const handlePayTokenSelect = (index) => {
@@ -11143,24 +11331,12 @@ function ReceiveComponent(props) {
       void refreshSinglePayTokenQuote(payToken);
     }
   };
-  const handleConnect = async () => {
-    if (!props.walletAdapter) {
-      console.warn("[TokenFlight] No wallet adapter configured. Pass a walletAdapter to enable wallet connection.\nSee: https://embed.tokenflight.ai/guides/wallet-adapter/");
-      props.callbacks?.onConnectWallet?.();
-      return;
-    }
-    try {
-      await props.walletAdapter.connect();
-    } catch {
-      sm.setError("Failed to connect wallet", ErrorCode.WALLET_CONNECTION_FAILED);
-    }
-  };
   const handleTokenSelect = async (token) => {
     setSelectorOpen(false);
     setPayTokenSelectorOpen(false);
     const c = client();
     const addr = walletAddress2();
-    const target2 = sm.state().targetToken;
+    const target2 = store.targetToken();
     if (!c || !addr || !target2 || typeof target2.decimals !== "number" || !token.address || typeof token.decimals !== "number") return;
     setLoadingQuotes(true);
     try {
@@ -11176,7 +11352,7 @@ function ReceiveComponent(props) {
           balance: toBaseUnits(token.balance, token.decimals)
         } : void 0
       };
-      const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, sm.state().recipient);
+      const quote2 = await fetchSingleQuote(c, payToken, baseAmount, addr, target2, store.recipient());
       if (quote2) {
         const existing = payTokenQuotes();
         const idx = existing.findIndex((q) => q.token.address.toLowerCase() === token.address.toLowerCase() && q.token.chainId === token.chainId);
@@ -11193,165 +11369,12 @@ function ReceiveComponent(props) {
         if (rankedIndex >= 0) {
           setSelectedPayIndex(rankedIndex);
         }
-        if (sm.state().phase === "idle" || sm.state().phase === "quoting") {
-          if (sm.state().phase === "idle") sm.transition("quoting");
-          sm.transition("quoted");
-        }
       }
     } catch {
     } finally {
       setLoadingQuotes(false);
     }
   };
-  const handleConfirm = async () => {
-    const selectedToken = selectedPayToken();
-    const selected2 = selectedToken ? payTokenQuotes().find((quote2) => isSameToken(quote2.token, selectedToken)) : null;
-    const addr = walletAddress2();
-    if (!selected2 || !client() || !props.walletAdapter || !addr) return;
-    if (needRecipient() && !sm.state().recipient) {
-      sm.setError("Recipient address is required for cross-chain swaps", ErrorCode.INVALID_CONFIG);
-      return;
-    }
-    const validBefore = selected2.route.quote.validBefore;
-    if (validBefore && Date.now() / 1e3 > validBefore) {
-      setLoadingQuotes(true);
-      try {
-        const target2 = sm.state().targetToken;
-        if (!target2 || typeof target2.decimals !== "number") return;
-        const baseAmount = toBaseUnits(props.config.amount, target2.decimals);
-        const refreshed = await fetchSingleQuote(client(), selected2.token, baseAmount, addr, target2, sm.state().recipient);
-        if (refreshed) {
-          const updated = [...payTokenQuotes()];
-          const existingIdx = updated.findIndex((quote2) => isSameToken(quote2.token, selected2.token));
-          if (existingIdx >= 0) {
-            updated[existingIdx] = refreshed;
-          } else {
-            updated.push(refreshed);
-          }
-          setPayTokenQuotes(updated);
-        } else {
-          sm.setError("Quote expired and could not be refreshed", ErrorCode.QUOTE_EXPIRED);
-          return;
-        }
-      } catch {
-        sm.setError("Quote expired and could not be refreshed", ErrorCode.QUOTE_EXPIRED);
-        return;
-      } finally {
-        setLoadingQuotes(false);
-      }
-    }
-    const confirmedToken = selectedPayToken();
-    const confirmedQuote = confirmedToken ? payTokenQuotes().find((quote2) => isSameToken(quote2.token, confirmedToken)) : null;
-    if (!confirmedQuote) return;
-    sm.setFromToken({
-      chainId: confirmedQuote.token.chainId,
-      address: confirmedQuote.token.address,
-      symbol: confirmedQuote.token.symbol,
-      name: confirmedQuote.token.name,
-      decimals: confirmedQuote.token.decimals,
-      logoURI: confirmedQuote.token.logoURI
-    });
-    setTrackingProviderName(confirmedQuote.route.routeId ?? null);
-    const apiBase2 = props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
-    setTrackingProviderIcon(confirmedQuote.route.icon ? `${apiBase2}${confirmedQuote.route.icon}` : null);
-    setTrackingInputAmount(toDisplayAmount(confirmedQuote.route.quote.amountIn, confirmedQuote.token.decimals));
-    setExecutionError(null);
-    sm.transition("building");
-    try {
-      const depositData = await client().buildDeposit({
-        from: addr,
-        quoteId: confirmedQuote.quoteId,
-        routeId: confirmedQuote.route.routeId
-      });
-      sm.transition("awaiting-wallet");
-      let txHash;
-      if (depositData.kind === "CONTRACT_CALL" && depositData.approvals) {
-        for (const approval of depositData.approvals) {
-          if (approval.type === "eip1193_request") {
-            const result = await props.walletAdapter.executeWalletAction({
-              type: "eip1193_request",
-              chainId: confirmedQuote.token.chainId,
-              method: approval.request.method,
-              params: approval.request.params
-            });
-            if (!result.success) {
-              throw new TokenFlightError(ErrorCode.WALLET_ACTION_FAILED, result.error ?? "Wallet action failed");
-            }
-            if (approval.deposit) txHash = result.txHash ?? txHash;
-          } else if (approval.type === "solana_sendTransaction") {
-            const result = await props.walletAdapter.executeWalletAction({
-              type: "solana_signAndSendTransaction",
-              transaction: approval.transaction
-            });
-            if (!result.success) {
-              throw new TokenFlightError(ErrorCode.WALLET_ACTION_FAILED, result.error ?? "Wallet action failed");
-            }
-            if (approval.deposit) txHash = result.txHash ?? txHash;
-          }
-        }
-      }
-      if (!txHash) {
-        throw new TokenFlightError(ErrorCode.TRANSACTION_FAILED, "No deposit transaction hash received");
-      }
-      sm.transition("submitting");
-      const submitResult = await client().submitDeposit({
-        quoteId: confirmedQuote.quoteId,
-        routeId: confirmedQuote.route.routeId,
-        txHash
-      });
-      sm.transition("tracking");
-      setTrackingOrderId(submitResult.orderId);
-    } catch (err) {
-      const errorMsg = err instanceof Error ? err.message : typeof err === "string" ? err : "Transaction failed";
-      setExecutionError(errorMsg);
-      if (err instanceof TokenFlightError) {
-        props.callbacks?.onSwapError?.({
-          code: err.code,
-          message: err.message,
-          details: err.details
-        });
-      } else {
-        props.callbacks?.onSwapError?.({
-          code: ErrorCode.TRANSACTION_FAILED,
-          message: String(err)
-        });
-      }
-    }
-  };
-  const handleRetry = () => {
-    setExecutionError(null);
-    setSelectedPayToken(null);
-    sm.transition("idle");
-    const tokens = balancePayTokens();
-    if (tokens.length > 0) {
-      fetchPayTokenQuotes(tokens);
-    }
-  };
-  const handleNewSwap = () => {
-    sm.clearRoutes();
-    sm.setPaymentAmount("");
-    sm.setFromToken(null);
-    sm.setOrder(null);
-    setSelectedPayIndex(0);
-    setSelectedPayToken(null);
-    setTrackingOrderId(null);
-    setTrackingProviderName(null);
-    setTrackingProviderIcon(null);
-    setTrackingInputAmount(null);
-    setExecutionError(null);
-    setPayTokenQuotes([]);
-    queryClient.removeQueries({
-      queryKey: ["quote", client().baseUrl]
-    });
-    queryClient.removeQueries({
-      queryKey: ["order", client().baseUrl]
-    });
-    sm.transition("idle");
-    const tokens = balancePayTokens();
-    if (tokens.length > 0) {
-      fetchPayTokenQuotes(tokens);
-    }
-  };
   const handleAccountClick = async () => {
     if (props.walletAdapter?.openAccountModal) {
       await props.walletAdapter.openAccountModal();
@@ -11360,13 +11383,8 @@ function ReceiveComponent(props) {
     }
   };
   const truncateAddress = (addr) => `${addr.slice(0, 6)}...${addr.slice(-4)}`;
-  const state = sm.state;
-  const isExecuting = () => {
-    const p = phase();
-    return p === "building" || p === "awaiting-wallet" || p === "submitting" || p === "tracking";
-  };
-  const targetSymbol = () => state().targetToken?.symbol ?? "USDC";
-  const targetAmount = () => state().targetAmount || props.config.amount;
+  const targetSymbol = () => store.targetToken()?.symbol ?? "USDC";
+  const targetAmount = () => store.targetAmount() || props.config.amount;
   const titleText = createMemo(() => {
     const raw = props.config.titleText?.trim();
     return raw && raw.length > 0 ? raw : "TokenFlight";
@@ -11383,7 +11401,7 @@ function ReceiveComponent(props) {
     var _el$ = _tmpl$3(), _el$2 = _el$.firstChild;
     insert(_el$, createComponent(Show, {
       get when() {
-        return memo(() => state().phase === "success")() && state().order;
+        return memo(() => phase() === "success")() && store.order();
       },
       get fallback() {
         return createComponent(Show, {
@@ -11516,19 +11534,19 @@ function ReceiveComponent(props) {
                 color: "#0052FF",
                 size: 32,
                 get logoURI() {
-                  return state().targetToken?.logoURI;
+                  return store.targetToken()?.logoURI;
                 }
               }), null);
               insert(_el$16, createComponent(Show, {
                 get when() {
-                  return state().targetToken?.chainId;
+                  return store.targetToken()?.chainId;
                 },
                 get children() {
                   var _el$17 = _tmpl$2();
                   insert(_el$17, createComponent(ChainDot, {
                     size: 12,
                     get iconUrl() {
-                      return chainIconUrl(apiBase(), state().targetToken.chainId);
+                      return chainIconUrl(apiBase(), store.targetToken().chainId);
                     }
                   }));
                   createRenderEffect(() => className(_el$17, styles.targetChainDot));
@@ -11631,7 +11649,7 @@ function ReceiveComponent(props) {
               }
             }), createComponent(Show, {
               get when() {
-                return memo(() => !!(selectedQuoteRoute() && selectedFromToken()))() && state().targetToken;
+                return memo(() => !!(selectedQuoteRoute() && selectedFromToken()))() && store.targetToken();
               },
               get fallback() {
                 return createComponent(Show, {
@@ -11666,7 +11684,7 @@ function ReceiveComponent(props) {
                     return selectedFromToken();
                   },
                   get toToken() {
-                    return state().targetToken;
+                    return store.targetToken();
                   },
                   inline: true,
                   countdownSeconds,
@@ -11680,7 +11698,7 @@ function ReceiveComponent(props) {
               var _el$24 = _tmpl$1();
               insert(_el$24, createComponent(ActionButton, {
                 get phase() {
-                  return state().phase;
+                  return phase();
                 },
                 get isConnected() {
                   return isConnected();
@@ -11692,7 +11710,7 @@ function ReceiveComponent(props) {
                 onConfirm: handleConfirm,
                 onRetry: handleRetry,
                 get needsRecipient() {
-                  return memo(() => !!needRecipient())() && !sm.state().recipient;
+                  return memo(() => !!needRecipient())() && !store.recipient();
                 },
                 onEnterRecipient: () => setRecipientEditorOpen(true),
                 get label() {
@@ -11709,13 +11727,13 @@ function ReceiveComponent(props) {
           get children() {
             return createComponent(OrderProgress, {
               get order() {
-                return state().order;
+                return store.order();
               },
               get fromToken() {
-                return state().fromToken;
+                return store.fromToken();
               },
               get toToken() {
-                return state().targetToken;
+                return store.targetToken();
               },
               get providerName() {
                 return trackingProviderName();
@@ -11727,10 +11745,10 @@ function ReceiveComponent(props) {
                 return props.config.apiEndpoint ?? DEFAULT_API_ENDPOINT;
               },
               get inputAmount() {
-                return trackingInputAmount() ?? state().paymentAmount;
+                return trackingInputAmount() ?? "";
               },
               get outputAmount() {
-                return state().targetAmount;
+                return store.targetAmount();
               },
               onNewSwap: handleNewSwap,
               mode: "receive",
@@ -11751,13 +11769,13 @@ function ReceiveComponent(props) {
       get children() {
         return createComponent(TransactionComplete, {
           get order() {
-            return state().order;
+            return store.order();
           },
           get fromToken() {
-            return state().fromToken;
+            return store.fromToken();
           },
           get toToken() {
-            return state().targetToken;
+            return store.targetToken();
           },
           onNewSwap: handleNewSwap,
           get apiEndpoint() {
@@ -11807,16 +11825,16 @@ function ReceiveComponent(props) {
     }), null);
     insert(_el$, createComponent(Show, {
       get when() {
-        return memo(() => !!recipientEditorOpen())() && sm.state().targetToken;
+        return memo(() => !!recipientEditorOpen())() && store.targetToken();
       },
       get children() {
         var _el$4 = _tmpl$2();
         insert(_el$4, createComponent(RecipientEditor, {
           get initialValue() {
-            return sm.state().recipient ?? "";
+            return store.recipient() ?? "";
           },
           get chainType() {
-            return getChainType(sm.state().targetToken.chainId);
+            return getChainType(store.targetToken().chainId);
           },
           onConfirm: (addr) => {
             handleRecipientChange(addr);
@@ -11840,22 +11858,22 @@ function ReceiveComponent(props) {
     return _el$;
   })();
 }
-const css0 = ".tf-2de115{width:100%;padding:14px 0;border-radius:14px;border:none;background:linear-gradient(135deg,var(--tf-primary),color-mix(in srgb,var(--tf-primary) 80%,#000));color:var(--tf-text-on-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;box-shadow:0 4px 16px var(--tf-primary-glow);letter-spacing:-.01em;font-family:DM Sans,sans-serif;transition:transform .15s ease,opacity .15s ease,box-shadow .15s ease}.tf-2de115:hover{opacity:.95;transform:translateY(-1px);box-shadow:0 6px 20px var(--tf-primary-glow)}.tf-2de115:active{transform:translateY(0)}.tf-47dc2a{background:var(--tf-primary);cursor:wait;opacity:.85}.tf-44b8f1{width:100%;padding:14px 0;border-radius:14px;border:1px solid var(--tf-primary);background:var(--tf-primary-light);color:var(--tf-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;font-family:DM Sans,sans-serif;transition:transform .15s ease,background .15s ease}.tf-44b8f1:hover{transform:translateY(-1px)}.tf-44b8f1:active{transform:translateY(0)}.tf-04fe16{width:100%;padding:14px 0;border-radius:14px;border:1.5px dashed var(--tf-primary);background:var(--tf-primary-light);color:var(--tf-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;font-family:DM Sans,sans-serif;transition:transform .15s ease,background .15s ease;animation:tf-d53743 2s ease-in-out infinite}.tf-04fe16:hover{transform:translateY(-1px);background:var(--tf-primary-glow)}.tf-04fe16:active{transform:translateY(0)}.tf-65cf23{width:100%;padding:14px 0;border-radius:14px;text-align:center;background:var(--tf-success-bg);color:var(--tf-success);font-weight:600;font-size:var(--tf-font-xl);display:flex;align-items:center;justify-content:center;gap:8px;border:none}.tf-2f0314{width:100%;padding:14px 0;border-radius:14px;text-align:center;background:var(--tf-error-bg);color:var(--tf-error);font-weight:600;font-size:var(--tf-font-xl);display:flex;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer}.tf-20b1ac{display:flex;align-items:center;justify-content:center;gap:8px}.tf-e6dae0{display:inline-block;width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.3);border-top-color:var(--tf-text-on-primary, #fff);animation:tf-8a3bc2 .8s linear infinite}.tf-90e712{width:14px;height:14px}";
-const css1$1 = ".tf-59b76a{font-size:var(--tf-font-amount);font-weight:700;line-height:100%;letter-spacing:-.02em;color:var(--tf-text);font-family:DM Sans,sans-serif;background:none;border:none;outline:none;width:100%;min-width:0;text-align:left}.tf-59b76a::-webkit-outer-spin-button,.tf-59b76a::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.tf-59b76a{-moz-appearance:textfield}.tf-59b76a::placeholder{color:var(--tf-text-tertiary)}.tf-a859d8{color:var(--tf-text-tertiary)}";
-const css1 = '@keyframes tf-d36961{to{transform:rotate(360deg)}}.tf-5835df{padding:24px 20px 16px;animation:tf-e061c9 .3s ease both}.tf-9322ae{display:flex;align-items:center;justify-content:center;gap:12px;padding-bottom:20px;margin-bottom:4px;border-bottom:1px solid var(--tf-border-light)}.tf-7d5519{display:flex;align-items:center;gap:8px}.tf-7e8fdf{position:relative;width:32px;height:32px;flex-shrink:0}.tf-37f3cf{position:absolute;bottom:-2px;right:-2px;width:16px;height:16px;border-radius:50%;background:var(--tf-bg);display:flex;align-items:center;justify-content:center;border:1.5px solid var(--tf-bg)}.tf-9401fd{display:flex;flex-direction:column}.tf-832fae{font-family:JetBrains Mono,monospace;font-weight:600;font-size:var(--tf-font-lg);color:var(--tf-text);white-space:nowrap;line-height:1.2}.tf-b557fc{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-weight:500;line-height:1.2}.tf-5953e8{color:var(--tf-text-tertiary);flex-shrink:0}.tf-a168c7{display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);padding-bottom:16px}.tf-062404{width:16px;height:16px;border-radius:4px;object-fit:contain}.tf-26af4c{display:flex;flex-direction:column}.tf-4b9be7{display:flex;gap:12px}.tf-036db2{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:var(--tf-font-base);font-weight:600;z-index:1}.tf-09b7bb{background:var(--tf-success-bg);color:var(--tf-success)}.tf-aef7e0{background:var(--tf-primary-light)}.tf-5c628c{background:var(--tf-input-bg);color:var(--tf-text-tertiary);border:1px solid var(--tf-border-light)}.tf-a5abdf{background:var(--tf-error-bg);color:var(--tf-error)}.tf-9efe7c{width:14px;height:14px;border-radius:50%;border:2px solid var(--tf-primary-light);border-top-color:var(--tf-primary);animation:tf-d36961 .8s linear infinite}.tf-5c7806{border-color:#ff475733;border-top-color:var(--tf-error)}.tf-185719{flex:1;padding-bottom:20px;position:relative}.tf-185719:before{content:"";position:absolute;left:-26px;top:28px;bottom:0;width:2px;background:var(--tf-border-light)}.tf-4b9be7:last-child .tf-185719:before{display:none}.tf-4b9be7:last-child .tf-185719{padding-bottom:4px}.tf-84527b .tf-185719:before{background:var(--tf-success)}.tf-417d35 .tf-185719:before{background:var(--tf-error)}.tf-aad7e9{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-text);line-height:28px}.tf-8de1c6 .tf-aad7e9{color:var(--tf-text-tertiary)}.tf-417d35 .tf-aad7e9{color:var(--tf-error)}.tf-bcb46a{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);margin-top:2px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.tf-16cfdc .tf-bcb46a{color:var(--tf-primary)}.tf-0aa291{font-size:var(--tf-font-sm);color:var(--tf-primary);text-decoration:none;display:inline-flex;align-items:center;gap:3px;transition:opacity .15s}.tf-0aa291:hover{opacity:.7}.tf-234e31{margin-top:20px;padding:16px;border-radius:12px;background:var(--tf-error-alpha, rgba(239, 68, 68, .06));border:1px solid var(--tf-error-bg);text-align:center}.tf-adb588{font-size:var(--tf-font-md);color:var(--tf-text-secondary);line-height:1.5;margin-bottom:12px}.tf-11fa21{display:inline-flex;align-items:center;gap:4px;font-size:var(--tf-font-base);color:var(--tf-primary);text-decoration:none;margin-bottom:12px;transition:opacity .15s}.tf-11fa21:hover{opacity:.7}.tf-4f7573{width:100%;padding:12px;border-radius:12px;background:linear-gradient(135deg,var(--tf-success),color-mix(in srgb,var(--tf-success) 80%,#000));color:var(--tf-text-on-primary);font-size:var(--tf-font-lg);font-weight:600;cursor:pointer;border:none;transition:opacity .2s,transform .15s}.tf-4f7573:hover{opacity:.9;transform:translateY(-1px)}.tf-4f7573:active{transform:scale(.98)}.tf-c918a2{margin-top:16px;text-align:center}.tf-ad7aab{visibility:hidden;pointer-events:none}.tf-1e22cb{width:100%;padding:12px;border-radius:12px;background:var(--tf-bg-secondary);color:var(--tf-text);font-size:var(--tf-font-lg);font-weight:600;cursor:pointer;border:1px solid var(--tf-border);transition:opacity .2s,transform .15s}.tf-1e22cb:hover{opacity:.85;transform:translateY(-1px)}.tf-1e22cb:active{transform:scale(.98)}';
+const css0 = ".tf-2de115{width:100%;padding:14px 0;border-radius:14px;border:none;background:linear-gradient(135deg,var(--tf-primary),color-mix(in srgb,var(--tf-primary) 80%,#000));color:var(--tf-text-on-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;box-shadow:0 4px 16px var(--tf-primary-glow);letter-spacing:-.01em;font-family:var(--tf-font-family);transition:transform .15s ease,opacity .15s ease,box-shadow .15s ease}.tf-2de115:hover{opacity:.95;transform:translateY(-1px);box-shadow:0 6px 20px var(--tf-primary-glow)}.tf-2de115:active{transform:translateY(0)}.tf-47dc2a{background:var(--tf-primary);cursor:wait;opacity:.85}.tf-44b8f1{width:100%;padding:14px 0;border-radius:14px;border:1px solid var(--tf-primary);background:var(--tf-primary-light);color:var(--tf-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;font-family:var(--tf-font-family);transition:transform .15s ease,background .15s ease}.tf-44b8f1:hover{transform:translateY(-1px)}.tf-44b8f1:active{transform:translateY(0)}.tf-04fe16{width:100%;padding:14px 0;border-radius:14px;border:1.5px dashed var(--tf-primary);background:var(--tf-primary-light);color:var(--tf-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;font-family:var(--tf-font-family);transition:transform .15s ease,background .15s ease;animation:tf-d53743 2s ease-in-out infinite}.tf-04fe16:hover{transform:translateY(-1px);background:var(--tf-primary-glow)}.tf-04fe16:active{transform:translateY(0)}.tf-65cf23{width:100%;padding:14px 0;border-radius:14px;text-align:center;background:var(--tf-success-bg);color:var(--tf-success);font-weight:600;font-size:var(--tf-font-xl);display:flex;align-items:center;justify-content:center;gap:8px;border:none}.tf-2f0314{width:100%;padding:14px 0;border-radius:14px;text-align:center;background:var(--tf-error-bg);color:var(--tf-error);font-weight:600;font-size:var(--tf-font-xl);display:flex;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer}.tf-20b1ac{display:flex;align-items:center;justify-content:center;gap:8px}.tf-e6dae0{display:inline-block;width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.3);border-top-color:var(--tf-text-on-primary, #fff);animation:tf-8a3bc2 .8s linear infinite}.tf-90e712{width:14px;height:14px}";
+const css1$1 = ".tf-59b76a{font-size:var(--tf-font-amount);font-weight:700;line-height:100%;letter-spacing:-.02em;color:var(--tf-text);font-family:var(--tf-font-family);background:none;border:none;outline:none;width:100%;min-width:0;text-align:left}.tf-59b76a::-webkit-outer-spin-button,.tf-59b76a::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.tf-59b76a{-moz-appearance:textfield}.tf-59b76a::placeholder{color:var(--tf-text-tertiary)}.tf-a859d8{color:var(--tf-text-tertiary)}";
+const css1 = '@keyframes tf-d36961{to{transform:rotate(360deg)}}.tf-5835df{padding:24px 20px 16px;animation:tf-e061c9 .3s ease both;overflow:hidden}.tf-9322ae{display:flex;align-items:center;justify-content:center;gap:12px;padding-bottom:20px;margin-bottom:4px;border-bottom:1px solid var(--tf-border-light)}.tf-7d5519{display:flex;align-items:center;justify-content:flex-start;min-width:0;flex:1}.tf-0b8d30{justify-content:flex-end}.tf-bfbd0b{display:flex;align-items:center;gap:8px;min-width:0}.tf-7e8fdf{position:relative;width:32px;height:32px;flex-shrink:0}.tf-37f3cf{position:absolute;bottom:-2px;right:-2px;width:16px;height:16px;border-radius:50%;background:var(--tf-bg);display:flex;align-items:center;justify-content:center;border:1.5px solid var(--tf-bg)}.tf-9401fd{display:flex;flex-direction:column;min-width:0;overflow:hidden}.tf-832fae{font-family:var(--tf-font-family-mono);font-weight:600;font-size:var(--tf-font-lg);color:var(--tf-text);white-space:nowrap;line-height:1.2}.tf-b557fc{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-weight:500;line-height:1.2}.tf-5953e8{color:var(--tf-text-tertiary);flex-shrink:0}.tf-a168c7{display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);padding-bottom:16px}.tf-062404{width:16px;height:16px;border-radius:4px;object-fit:contain}.tf-26af4c{display:flex;flex-direction:column}.tf-4b9be7{display:flex;gap:12px}.tf-036db2{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:var(--tf-font-base);font-weight:600;z-index:1}.tf-09b7bb{background:var(--tf-success-bg);color:var(--tf-success)}.tf-aef7e0{background:var(--tf-primary-light)}.tf-5c628c{background:var(--tf-input-bg);color:var(--tf-text-tertiary);border:1px solid var(--tf-border-light)}.tf-a5abdf{background:var(--tf-error-bg);color:var(--tf-error)}.tf-9efe7c{width:14px;height:14px;border-radius:50%;border:2px solid var(--tf-primary-light);border-top-color:var(--tf-primary);animation:tf-d36961 .8s linear infinite}.tf-5c7806{border-color:#ff475733;border-top-color:var(--tf-error)}.tf-185719{flex:1;min-width:0;padding-bottom:20px;position:relative}.tf-185719:before{content:"";position:absolute;left:-26px;top:28px;bottom:0;width:2px;background:var(--tf-border-light)}.tf-4b9be7:last-child .tf-185719:before{display:none}.tf-4b9be7:last-child .tf-185719{padding-bottom:4px}.tf-84527b .tf-185719:before{background:var(--tf-success)}.tf-417d35 .tf-185719:before{background:var(--tf-error)}.tf-aad7e9{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-text);line-height:28px}.tf-8de1c6 .tf-aad7e9{color:var(--tf-text-tertiary)}.tf-417d35 .tf-aad7e9{color:var(--tf-error)}.tf-bcb46a{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);margin-top:2px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;word-break:break-word;overflow-wrap:break-word}.tf-16cfdc .tf-bcb46a{color:var(--tf-primary)}.tf-0aa291{font-size:var(--tf-font-sm);color:var(--tf-primary);text-decoration:none;display:inline-flex;align-items:center;gap:3px;transition:opacity .15s}.tf-0aa291:hover{opacity:.7}.tf-234e31{margin-top:20px;padding:16px;border-radius:12px;background:var(--tf-error-alpha, rgba(239, 68, 68, .06));border:1px solid var(--tf-error-bg);text-align:center}.tf-adb588{font-size:var(--tf-font-md);color:var(--tf-text-secondary);line-height:1.5;margin-bottom:12px}.tf-11fa21{display:inline-flex;align-items:center;gap:4px;font-size:var(--tf-font-base);color:var(--tf-primary);text-decoration:none;margin-bottom:12px;transition:opacity .15s}.tf-11fa21:hover{opacity:.7}.tf-4f7573{width:100%;padding:12px;border-radius:12px;background:linear-gradient(135deg,var(--tf-success),color-mix(in srgb,var(--tf-success) 80%,#000));color:var(--tf-text-on-primary);font-size:var(--tf-font-lg);font-weight:600;cursor:pointer;border:none;transition:opacity .2s,transform .15s}.tf-4f7573:hover{opacity:.9;transform:translateY(-1px)}.tf-4f7573:active{transform:scale(.98)}.tf-c918a2{margin-top:16px;text-align:center}.tf-ad7aab{visibility:hidden;pointer-events:none}.tf-1e22cb{width:100%;padding:12px;border-radius:12px;background:var(--tf-bg-secondary);color:var(--tf-text);font-size:var(--tf-font-lg);font-weight:600;cursor:pointer;border:1px solid var(--tf-border);transition:opacity .2s,transform .15s}.tf-1e22cb:hover{opacity:.85;transform:translateY(-1px)}.tf-1e22cb:active{transform:scale(.98)}';
 const css3 = ".tf-216412{display:inline-flex;align-items:center;gap:4px}.tf-52dc68{flex-shrink:0}.tf-fd32be{font-size:var(--tf-font-sm);color:var(--tf-text-secondary);min-width:20px}";
-const css4 = ".tf-1019c2{margin:12px 20px 0;padding:14px;background:var(--tf-primary-light);border-radius:10px;font-size:var(--tf-font-base);color:var(--tf-text-secondary);animation:tf-42889f .25s ease both}.tf-4922f1{display:flex;justify-content:space-between;align-items:center;min-height:16px;margin-bottom:4px}.tf-4922f1:last-child{margin-bottom:0}.tf-57f45f{font-family:JetBrains Mono,monospace;font-size:var(--tf-font-sm)}.tf-a57ec8{display:block;height:131px;box-sizing:border-box}.tf-d74ccc{display:flex;justify-content:space-between;align-items:center;height:22px}.tf-92e7a8{width:68px;height:14px}.tf-d20f50{width:56px}.tf-a9a96f{width:150px;height:14px}.tf-0134eb{width:126px}.tf-91635c{width:80px}.tf-ca1291{cursor:pointer;border-bottom:1px solid var(--tf-border-light);margin-bottom:10px;transition:opacity .15s}.tf-ca1291:hover{opacity:.7}.tf-ca1291 .tf-57f45f{display:inline-flex;align-items:center;gap:4px}.tf-ca1291 .tf-57f45f svg{opacity:.35;flex-shrink:0;transition:opacity .15s}.tf-ca1291:hover .tf-57f45f svg{opacity:.7}.tf-a249b3 .tf-recipient-placeholder{color:var(--tf-error)}.tf-adeddd{border:1px dashed var(--tf-primary);border-radius:var(--tf-radius, 10px);padding:8px 12px;margin-bottom:10px;animation:tf-d990e5 2s ease-in-out infinite}.tf-adeddd .tf-recipient-placeholder{color:var(--tf-primary);font-style:normal}";
-const css6 = ".tf-636daf{width:100%;height:100%;background:var(--tf-bg);display:flex;flex-direction:column;border-radius:20px;overflow:hidden}.tf-fddfab{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--tf-border-light)}.tf-970eb9{font-size:var(--tf-font-2xl);font-weight:600;color:var(--tf-text)}.tf-de123a{background:none;border:none;padding:4px;cursor:pointer;color:var(--tf-text-secondary);display:flex;align-items:center;justify-content:center;border-radius:6px;transition:background .15s}.tf-de123a:hover{background:var(--tf-bg-elevated)}.tf-0445e3{flex:1;padding:20px;display:flex;flex-direction:column;gap:8px}.tf-9a65ec{width:100%;min-height:80px;background:var(--tf-input-bg);border:1px solid var(--tf-border-light);border-radius:12px;padding:12px 14px;font-size:var(--tf-font-lg);font-family:JetBrains Mono,monospace;color:var(--tf-text);outline:none;resize:none;transition:border-color .2s,box-shadow .2s;box-sizing:border-box}.tf-9a65ec::placeholder{color:var(--tf-text-tertiary)}.tf-9a65ec:focus{border-color:var(--tf-primary);box-shadow:0 0 0 3px var(--tf-primary-alpha)}.tf-c5ea21{border-color:var(--tf-error)}.tf-c5ea21:focus{border-color:var(--tf-error);box-shadow:0 0 0 3px var(--tf-error-alpha)}.tf-9d4bba{font-size:var(--tf-font-base);color:var(--tf-error);padding:0 2px}.tf-cb9b60{padding:16px 20px 20px}.tf-2cba65{width:100%}.tf-2cba65:disabled{opacity:.5;cursor:not-allowed}";
+const css4 = ".tf-1019c2{margin:12px 20px 0;padding:14px;background:var(--tf-primary-light);border-radius:10px;font-size:var(--tf-font-base);color:var(--tf-text-secondary);animation:tf-42889f .25s ease both}.tf-4922f1{display:flex;justify-content:space-between;align-items:center;min-height:16px;margin-bottom:4px}.tf-4922f1:last-child{margin-bottom:0}.tf-57f45f{font-family:var(--tf-font-family-mono);font-size:var(--tf-font-sm)}.tf-a57ec8{display:block;height:131px;box-sizing:border-box}.tf-d74ccc{display:flex;justify-content:space-between;align-items:center;height:22px}.tf-92e7a8{width:68px;height:14px}.tf-d20f50{width:56px}.tf-a9a96f{width:150px;height:14px}.tf-0134eb{width:126px}.tf-91635c{width:80px}.tf-ca1291{cursor:pointer;border-bottom:1px solid var(--tf-border-light);margin-bottom:10px;transition:opacity .15s}.tf-ca1291:hover{opacity:.7}.tf-ca1291 .tf-57f45f{display:inline-flex;align-items:center;gap:4px}.tf-ca1291 .tf-57f45f svg{opacity:.35;flex-shrink:0;transition:opacity .15s}.tf-ca1291:hover .tf-57f45f svg{opacity:.7}.tf-a249b3 .tf-recipient-placeholder{color:var(--tf-error)}.tf-adeddd{border:1px dashed var(--tf-primary);border-radius:var(--tf-radius, 10px);padding:8px 12px;margin-bottom:10px;animation:tf-d990e5 2s ease-in-out infinite}.tf-adeddd .tf-recipient-placeholder{color:var(--tf-primary);font-style:normal}";
+const css6 = ".tf-636daf{width:100%;height:100%;background:var(--tf-bg);display:flex;flex-direction:column;border-radius:20px;overflow:hidden}.tf-fddfab{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--tf-border-light)}.tf-970eb9{font-size:var(--tf-font-2xl);font-weight:600;color:var(--tf-text)}.tf-de123a{background:none;border:none;padding:4px;cursor:pointer;color:var(--tf-text-secondary);display:flex;align-items:center;justify-content:center;border-radius:6px;transition:background .15s}.tf-de123a:hover{background:var(--tf-bg-elevated)}.tf-0445e3{flex:1;padding:20px;display:flex;flex-direction:column;gap:8px}.tf-9a65ec{width:100%;min-height:80px;background:var(--tf-input-bg);border:1px solid var(--tf-border-light);border-radius:12px;padding:12px 14px;font-size:var(--tf-font-lg);font-family:var(--tf-font-family-mono);color:var(--tf-text);outline:none;resize:none;transition:border-color .2s,box-shadow .2s;box-sizing:border-box}.tf-9a65ec::placeholder{color:var(--tf-text-tertiary)}.tf-9a65ec:focus{border-color:var(--tf-primary);box-shadow:0 0 0 3px var(--tf-primary-alpha)}.tf-c5ea21{border-color:var(--tf-error)}.tf-c5ea21:focus{border-color:var(--tf-error);box-shadow:0 0 0 3px var(--tf-error-alpha)}.tf-9d4bba{font-size:var(--tf-font-base);color:var(--tf-error);padding:0 2px}.tf-cb9b60{padding:16px 20px 20px}.tf-2cba65{width:100%}.tf-2cba65:disabled{opacity:.5;cursor:not-allowed}";
 const css7 = ".tf-ba406b{display:inline-flex;align-items:baseline}.tf-9d81a4{font-size:.7em;line-height:1;opacity:.85}.tf-7977ef{cursor:help}";
-const css8 = "@keyframes tf-07c947{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tf-dc5721{padding:18px 20px 0;display:flex;justify-content:space-between;align-items:center}.tf-68123c{display:flex;align-items:center;gap:7px}.tf-43dda9{visibility:hidden}.tf-532d07{width:22px;height:22px;object-fit:contain;flex-shrink:0}.tf-b7936a{font-size:var(--tf-font-xl);font-weight:600;letter-spacing:-.01em}.tf-883305{color:var(--tf-primary)}.tf-6da3db{display:flex;gap:6px;align-items:center;cursor:pointer;background:none;border:none;padding:4px 8px;border-radius:8px;font-family:inherit;transition:background .15s ease}.tf-6da3db:hover{background:var(--tf-surface-hover)}.tf-6da3db:focus-visible{outline:2px solid var(--tf-primary);outline-offset:2px}.tf-d25568{width:8px;height:8px;border-radius:50%;background:var(--tf-primary);box-shadow:0 0 8px var(--tf-primary-glow)}.tf-16ce7d{background:var(--tf-success);box-shadow:0 0 8px var(--tf-success)}.tf-11bb1d{font-size:var(--tf-font-base);color:var(--tf-text-secondary);font-family:JetBrains Mono,monospace}.tf-98d625{padding:14px 20px 0;animation:tf-07c947 .3s ease both}.tf-8b7743{padding:0 20px;animation:tf-07c947 .35s ease both}.tf-677ece{background:var(--tf-input-bg);border-radius:14px;padding:14px 16px;border:1px solid var(--tf-border-light);transition:border-color .2s,background .25s ease,box-shadow .2s ease}.tf-635915{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.tf-b8a04a{display:inline-flex;align-items:center;gap:8px}.tf-0d1ef8{font-size:var(--tf-font-base);color:var(--tf-text-tertiary);font-weight:500;text-align:left}.tf-d04a4e{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-d7140f{display:flex;justify-content:space-between;align-items:center}.tf-dcd620{display:flex;align-items:center;gap:8px;background:var(--tf-surface);border-radius:10px;padding:6px 12px 6px 8px;height:36px;box-sizing:border-box;border:1px solid var(--tf-border);cursor:pointer;flex-shrink:0;font-family:DM Sans,sans-serif;transition:background .15s ease,border-color .15s ease,transform .1s ease}.tf-dcd620:hover{background:var(--tf-surface-hover);transform:scale(1.02)}.tf-e25a5c{padding:0 12px}.tf-038cf1{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-33c9cb{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-primary)}.tf-b1e4a6{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary)}.tf-d168ae{display:flex;justify-content:space-between;align-items:center;margin-top:6px;min-height:16px;font-size:var(--tf-font-base);line-height:100%}.tf-b2b098{margin-top:6px;min-height:16px;display:flex;align-items:center}.tf-92acfd{display:inline-block;min-height:16px;font-size:var(--tf-font-base);line-height:100%;color:var(--tf-text-tertiary)}.tf-bd2f5c{visibility:hidden}.tf-5f8805{font-size:var(--tf-font-sm);font-weight:600;color:var(--tf-primary);background:var(--tf-primary-light);border:none;padding:2px 8px;border-radius:6px;cursor:pointer;font-family:DM Sans,sans-serif}.tf-5f8805:hover{opacity:.8}.tf-af41ab{display:flex;justify-content:center;margin:-6px 0;position:relative;z-index:2}.tf-18c3f4{width:36px;height:36px;padding:0;appearance:none;-webkit-appearance:none;border-radius:10px;background:var(--tf-surface);border:3px solid var(--tf-bg);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000000f;font-size:var(--tf-font-lg);color:var(--tf-text-secondary);transition:transform .2s ease,background .15s ease,color .15s ease}.tf-18c3f4:hover{transform:scale(1.1);color:var(--tf-primary)}.tf-18c3f4:active{transform:scale(.95) rotate(180deg)}.tf-a04b23{position:relative;flex-shrink:0}.tf-57762e{position:absolute;bottom:-2px;right:-2px}";
-const css9 = ".tf-140273{width:100%;max-width:400px;border-radius:20px;overflow:hidden;background:var(--tf-bg);border:1px solid var(--tf-border);box-shadow:var(--tf-shadow-lg);font-family:DM Sans,sans-serif;color:var(--tf-text);height:100%;display:flex;flex-direction:column}.tf-45030f{padding:18px 20px 14px;flex-shrink:0}.tf-ce0622{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.tf-0c1692{font-size:var(--tf-font-xl);font-weight:600}.tf-64aa3f{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--tf-text-tertiary);font-size:var(--tf-font-2xl);font-weight:300;background:var(--tf-input-bg);border:none;font-family:DM Sans,sans-serif}.tf-9819ca{display:flex;align-items:center;gap:10px;background:var(--tf-input-bg);border-radius:12px;padding:10px 14px;border:1px solid var(--tf-border-light);transition:border-color .15s}.tf-9819ca.tf-d9fcd6{border-color:var(--tf-primary)}.tf-4ad0e7{color:var(--tf-text-tertiary);font-size:var(--tf-font-lg);flex-shrink:0}.tf-9ea859{flex:1;border:none;background:none;outline:none;font-size:var(--tf-font-lg);color:var(--tf-text);font-family:DM Sans,sans-serif}.tf-9ea859::placeholder{color:var(--tf-text-tertiary)}.tf-25e112{display:flex;gap:4px;margin-top:12px;overflow-x:auto;padding-bottom:2px}.tf-478cb9{display:flex;align-items:center;gap:5px;padding:4px 10px;border-radius:8px;border:none;font-size:var(--tf-font-sm);font-weight:500;cursor:pointer;white-space:nowrap;font-family:DM Sans,sans-serif;background:var(--tf-input-bg);color:var(--tf-text-secondary)}.tf-478cb9.tf-125be5{background:var(--tf-primary-light);color:var(--tf-primary);outline:1px solid var(--tf-primary);outline-offset:-1px}.tf-bb4fb1{height:24px;border-radius:8px;flex-shrink:0}.tf-ad5703{height:1px;background:var(--tf-border);margin:0 20px;flex-shrink:0}.tf-de9986{flex:1;min-height:0;overflow-y:auto;padding:6px 8px}.tf-7ac0fe{display:flex;flex-direction:column}.tf-c6ef08{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px}.tf-3643cf{display:flex;align-items:center;gap:12px}.tf-9b3d59{width:36px;height:36px;border-radius:50%}.tf-a4cc17{display:flex;flex-direction:column;gap:6px}.tf-7f1baf{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.tf-9171a2{height:10px}.tf-9171a2.tf-71ea5d{width:88px}.tf-9171a2.tf-dfb33a{width:64px}.tf-9171a2.tf-43fbf4{width:56px}.tf-9171a2.tf-61ca3c{width:44px}.tf-512365{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px;cursor:pointer;background:transparent;transition:background .1s;border:none;width:100%;font-family:DM Sans,sans-serif}.tf-512365:hover{background:var(--tf-surface-hover)}.tf-512365.tf-9f601f{background:var(--tf-primary-light)}.tf-a0b0d9{display:flex;align-items:center;gap:12px}.tf-1e7a62{position:relative}.tf-67f18a{position:absolute;bottom:-1px;right:-1px;width:13px;height:13px;border-radius:50%;background:var(--tf-surface);border:1px solid var(--tf-border);display:flex;align-items:center;justify-content:center}.tf-cd76b9{text-align:left;display:flex;flex-direction:column;align-items:flex-start}.tf-8f4efd{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-51bf2b{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-87740a{text-align:right}.tf-43fbf4{font-size:var(--tf-font-md);font-weight:500;font-family:JetBrains Mono,monospace}.tf-43fbf4.tf-2ee375{color:var(--tf-text-tertiary)}.tf-61ca3c{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}";
-const css10 = "@keyframes tf-72a7b4{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes tf-7ca8ca{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-4px) rotate(8deg)}}@keyframes tf-2b6de5{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes tf-5b8ef8{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.tf-e98a9a{padding:28px 20px 24px;display:flex;flex-direction:column;align-items:center;animation:tf-2b6de5 .35s ease both}.tf-1f9019{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--tf-success),#00E6A0);display:flex;align-items:center;justify-content:center;margin-bottom:16px;animation:tf-72a7b4 .6s ease both;box-shadow:0 8px 32px #00c48c40;color:var(--tf-text-on-primary)}.tf-73631f{animation:tf-7ca8ca 2s ease-in-out infinite alternate;display:flex}.tf-9e3a66{font-size:var(--tf-font-heading);font-weight:700;color:var(--tf-text);margin-bottom:4px;letter-spacing:-.01em}.tf-db06d4{font-size:var(--tf-font-md);color:var(--tf-text-secondary);margin-bottom:20px}.tf-c9a5e1{width:100%;padding:20px;border-radius:16px;background:linear-gradient(135deg,#00c48c14,#00e6a00a);border:1px solid rgba(0,196,140,.15);display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:16px;animation:tf-2b6de5 .4s ease .2s both}.tf-789d4e{margin-bottom:4px}.tf-f52291{font-size:var(--tf-font-amount-lg);font-weight:700;color:var(--tf-text);font-family:JetBrains Mono,monospace;letter-spacing:-.02em;display:flex;align-items:baseline;gap:8px}.tf-8cfc86{font-size:var(--tf-font-lg);font-weight:500;color:var(--tf-text-secondary)}.tf-4f945b{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-weight:500;display:flex;align-items:center;gap:5px}.tf-75f592{width:100%;margin-bottom:16px}.tf-73910d{width:100%;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--tf-input-bg);border:1px solid var(--tf-border-light);border-radius:10px;cursor:pointer;font-size:var(--tf-font-base);font-weight:500;color:var(--tf-text-secondary);font-family:DM Sans,sans-serif;transition:background .15s}.tf-73910d:hover{background:var(--tf-bg-secondary)}.tf-ae94a0{border-radius:10px 10px 0 0}.tf-1afb0a{transition:transform .2s ease;color:var(--tf-text-tertiary)}.tf-7737cf{transform:rotate(180deg)}.tf-92a530{padding:8px 14px 12px;border:1px solid var(--tf-border-light);border-top:none;border-radius:0 0 10px 10px;background:var(--tf-input-bg);animation:tf-5b8ef8 .15s ease both}.tf-6e8c3e{display:flex;justify-content:space-between;align-items:center;font-size:var(--tf-font-sm);padding:5px 0}.tf-4b5396{color:var(--tf-text-tertiary);font-weight:500}.tf-63cca1{color:var(--tf-text-secondary);font-family:JetBrains Mono,monospace;font-size:var(--tf-font-sm);display:flex;align-items:center;gap:4px}.tf-18c122{color:var(--tf-primary);text-decoration:none;font-size:var(--tf-font-sm);font-family:JetBrains Mono,monospace;display:inline-flex;align-items:center;gap:3px;transition:opacity .15s}.tf-18c122:hover{opacity:.7}.tf-d7e813{width:100%;padding:14px 0;border-radius:14px;border:none;background:var(--tf-primary);color:var(--tf-text-on-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;font-family:DM Sans,sans-serif;box-shadow:0 4px 16px color-mix(in srgb,var(--tf-primary) 25%,transparent);transition:transform .15s ease,opacity .15s ease}.tf-d7e813:hover{opacity:.95;transform:translateY(-1px)}.tf-d7e813:active{transform:translateY(0)}";
-const css11 = ".tf-c63ac0{border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--tf-text-on-primary);font-weight:700;font-family:DM Sans,sans-serif;flex-shrink:0;overflow:hidden}.tf-59aca7{width:100%;height:100%;object-fit:cover;border-radius:50%}.tf-dbfbb3{border-radius:50%;flex-shrink:0;overflow:hidden;display:flex;align-items:center;justify-content:center}.tf-f89395{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.tf-cdfe94{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 0 14px;border-top:1px solid var(--tf-border-light);margin:8px 20px 0;text-decoration:none}.tf-7c0c36{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-26d5ea{font-size:var(--tf-font-base);line-height:1}.tf-8b1e15{font-size:var(--tf-font-sm);font-weight:600;letter-spacing:.02em;color:var(--tf-text-secondary)}.tf-3852e5,.tf-b35860{color:var(--tf-primary)}";
-const css12 = "@keyframes tf-80a677{to{transform:rotate(360deg)}}@keyframes tf-d97ff2{0%,to{opacity:1}50%{opacity:.4}}@keyframes tf-c3558b{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes tf-89a83e{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(6px)}}@keyframes tf-ca9155{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes tf-d2dbc4{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes tf-54b7e7{0%,to{border-color:var(--tf-primary)}50%{border-color:var(--tf-primary-light)}}@keyframes tf-194f18{to{transform:rotate(360deg)}}@keyframes tf-cdef4a{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes tf-fd8795{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-4px) rotate(8deg)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:host{display:block;font-family:DM Sans,sans-serif;color:var(--tf-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--tf-font-2xs: 10px;--tf-font-xs: 11px;--tf-font-sm: 12px;--tf-font-base: 13px;--tf-font-md: 14px;--tf-font-lg: 15px;--tf-font-xl: 16px;--tf-font-2xl: 17px;--tf-font-heading: 20px;--tf-font-amount: 28px;--tf-font-amount-lg: 24px;--tf-font-amount-sm: 22px}button:focus-visible,a:focus-visible{outline:2px solid var(--tf-primary);outline-offset:2px;border-radius:4px}";
-const css13 = ".tf-1ac2ef{border-radius:6px;background:var(--tf-skeleton);animation:tf-90e981 1.5s infinite}.tf-68a980{position:absolute;inset:0;border-radius:20px;display:flex;align-items:flex-start;z-index:10;overflow:hidden;animation:tf-552c66 .2s ease both}.tf-e7b9c7{width:100%;max-width:400px;min-width:360px;border-radius:20px;overflow:hidden;background:var(--tf-bg);border:1px solid var(--tf-border);box-shadow:var(--tf-shadow-lg);font-family:DM Sans,sans-serif;color:var(--tf-text);position:relative;transition:background .25s ease,border-color .25s ease,box-shadow .25s ease}.tf-b4f391{background:transparent}.tf-118b57{border:none;box-shadow:none}.tf-118b57 .tf-07225e{display:none}.tf-07225e{height:2px;background:linear-gradient(90deg,transparent,var(--tf-primary),transparent);opacity:.6}.tf-d01dff{padding:16px 20px 20px;animation:tf-ed0355 .3s ease .1s both}.tf-5bb68c{padding:12px 20px 0}.tf-04e1e2{margin:12px 20px 0;padding:14px;background:var(--tf-primary-light);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:131px;box-sizing:border-box;animation:tf-b61e63 .25s ease both}.tf-d01908{color:var(--tf-text-tertiary);opacity:.4}.tf-1cc72b{font-size:var(--tf-font-base);color:var(--tf-text-secondary)}.tf-480f1a{padding:0 20px 16px;text-align:center}.tf-480f1a a{font-size:var(--tf-font-base);color:var(--tf-primary);text-decoration:none;font-family:JetBrains Mono,monospace}.tf-bc7950{text-align:center;margin-top:8px;margin-bottom:10px}.tf-bc7950 a{font-size:var(--tf-font-sm);color:var(--tf-primary);text-decoration:none;font-family:JetBrains Mono,monospace}.tf-d9b7b4{display:inline-flex;align-items:center;gap:4px;background:var(--tf-surface);border:1px solid var(--tf-border);border-radius:6px;padding:2px 8px;cursor:pointer;font-size:var(--tf-font-sm);font-family:JetBrains Mono,monospace;color:var(--tf-text-secondary);transition:background .15s,border-color .15s}.tf-d9b7b4:hover{background:var(--tf-surface-hover)}.tf-d9b7b4 svg{opacity:.4;transition:opacity .15s}.tf-d9b7b4:hover svg{opacity:.7}.tf-9398ea{border-style:dashed;border-color:var(--tf-primary)}.tf-9398ea .tf-2d9323{color:var(--tf-primary);font-style:italic;font-family:DM Sans,sans-serif}.tf-4567e1{cursor:default;opacity:.8}.tf-4567e1:hover{background:var(--tf-surface)}.tf-58881e{color:var(--tf-text-tertiary);font-style:italic}";
+const css8 = "@keyframes tf-07c947{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tf-dc5721{padding:18px 20px 0;display:flex;justify-content:space-between;align-items:center}.tf-68123c{display:flex;align-items:center;gap:7px}.tf-43dda9{visibility:hidden}.tf-532d07{width:22px;height:22px;object-fit:contain;flex-shrink:0}.tf-b7936a{font-size:var(--tf-font-xl);font-weight:600;letter-spacing:-.01em}.tf-883305{color:var(--tf-primary)}.tf-6da3db{display:flex;gap:6px;align-items:center;cursor:pointer;background:none;border:none;padding:4px 8px;border-radius:8px;font-family:inherit;transition:background .15s ease}.tf-6da3db:hover{background:var(--tf-surface-hover)}.tf-6da3db:focus-visible{outline:2px solid var(--tf-primary);outline-offset:2px}.tf-d25568{width:8px;height:8px;border-radius:50%;background:var(--tf-primary);box-shadow:0 0 8px var(--tf-primary-glow)}.tf-16ce7d{background:var(--tf-success);box-shadow:0 0 8px var(--tf-success)}.tf-11bb1d{font-size:var(--tf-font-base);color:var(--tf-text-secondary);font-family:var(--tf-font-family-mono)}.tf-98d625{padding:14px 20px 0;animation:tf-07c947 .3s ease both}.tf-8b7743{padding:0 20px;animation:tf-07c947 .35s ease both}.tf-677ece{background:var(--tf-input-bg);border-radius:14px;padding:14px 16px;border:1px solid var(--tf-border-light);transition:border-color .2s,background .25s ease,box-shadow .2s ease}.tf-635915{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.tf-b8a04a{display:inline-flex;align-items:center;gap:8px}.tf-0d1ef8{font-size:var(--tf-font-base);color:var(--tf-text-tertiary);font-weight:500;text-align:left}.tf-d04a4e{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}.tf-d7140f{display:flex;justify-content:space-between;align-items:center}.tf-dcd620{display:flex;align-items:center;gap:8px;background:var(--tf-surface);border-radius:10px;padding:6px 12px 6px 8px;height:36px;box-sizing:border-box;border:1px solid var(--tf-border);cursor:pointer;flex-shrink:0;font-family:var(--tf-font-family);transition:background .15s ease,border-color .15s ease,transform .1s ease}.tf-dcd620:hover{background:var(--tf-surface-hover);transform:scale(1.02)}.tf-e25a5c{padding:0 12px}.tf-038cf1{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-33c9cb{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-primary)}.tf-b1e4a6{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary)}.tf-d168ae{display:flex;justify-content:space-between;align-items:center;margin-top:6px;min-height:16px;font-size:var(--tf-font-base);line-height:100%}.tf-b2b098{margin-top:6px;min-height:16px;display:flex;align-items:center}.tf-92acfd{display:inline-block;min-height:16px;font-size:var(--tf-font-base);line-height:100%;color:var(--tf-text-tertiary)}.tf-bd2f5c{visibility:hidden}.tf-5f8805{font-size:var(--tf-font-sm);font-weight:600;color:var(--tf-primary);background:var(--tf-primary-light);border:none;padding:2px 8px;border-radius:6px;cursor:pointer;font-family:var(--tf-font-family)}.tf-5f8805:hover{opacity:.8}.tf-af41ab{display:flex;justify-content:center;margin:-6px 0;position:relative;z-index:2}.tf-18c3f4{width:36px;height:36px;padding:0;appearance:none;-webkit-appearance:none;border-radius:10px;background:var(--tf-surface);border:3px solid var(--tf-bg);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000000f;font-size:var(--tf-font-lg);color:var(--tf-text-secondary);transition:transform .2s ease,background .15s ease,color .15s ease}.tf-18c3f4:hover{transform:scale(1.1);color:var(--tf-primary)}.tf-18c3f4:active{transform:scale(.95) rotate(180deg)}.tf-a04b23{position:relative;flex-shrink:0}.tf-57762e{position:absolute;bottom:-2px;right:-2px}";
+const css9 = ".tf-140273{width:100%;max-width:400px;border-radius:20px;overflow:hidden;background:var(--tf-bg);border:1px solid var(--tf-border);box-shadow:var(--tf-shadow-lg);font-family:var(--tf-font-family);color:var(--tf-text);height:100%;display:flex;flex-direction:column}.tf-45030f{padding:18px 20px 14px;flex-shrink:0}.tf-ce0622{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.tf-0c1692{font-size:var(--tf-font-xl);font-weight:600}.tf-64aa3f{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--tf-text-tertiary);font-size:var(--tf-font-2xl);font-weight:300;background:var(--tf-input-bg);border:none;font-family:var(--tf-font-family)}.tf-9819ca{display:flex;align-items:center;gap:10px;background:var(--tf-input-bg);border-radius:12px;padding:10px 14px;border:1px solid var(--tf-border-light);transition:border-color .15s}.tf-9819ca.tf-d9fcd6{border-color:var(--tf-primary)}.tf-4ad0e7{color:var(--tf-text-tertiary);font-size:var(--tf-font-lg);flex-shrink:0}.tf-9ea859{flex:1;border:none;background:none;outline:none;font-size:var(--tf-font-lg);color:var(--tf-text);font-family:var(--tf-font-family)}.tf-9ea859::placeholder{color:var(--tf-text-tertiary)}.tf-25e112{display:flex;gap:4px;margin-top:12px;overflow-x:auto;padding-bottom:2px}.tf-478cb9{display:flex;align-items:center;gap:5px;padding:4px 10px;border-radius:8px;border:none;font-size:var(--tf-font-sm);font-weight:500;cursor:pointer;white-space:nowrap;font-family:var(--tf-font-family);background:var(--tf-input-bg);color:var(--tf-text-secondary)}.tf-478cb9.tf-125be5{background:var(--tf-primary-light);color:var(--tf-primary);outline:1px solid var(--tf-primary);outline-offset:-1px}.tf-bb4fb1{height:24px;border-radius:8px;flex-shrink:0}.tf-ad5703{height:1px;background:var(--tf-border);margin:0 20px;flex-shrink:0}.tf-de9986{flex:1;min-height:0;overflow-y:auto;padding:6px 8px}.tf-7ac0fe{display:flex;flex-direction:column}.tf-c6ef08{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px}.tf-3643cf{display:flex;align-items:center;gap:12px}.tf-9b3d59{width:36px;height:36px;border-radius:50%}.tf-a4cc17{display:flex;flex-direction:column;gap:6px}.tf-7f1baf{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.tf-9171a2{height:10px}.tf-9171a2.tf-71ea5d{width:88px}.tf-9171a2.tf-dfb33a{width:64px}.tf-9171a2.tf-43fbf4{width:56px}.tf-9171a2.tf-61ca3c{width:44px}.tf-512365{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px;cursor:pointer;background:transparent;transition:background .1s;border:none;width:100%;font-family:var(--tf-font-family)}.tf-512365:hover{background:var(--tf-surface-hover)}.tf-512365.tf-9f601f{background:var(--tf-primary-light)}.tf-a0b0d9{display:flex;align-items:center;gap:12px}.tf-1e7a62{position:relative}.tf-67f18a{position:absolute;bottom:-1px;right:-1px;width:13px;height:13px;border-radius:50%;background:var(--tf-surface);border:1px solid var(--tf-border);display:flex;align-items:center;justify-content:center}.tf-cd76b9{text-align:left;display:flex;flex-direction:column;align-items:flex-start}.tf-8f4efd{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-51bf2b{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-87740a{text-align:right}.tf-43fbf4{color:var(--tf-text);font-size:var(--tf-font-md);font-weight:500;font-family:var(--tf-font-family-mono)}.tf-43fbf4.tf-2ee375{color:var(--tf-text-tertiary)}.tf-61ca3c{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}";
+const css10 = "@keyframes tf-72a7b4{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes tf-7ca8ca{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-4px) rotate(8deg)}}@keyframes tf-2b6de5{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes tf-5b8ef8{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.tf-e98a9a{padding:28px 20px 24px;display:flex;flex-direction:column;align-items:center;animation:tf-2b6de5 .35s ease both}.tf-1f9019{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--tf-success),#00E6A0);display:flex;align-items:center;justify-content:center;margin-bottom:16px;animation:tf-72a7b4 .6s ease both;box-shadow:0 8px 32px #00c48c40;color:var(--tf-text-on-primary)}.tf-73631f{animation:tf-7ca8ca 2s ease-in-out infinite alternate;display:flex}.tf-9e3a66{font-size:var(--tf-font-heading);font-weight:700;color:var(--tf-text);margin-bottom:4px;letter-spacing:-.01em}.tf-db06d4{font-size:var(--tf-font-md);color:var(--tf-text-secondary);margin-bottom:20px}.tf-c9a5e1{width:100%;padding:20px;border-radius:16px;background:linear-gradient(135deg,#00c48c14,#00e6a00a);border:1px solid rgba(0,196,140,.15);display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:16px;animation:tf-2b6de5 .4s ease .2s both}.tf-7b3b5b{position:relative;width:40px;height:40px;margin-bottom:4px}.tf-651299{position:absolute;bottom:-2px;right:-2px;width:16px;height:16px;border-radius:50%;background:var(--tf-bg);display:flex;align-items:center;justify-content:center;border:1.5px solid rgba(0,196,140,.15)}.tf-f52291{font-size:var(--tf-font-amount-lg);font-weight:700;color:var(--tf-text);font-family:var(--tf-font-family-mono);letter-spacing:-.02em;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;justify-content:center}.tf-8cfc86{font-size:var(--tf-font-lg);font-weight:500;color:var(--tf-text-secondary)}.tf-5f768d{font-size:var(--tf-font-sm);font-weight:500;font-family:var(--tf-font-family);color:var(--tf-text-tertiary);letter-spacing:0}.tf-75f592{width:100%;margin-bottom:16px}.tf-73910d{width:100%;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--tf-input-bg);border:1px solid var(--tf-border-light);border-radius:10px;cursor:pointer;font-size:var(--tf-font-base);font-weight:500;color:var(--tf-text-secondary);font-family:var(--tf-font-family);transition:background .15s}.tf-73910d:hover{background:var(--tf-bg-secondary)}.tf-ae94a0{border-radius:10px 10px 0 0}.tf-1afb0a{transition:transform .2s ease;color:var(--tf-text-tertiary)}.tf-7737cf{transform:rotate(180deg)}.tf-92a530{padding:8px 14px 12px;border:1px solid var(--tf-border-light);border-top:none;border-radius:0 0 10px 10px;background:var(--tf-input-bg);animation:tf-5b8ef8 .15s ease both}.tf-6e8c3e{display:flex;justify-content:space-between;align-items:center;font-size:var(--tf-font-sm);padding:5px 0}.tf-4b5396{color:var(--tf-text-tertiary);font-weight:500}.tf-63cca1{color:var(--tf-text-secondary);font-family:var(--tf-font-family-mono);font-size:var(--tf-font-sm);display:flex;align-items:center;gap:4px}.tf-18c122{color:var(--tf-primary);text-decoration:none;font-size:var(--tf-font-sm);font-family:var(--tf-font-family-mono);display:inline-flex;align-items:center;gap:3px;transition:opacity .15s}.tf-18c122:hover{opacity:.7}.tf-d7e813{width:100%;padding:14px 0;border-radius:14px;border:none;background:var(--tf-primary);color:var(--tf-text-on-primary);font-weight:600;font-size:var(--tf-font-xl);cursor:pointer;font-family:var(--tf-font-family);box-shadow:0 4px 16px color-mix(in srgb,var(--tf-primary) 25%,transparent);transition:transform .15s ease,opacity .15s ease}.tf-d7e813:hover{opacity:.95;transform:translateY(-1px)}.tf-d7e813:active{transform:translateY(0)}";
+const css11 = ".tf-c63ac0{border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--tf-text-on-primary);font-weight:700;font-family:var(--tf-font-family);flex-shrink:0;overflow:hidden}.tf-59aca7{width:100%;height:100%;object-fit:cover;border-radius:50%}.tf-dbfbb3{border-radius:50%;flex-shrink:0;overflow:hidden;display:flex;align-items:center;justify-content:center}.tf-f89395{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.tf-cdfe94{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 0 14px;border-top:1px solid var(--tf-border-light);margin:8px 20px 0;text-decoration:none}.tf-7c0c36{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-26d5ea{font-size:var(--tf-font-base);line-height:1}.tf-8b1e15{font-size:var(--tf-font-sm);font-weight:600;letter-spacing:.02em;color:var(--tf-text-secondary)}.tf-3852e5,.tf-b35860{color:var(--tf-primary)}";
+const css12 = '@keyframes tf-80a677{to{transform:rotate(360deg)}}@keyframes tf-d97ff2{0%,to{opacity:1}50%{opacity:.4}}@keyframes tf-c3558b{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes tf-89a83e{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(6px)}}@keyframes tf-ca9155{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes tf-d2dbc4{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes tf-54b7e7{0%,to{border-color:var(--tf-primary)}50%{border-color:var(--tf-primary-light)}}@keyframes tf-194f18{to{transform:rotate(360deg)}}@keyframes tf-cdef4a{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes tf-fd8795{0%{transform:translateY(0) rotate(0)}to{transform:translateY(-4px) rotate(8deg)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:host{display:block;color:var(--tf-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--tf-font-family: "DM Sans", sans-serif;--tf-font-family-mono: "JetBrains Mono", monospace;font-family:var(--tf-font-family);--tf-font-2xs: 10px;--tf-font-xs: 11px;--tf-font-sm: 12px;--tf-font-base: 13px;--tf-font-md: 14px;--tf-font-lg: 15px;--tf-font-xl: 16px;--tf-font-2xl: 17px;--tf-font-heading: 20px;--tf-font-amount: 28px;--tf-font-amount-lg: 24px;--tf-font-amount-sm: 22px}button:focus-visible,a:focus-visible{outline:2px solid var(--tf-primary);outline-offset:2px;border-radius:4px}';
+const css13 = ".tf-1ac2ef{border-radius:6px;background:var(--tf-skeleton);animation:tf-90e981 1.5s infinite}.tf-68a980{position:absolute;inset:0;border-radius:20px;display:flex;align-items:flex-start;z-index:10;overflow:hidden;animation:tf-552c66 .2s ease both}.tf-e7b9c7{width:100%;max-width:400px;min-width:360px;border-radius:20px;overflow:hidden;background:var(--tf-bg);border:1px solid var(--tf-border);box-shadow:var(--tf-shadow-lg);font-family:var(--tf-font-family);color:var(--tf-text);position:relative;transition:background .25s ease,border-color .25s ease,box-shadow .25s ease}.tf-b4f391{background:transparent}.tf-118b57{border:none;box-shadow:none}.tf-118b57 .tf-07225e{display:none}.tf-07225e{height:2px;background:linear-gradient(90deg,transparent,var(--tf-primary),transparent);opacity:.6}.tf-d01dff{padding:16px 20px 20px;animation:tf-ed0355 .3s ease .1s both}.tf-5bb68c{padding:12px 20px 0}.tf-04e1e2{margin:12px 20px 0;padding:14px;background:var(--tf-primary-light);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:131px;box-sizing:border-box;animation:tf-b61e63 .25s ease both}.tf-d01908{color:var(--tf-text-tertiary);opacity:.4}.tf-1cc72b{font-size:var(--tf-font-base);color:var(--tf-text-secondary)}.tf-480f1a{padding:0 20px 16px;text-align:center}.tf-480f1a a{font-size:var(--tf-font-base);color:var(--tf-primary);text-decoration:none;font-family:var(--tf-font-family-mono)}.tf-bc7950{text-align:center;margin-top:8px;margin-bottom:10px}.tf-bc7950 a{font-size:var(--tf-font-sm);color:var(--tf-primary);text-decoration:none;font-family:var(--tf-font-family-mono)}.tf-d9b7b4{display:inline-flex;align-items:center;gap:4px;background:var(--tf-surface);border:1px solid var(--tf-border);border-radius:6px;padding:2px 8px;cursor:pointer;font-size:var(--tf-font-sm);font-family:var(--tf-font-family-mono);color:var(--tf-text-secondary);transition:background .15s,border-color .15s}.tf-d9b7b4:hover{background:var(--tf-surface-hover)}.tf-d9b7b4 svg{opacity:.4;transition:opacity .15s}.tf-d9b7b4:hover svg{opacity:.7}.tf-9398ea{border-style:dashed;border-color:var(--tf-primary)}.tf-9398ea .tf-2d9323{color:var(--tf-primary);font-style:italic;font-family:var(--tf-font-family)}.tf-4567e1{cursor:default;opacity:.8}.tf-4567e1:hover{background:var(--tf-surface)}.tf-58881e{color:var(--tf-text-tertiary);font-style:italic}";
 const swapCss = [css0, css1$1, css1, css3, css4, css6, css7, css8, css9, css10, css11, css12, css13].join("\n");
-const css2 = "@keyframes tf-540423{to{transform:rotate(360deg)}}.tf-d61a98{padding:0 20px}.tf-4574e9{height:162px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--tf-border) transparent}.tf-4574e9::-webkit-scrollbar{width:4px}.tf-4574e9::-webkit-scrollbar-track{background:transparent}.tf-4574e9::-webkit-scrollbar-thumb{background:var(--tf-border);border-radius:2px}.tf-2f8db2{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-radius:11px;margin-bottom:4px;cursor:pointer;border:1px solid var(--tf-border-light);background:transparent;width:100%;font-family:DM Sans,sans-serif;transition:background .15s ease,border-color .15s ease}.tf-aaf1d0{border-color:var(--tf-primary);outline:.5px solid var(--tf-primary);outline-offset:-1px;background:var(--tf-primary-light)}.tf-328e9e{opacity:.4;cursor:not-allowed}.tf-af2c71{cursor:default;pointer-events:none}.tf-d7d776{width:32px;height:32px;border-radius:50%}.tf-c3e864{display:flex;align-items:center;padding:10px 14px;border-radius:12px;border:1px solid var(--tf-border-light);background:var(--tf-input-bg);cursor:default;pointer-events:none}.tf-44450a{display:flex;flex-direction:column;gap:6px}.tf-6c1e97{height:10px}.tf-2174f1{width:52px}.tf-2d3530{width:40px}.tf-2733a9{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.tf-54150b{width:60px}.tf-7aabe1{width:44px}.tf-c41b7c{display:flex;align-items:center;gap:9px}.tf-142024{position:relative}.tf-3b42da{position:absolute;bottom:-1px;right:-1px;width:11px;height:11px;border-radius:50%;background:var(--tf-surface);border:1px solid var(--tf-border);display:flex;align-items:center;justify-content:center}.tf-b7faa4{text-align:left}.tf-1ae7a3{display:flex;align-items:center;gap:5px}.tf-b949b8{font-size:var(--tf-font-base);font-weight:600;color:var(--tf-text)}.tf-2f811b{font-size:var(--tf-font-2xs);font-weight:700;padding:1px 4px;border-radius:3px;background:var(--tf-success-bg);color:var(--tf-success);letter-spacing:.03em}.tf-6542b9{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary)}.tf-e613ff{text-align:right}.tf-630df3{font-size:var(--tf-font-base);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-0be2ff{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-dad192{font-size:var(--tf-font-base);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-840c29{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-09818b{display:flex;align-items:center;padding:10px 14px;border-radius:12px;border:1px solid var(--tf-border-light);background:var(--tf-input-bg);cursor:pointer;width:100%;font-family:DM Sans,sans-serif;transition:background .15s ease,border-color .15s ease}.tf-09818b:hover{border-color:var(--tf-primary);background:var(--tf-primary-light)}.tf-c7ba0f{display:flex;align-items:center;gap:9px}.tf-dea0cb{text-align:left}.tf-41931a{display:flex;align-items:center;gap:5px}.tf-3d2f5a{margin-left:auto;text-align:right;margin-right:8px}.tf-9a379d{font-size:var(--tf-font-lg);font-weight:500;font-family:JetBrains Mono,monospace;color:var(--tf-text);letter-spacing:-.02em}.tf-c11354{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-864468{color:var(--tf-text-tertiary);display:flex;align-items:center;flex-shrink:0;transition:transform .2s ease}.tf-8299cf{flex:1;overflow-y:auto;padding:0 8px 8px;scrollbar-width:thin;scrollbar-color:var(--tf-border) transparent}.tf-176d77{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px;cursor:pointer;background:transparent;transition:background .1s;border:none;width:100%;font-family:DM Sans,sans-serif;color:var(--tf-text)}.tf-176d77:hover{background:var(--tf-surface-hover)}.tf-2df5d9{background:var(--tf-primary-light)}.tf-dc503e{opacity:.4;cursor:not-allowed}.tf-ebbc44{display:flex;align-items:center;gap:12px}.tf-5f455f{text-align:left}.tf-15ee78{display:flex;align-items:center;gap:6px}.tf-976d83{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-ba2eec{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-a37921{text-align:right}.tf-cf71b6{font-size:var(--tf-font-md);font-weight:600;font-family:JetBrains Mono,monospace;color:var(--tf-text)}.tf-7474a9{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}.tf-772a9c{flex-shrink:0;padding:4px 8px 12px;border-top:1px solid var(--tf-border-light)}.tf-5fb6ad{display:flex;flex-direction:column;align-items:center;justify-content:center;height:197px;gap:8px;padding:16px 20px}.tf-86e8e0{flex-direction:row;gap:10px}.tf-66007c{color:var(--tf-text-tertiary);opacity:.5}.tf-73bbbc{width:24px;height:24px;display:flex;align-items:center;justify-content:center;opacity:.6;color:var(--tf-primary);animation:tf-540423 1s linear infinite}.tf-12c6bb{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-text-secondary)}.tf-7a8fe0{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);text-align:center;line-height:1.4}.tf-22f94f{display:flex;align-items:center;justify-content:center;gap:4px;padding:4px 0 2px;font-size:var(--tf-font-sm);color:var(--tf-primary);cursor:pointer;font-weight:500;background:none;border:none;width:100%;font-family:DM Sans,sans-serif}";
-const css5 = ".tf-9b71d6{padding:16px 20px 12px;display:flex;justify-content:space-between;align-items:center;gap:7px}.tf-4c9136{padding:0 20px 10px}.tf-febe61{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-weight:500;margin-bottom:6px;text-align:left}.tf-a27aab{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--tf-input-bg);border-radius:12px;border:1px solid var(--tf-border-light)}.tf-f0b3f5{position:relative;flex-shrink:0}.tf-7a6fbc{position:absolute;bottom:-1px;right:-1px;width:12px;height:12px}.tf-e9e9a1{font-size:var(--tf-font-amount-sm);font-weight:700;letter-spacing:-.02em}.tf-f3baad{font-size:var(--tf-font-lg);font-weight:500;color:var(--tf-text-secondary)}.tf-0131e4{margin-left:auto;font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:JetBrains Mono,monospace}";
+const css2 = "@keyframes tf-540423{to{transform:rotate(360deg)}}.tf-d61a98{padding:0 20px}.tf-4574e9{height:162px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--tf-border) transparent}.tf-4574e9::-webkit-scrollbar{width:4px}.tf-4574e9::-webkit-scrollbar-track{background:transparent}.tf-4574e9::-webkit-scrollbar-thumb{background:var(--tf-border);border-radius:2px}.tf-2f8db2{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-radius:11px;margin-bottom:4px;cursor:pointer;border:1px solid var(--tf-border-light);background:transparent;width:100%;font-family:var(--tf-font-family);transition:background .15s ease,border-color .15s ease}.tf-aaf1d0{border-color:var(--tf-primary);outline:.5px solid var(--tf-primary);outline-offset:-1px;background:var(--tf-primary-light)}.tf-328e9e{opacity:.4;cursor:not-allowed}.tf-af2c71{cursor:default;pointer-events:none}.tf-d7d776{width:32px;height:32px;border-radius:50%}.tf-c3e864{display:flex;align-items:center;padding:11px 14px;border-radius:12px;border:1px solid var(--tf-border-light);background:var(--tf-input-bg);cursor:default;pointer-events:none}.tf-44450a{display:flex;flex-direction:column;gap:6px}.tf-6c1e97{height:10px}.tf-2174f1{width:52px}.tf-2d3530{width:40px}.tf-2733a9{display:flex;flex-direction:column;align-items:flex-end;gap:6px;margin-left:auto}.tf-54150b{width:60px}.tf-7aabe1{width:44px}.tf-c41b7c{display:flex;align-items:center;gap:9px}.tf-142024{position:relative}.tf-3b42da{position:absolute;bottom:-1px;right:-1px;width:11px;height:11px;border-radius:50%;background:var(--tf-surface);border:1px solid var(--tf-border);display:flex;align-items:center;justify-content:center}.tf-b7faa4{text-align:left}.tf-1ae7a3{display:flex;align-items:center;gap:5px}.tf-b949b8{font-size:var(--tf-font-base);font-weight:600;color:var(--tf-text)}.tf-2f811b{font-size:var(--tf-font-2xs);font-weight:700;padding:1px 4px;border-radius:3px;background:var(--tf-success-bg);color:var(--tf-success);letter-spacing:.03em}.tf-6542b9{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary)}.tf-e613ff{text-align:right}.tf-630df3{font-size:var(--tf-font-base);font-weight:600;font-family:var(--tf-font-family-mono);color:var(--tf-text)}.tf-0be2ff{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}.tf-dad192{font-size:var(--tf-font-base);font-weight:600;font-family:var(--tf-font-family-mono);color:var(--tf-text)}.tf-840c29{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}.tf-09818b{display:flex;align-items:center;padding:10px 14px;border-radius:12px;border:1px solid var(--tf-border-light);background:var(--tf-input-bg);cursor:pointer;width:100%;font-family:var(--tf-font-family);transition:background .15s ease,border-color .15s ease}.tf-09818b:hover{border-color:var(--tf-primary);background:var(--tf-primary-light)}.tf-c7ba0f{display:flex;align-items:center;gap:9px}.tf-dea0cb{text-align:left}.tf-41931a{display:flex;align-items:center;gap:5px}.tf-3d2f5a{margin-left:auto;text-align:right;margin-right:8px}.tf-9a379d{font-size:var(--tf-font-lg);font-weight:500;font-family:var(--tf-font-family-mono);color:var(--tf-text);letter-spacing:-.02em}.tf-c11354{font-size:var(--tf-font-xs);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}.tf-864468{color:var(--tf-text-tertiary);display:flex;align-items:center;flex-shrink:0;transition:transform .2s ease}.tf-8299cf{flex:1;overflow-y:auto;padding:0 8px 8px;scrollbar-width:thin;scrollbar-color:var(--tf-border) transparent}.tf-176d77{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px;cursor:pointer;background:transparent;transition:background .1s;border:none;width:100%;font-family:var(--tf-font-family);color:var(--tf-text)}.tf-176d77:hover{background:var(--tf-surface-hover)}.tf-2df5d9{background:var(--tf-primary-light)}.tf-dc503e{opacity:.4;cursor:not-allowed}.tf-ebbc44{display:flex;align-items:center;gap:12px}.tf-5f455f{text-align:left}.tf-15ee78{display:flex;align-items:center;gap:6px}.tf-976d83{font-size:var(--tf-font-lg);font-weight:600;color:var(--tf-text)}.tf-ba2eec{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary)}.tf-a37921{text-align:right}.tf-cf71b6{font-size:var(--tf-font-md);font-weight:600;font-family:var(--tf-font-family-mono);color:var(--tf-text)}.tf-7474a9{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}.tf-772a9c{flex-shrink:0;padding:4px 8px 12px;border-top:1px solid var(--tf-border-light)}.tf-5fb6ad{display:flex;flex-direction:column;align-items:center;justify-content:center;height:197px;gap:8px;padding:16px 20px}.tf-86e8e0{flex-direction:row;gap:10px}.tf-66007c{color:var(--tf-text-tertiary);opacity:.5}.tf-73bbbc{width:24px;height:24px;display:flex;align-items:center;justify-content:center;opacity:.6;color:var(--tf-primary);animation:tf-540423 1s linear infinite}.tf-12c6bb{font-size:var(--tf-font-md);font-weight:600;color:var(--tf-text-secondary)}.tf-7a8fe0{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);text-align:center;line-height:1.4}.tf-22f94f{display:flex;align-items:center;justify-content:center;gap:4px;padding:4px 0 2px;font-size:var(--tf-font-sm);color:var(--tf-primary);cursor:pointer;font-weight:500;background:none;border:none;width:100%;font-family:var(--tf-font-family)}";
+const css5 = ".tf-9b71d6{padding:16px 20px 12px;display:flex;justify-content:space-between;align-items:center;gap:7px}.tf-4c9136{padding:0 20px 10px}.tf-febe61{font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-weight:500;margin-bottom:6px;text-align:left}.tf-a27aab{display:flex;align-items:center;gap:10px;padding:8px 14px;background:var(--tf-input-bg);border-radius:12px;border:1px solid var(--tf-border-light)}.tf-f0b3f5{position:relative;flex-shrink:0}.tf-7a6fbc{position:absolute;bottom:-1px;right:-1px;width:12px;height:12px}.tf-e9e9a1{font-size:var(--tf-font-amount-sm);font-weight:700;letter-spacing:-.02em}.tf-f3baad{font-size:var(--tf-font-lg);font-weight:500;color:var(--tf-text-secondary)}.tf-0131e4{margin-left:auto;font-size:var(--tf-font-sm);color:var(--tf-text-tertiary);font-family:var(--tf-font-family-mono)}";
 const receiveCss = [css0, css1, css2, css3, css4, css5, css6, css7, css8, css9, css10, css11, css12, css13].join("\n");
 const lightVars = {
   "--tf-bg": "#ffffff",
@@ -12439,14 +12457,30 @@ function parseBooleanProp(value2) {
   }
   return void 0;
 }
-let defaultWalletAdapter;
-let defaultCallbacks;
+const [defaultWalletAdapter, setDefaultWalletAdapter] = createSignal();
+const [defaultCallbacks, setDefaultCallbacks] = createSignal();
+const [defaultCustomColors, setDefaultCustomColors] = createSignal();
+const [defaultApiEndpoint, setDefaultApiEndpoint] = createSignal();
+const [defaultTheme, setDefaultTheme] = createSignal();
+const [defaultLocale, setDefaultLocale] = createSignal();
 function registerElements(options = {}) {
   if ("walletAdapter" in options) {
-    defaultWalletAdapter = options.walletAdapter;
+    setDefaultWalletAdapter(() => options.walletAdapter);
   }
   if ("callbacks" in options) {
-    defaultCallbacks = options.callbacks;
+    setDefaultCallbacks(() => options.callbacks);
+  }
+  if ("customColors" in options) {
+    setDefaultCustomColors(() => options.customColors);
+  }
+  if ("apiEndpoint" in options) {
+    setDefaultApiEndpoint(options.apiEndpoint);
+  }
+  if ("theme" in options) {
+    setDefaultTheme(options.theme);
+  }
+  if ("locale" in options) {
+    setDefaultLocale(options.locale);
   }
   if (typeof customElements === "undefined") return;
   if (!customElements.get("tokenflight-swap")) {
@@ -12457,8 +12491,8 @@ function registerElements(options = {}) {
       recipient: "",
       "title-text": "",
       "title-image": "",
-      theme: "light",
-      locale: "en-US",
+      theme: "",
+      locale: "",
       "csp-nonce": "",
       "hide-title": false,
       "hide-powered-by": false,
@@ -12468,14 +12502,14 @@ function registerElements(options = {}) {
       element
     }) => {
       const config = {
-        apiEndpoint: props["api-endpoint"] || void 0,
+        apiEndpoint: props["api-endpoint"] || defaultApiEndpoint() || void 0,
         fromToken: props["from-token"] || void 0,
         toToken: props["to-token"] || void 0,
         recipient: props.recipient || void 0,
         titleText: props["title-text"] || void 0,
         titleImageUrl: props["title-image"] || void 0,
-        theme: props.theme || "light",
-        locale: props.locale || "en-US",
+        theme: props.theme || defaultTheme() || "light",
+        locale: props.locale || defaultLocale() || "en-US",
         hideTitle: parseBooleanProp(props["hide-title"]),
         hidePoweredBy: parseBooleanProp(props["hide-powered-by"]),
         noBackground: parseBooleanProp(props["no-background"]),
@@ -12487,20 +12521,22 @@ function registerElements(options = {}) {
         setSystemDark(vars === darkVars);
       });
       onCleanup(unwatch);
+      const elementCustomColors = element.__customColors;
       const styleContent = createMemo(() => {
-        const theme = props.theme || "light";
+        const theme = props.theme || defaultTheme() || "light";
         const isDark = theme === "auto" ? systemDark() : theme === "dark";
         const themeVars = isDark ? darkVars : lightVars;
-        return `:host { ${buildCssVarString(themeVars)} }
+        const colors = defaultCustomColors();
+        const merged = colors || elementCustomColors ? {
+          ...themeVars,
+          ...colors,
+          ...elementCustomColors
+        } : themeVars;
+        return `:host { ${buildCssVarString(merged)} }
 ${swapCss}`;
       });
       const elementWalletAdapter = element.__walletAdapter;
       const elementCallbacks = element.__callbacks;
-      const walletAdapter = elementWalletAdapter ?? defaultWalletAdapter;
-      const callbacks = elementCallbacks ? {
-        ...defaultCallbacks,
-        ...elementCallbacks
-      } : defaultCallbacks;
       return [(() => {
         var _el$ = _tmpl$();
         setAttribute(_el$, "nonce", nonce);
@@ -12511,8 +12547,15 @@ ${swapCss}`;
         get children() {
           return createComponent(SwapComponent, {
             config,
-            walletAdapter,
-            callbacks
+            get walletAdapter() {
+              return elementWalletAdapter ?? defaultWalletAdapter();
+            },
+            get callbacks() {
+              return elementCallbacks ? {
+                ...defaultCallbacks(),
+                ...elementCallbacks
+              } : defaultCallbacks();
+            }
           });
         }
       })];
@@ -12527,8 +12570,8 @@ ${swapCss}`;
       recipient: "",
       "title-text": "",
       "title-image": "",
-      theme: "light",
-      locale: "en-US",
+      theme: "",
+      locale: "",
       "csp-nonce": "",
       icon: "",
       "hide-title": false,
@@ -12539,15 +12582,15 @@ ${swapCss}`;
       element
     }) => {
       const config = {
-        apiEndpoint: props["api-endpoint"] || void 0,
+        apiEndpoint: props["api-endpoint"] || defaultApiEndpoint() || void 0,
         target: props.target || "",
         amount: props.amount || "",
         fromToken: props["from-token"] || void 0,
         recipient: props.recipient || void 0,
         titleText: props["title-text"] || void 0,
         titleImageUrl: props["title-image"] || void 0,
-        theme: props.theme || "light",
-        locale: props.locale || "en-US",
+        theme: props.theme || defaultTheme() || "light",
+        locale: props.locale || defaultLocale() || "en-US",
         icon: props.icon || void 0,
         hideTitle: parseBooleanProp(props["hide-title"]),
         hidePoweredBy: parseBooleanProp(props["hide-powered-by"]),
@@ -12560,20 +12603,22 @@ ${swapCss}`;
         setSystemDark(vars === darkVars);
       });
       onCleanup(unwatch);
+      const elementCustomColors = element.__customColors;
       const styleContent = createMemo(() => {
-        const theme = props.theme || "light";
+        const theme = props.theme || defaultTheme() || "light";
         const isDark = theme === "auto" ? systemDark() : theme === "dark";
         const themeVars = isDark ? darkVars : lightVars;
-        return `:host { ${buildCssVarString(themeVars)} }
+        const colors = defaultCustomColors();
+        const merged = colors || elementCustomColors ? {
+          ...themeVars,
+          ...colors,
+          ...elementCustomColors
+        } : themeVars;
+        return `:host { ${buildCssVarString(merged)} }
 ${receiveCss}`;
       });
       const elementWalletAdapter = element.__walletAdapter;
       const elementCallbacks = element.__callbacks;
-      const walletAdapter = elementWalletAdapter ?? defaultWalletAdapter;
-      const callbacks = elementCallbacks ? {
-        ...defaultCallbacks,
-        ...elementCallbacks
-      } : defaultCallbacks;
       return [(() => {
         var _el$2 = _tmpl$();
         setAttribute(_el$2, "nonce", nonce);
@@ -12584,8 +12629,15 @@ ${receiveCss}`;
         get children() {
           return createComponent(ReceiveComponent, {
             config,
-            walletAdapter,
-            callbacks
+            get walletAdapter() {
+              return elementWalletAdapter ?? defaultWalletAdapter();
+            },
+            get callbacks() {
+              return elementCallbacks ? {
+                ...defaultCallbacks(),
+                ...elementCallbacks
+              } : defaultCallbacks();
+            }
           });
         }
       })];