@pollar/react 0.12.0-rc.2 → 0.12.0-rc.5

package/dist/index.mjs

@@ -1,5 +1,5 @@
 'use client';
-import { AUTH_ERROR_CODES, describeRampAction, mergeRampCountries, transactionErrorMessage, WalletType, isPollarApiError, isPollarClient, PollarClient, isInteractiveAuthAdapter, mergeRampSnapshot, toBaseUnits, fromBaseUnits } from '@pollar/core';
+import { AUTH_ERROR_CODES, rampLegTitle, rampRequirementCopy, rampTrustlineAsset, rampWalletStep, rampResolutionText, describeRampAction, rampLegStatus, rampNextApproval, rampOrderStopped, rampOrderReceive, rampRailLabel, rampNoRouteText, rampFieldError, rampFieldValid, rampLegNote, rampStepTitle, rampStepStatusText, rampLegTimeLeft, rampOrderResolutionText, rampCountries, rampQuoteFields, isPollarApiError, transactionErrorMessage, WalletType, isPollarClient, PollarClient, isInteractiveAuthAdapter, rampTrustlineErrorText, toBaseUnits, appUnavailableMessage, cosignRefusalMessage, fromBaseUnits, assertRampStellarSigner } from '@pollar/core';
 import { forwardRef, createContext, useState, useCallback, useEffect, useMemo, useRef, useContext, Component } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { startAuthentication, startRegistration } from '@simplewebauthn/browser';
@@ -999,7 +999,6 @@ var require_QRCode = __commonJS({
 });
 
 // src/constants.ts
-var LOGO_POLLAR = "https://pollar.xyz/assets/logo_pollar.png";
 var LOGO_POLLAR_WORDMARK_ON_LIGHT = "https://www.pollar.xyz/brandkit/pollar-logo-horizontal-on-light.png";
 var LOGO_POLLAR_WORDMARK_ON_DARK = "https://www.pollar.xyz/brandkit/pollar-logo-horizontal-on-dark.png";
 var LOGO_POLLAR_MARK_ON_LIGHT = "https://www.pollar.xyz/brandkit/pollar-mark-on-light.png";
@@ -1029,6 +1028,13 @@ var ModalErrorBoundary = class extends Component {
     return this.props.children;
   }
 };
+function ModalLogo({ logoUrl }) {
+  if (logoUrl) return /* @__PURE__ */ jsx("img", { src: logoUrl, alt: "Logo", className: "pollar-logo" });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("img", { src: LOGO_POLLAR_MARK_ON_LIGHT, alt: "Pollar", className: "pollar-logo pollar-logo-on-light" }),
+    /* @__PURE__ */ jsx("img", { src: LOGO_POLLAR_MARK_ON_DARK, alt: "Pollar", className: "pollar-logo pollar-logo-on-dark" })
+  ] });
+}
 var PollarModalFooter = () => {
   return /* @__PURE__ */ jsxs("div", { className: "pollar-footer", children: [
     /* @__PURE__ */ jsx("span", { className: "pollar-footer-protected", children: "Protected by" }),
@@ -1036,7 +1042,7 @@ var PollarModalFooter = () => {
     /* @__PURE__ */ jsx("img", { src: LOGO_POLLAR_WORDMARK_ON_DARK, alt: "Pollar", className: "pollar-footer-logo pollar-logo-on-dark" }),
     /* @__PURE__ */ jsxs("span", { className: "pollar-footer-version", children: [
       "v",
-      "0.12.0-rc.2"
+      "0.12.0-rc.5"
     ] })
   ] });
 };
@@ -1218,42 +1224,75 @@ function readableTextOn(background) {
   const [r, g, b] = rgb;
   return (0.2126 * r + 0.7152 * g + 0.0722 * b) / 255 > 0.6 ? "#111827" : "#ffffff";
 }
+var PALETTES = {
+  light: {
+    bg: "#ffffff",
+    border: "#e5e7eb",
+    text: "#111827",
+    muted: "#6b7280",
+    "input-bg": "#f9fafb",
+    "error-bg": "#fef2f2",
+    "error-border": "#fecaca",
+    "error-text": "#dc2626",
+    "success-text": "#16a34a"
+  },
+  dark: {
+    bg: "#1a1a1a",
+    border: "#374151",
+    text: "#ffffff",
+    muted: "#9ca3af",
+    "input-bg": "#374151",
+    "error-bg": "#2a1515",
+    "error-border": "#7f1d1d",
+    "error-text": "#f87171",
+    "success-text": "#4ade80"
+  }
+};
+function mix(fg, percent, bg) {
+  return `color-mix(in srgb, ${fg} ${percent}%, ${bg})`;
+}
 function buildModalCssVars(theme, accentColor, overrides = {}, variant = "compact") {
   const isDark = theme === "dark";
-  const textColor = color(overrides.textColor, isDark ? "#ffffff" : "#111827");
+  const palette = isDark ? PALETTES.dark : PALETTES.light;
+  const bg = color(overrides.backgroundColor, "");
+  const text = color(overrides.textColor, "");
+  const pinned = isDark || bg !== "" || text !== "";
   const secondaryBg = color(overrides.buttonColor, "");
-  return {
-    "--pollar-accent": accentColor,
-    "--pollar-bg": color(overrides.backgroundColor, isDark ? "#1a1a1a" : "#ffffff"),
-    "--pollar-border": isDark ? "#374151" : "#e5e7eb",
-    "--pollar-text": textColor,
-    "--pollar-muted": isDark ? "#9ca3af" : "#6b7280",
+  const vars = {
+    "--pollar-brand-accent": accentColor,
     // The primary button is the accent's, straight up; its label follows the
     // accent's luminance so a pale accent doesn't render white-on-white.
-    "--pollar-btn-primary-fg": readableTextOn(accentColor),
-    ...secondaryBg ? {
-      "--pollar-btn-secondary-bg": secondaryBg,
-      "--pollar-btn-secondary-fg": readableTextOn(secondaryBg)
-    } : {},
-    "--pollar-input-bg": isDark ? "#374151" : "#f9fafb",
-    "--pollar-error-bg": isDark ? "#2a1515" : "#fef2f2",
-    "--pollar-error-border": isDark ? "#7f1d1d" : "#fecaca",
-    "--pollar-error-text": isDark ? "#f87171" : "#dc2626",
-    "--pollar-success-text": isDark ? "#4ade80" : "#16a34a",
-    "--pollar-logo-on-light-display": isDark ? "none" : "block",
-    "--pollar-logo-on-dark-display": isDark ? "block" : "none",
-    "--pollar-modal-border-radius": px(overrides.modalBorderRadius, DEFAULT_MODAL_BORDER_RADIUS),
-    "--pollar-buttons-border-radius": px(overrides.buttonBorderRadius, DEFAULT_BUTTON_BORDER_RADIUS),
-    "--pollar-buttons-height": "44px",
-    "--pollar-input-height": "44px",
-    "--pollar-input-border-radius": "0.5rem",
-    "--pollar-card-border-radius": "10px",
-    ...variant === "hero" ? {
-      "--pollar-modal-padding": "2rem",
-      "--pollar-modal-heading-size": "1.375rem",
-      "--pollar-modal-subtitle-size": "0.9rem"
-    } : {}
+    "--pollar-brand-btn-primary-fg": readableTextOn(accentColor),
+    "--pollar-brand-modal-border-radius": px(overrides.modalBorderRadius, DEFAULT_MODAL_BORDER_RADIUS),
+    "--pollar-brand-buttons-border-radius": px(overrides.buttonBorderRadius, DEFAULT_BUTTON_BORDER_RADIUS)
   };
+  if (secondaryBg) {
+    vars["--pollar-brand-btn-secondary-bg"] = secondaryBg;
+    vars["--pollar-brand-btn-secondary-fg"] = readableTextOn(secondaryBg);
+  }
+  if (pinned) {
+    for (const [name, value] of Object.entries(palette)) vars[`--pollar-brand-${name}`] = value;
+    vars["--pollar-brand-logo-on-light-display"] = isDark ? "none" : "block";
+    vars["--pollar-brand-logo-on-dark-display"] = isDark ? "block" : "none";
+  }
+  if (bg || text) {
+    const surface = bg || palette.bg;
+    const ink = text || palette.text;
+    vars["--pollar-brand-bg"] = surface;
+    vars["--pollar-brand-text"] = ink;
+    vars["--pollar-brand-border"] = mix(ink, 14, surface);
+    vars["--pollar-brand-muted"] = mix(ink, 62, surface);
+    vars["--pollar-brand-input-bg"] = mix(ink, 4, surface);
+    const darkSurface = readableTextOn(surface) === "#ffffff";
+    vars["--pollar-brand-logo-on-light-display"] = darkSurface ? "none" : "block";
+    vars["--pollar-brand-logo-on-dark-display"] = darkSurface ? "block" : "none";
+  }
+  if (variant === "hero") {
+    vars["--pollar-brand-modal-padding"] = "2rem";
+    vars["--pollar-brand-modal-heading-size"] = "1.375rem";
+    vars["--pollar-brand-modal-subtitle-size"] = "0.9rem";
+  }
+  return vars;
 }
 function modalChrome(styles) {
   const zIndex = styles.modalZIndex;
@@ -1268,7 +1307,7 @@ function modalChrome(styles) {
       buttonBorderRadius: styles.buttonBorderRadius
     },
     overlayStyle: {
-      "--pollar-overlay-z-index": typeof zIndex === "number" && Number.isFinite(zIndex) ? zIndex : DEFAULT_OVERLAY_Z_INDEX
+      "--pollar-brand-overlay-z-index": typeof zIndex === "number" && Number.isFinite(zIndex) ? zIndex : DEFAULT_OVERLAY_Z_INDEX
     }
   };
 }
@@ -1953,6 +1992,8 @@ function KycModalTemplate({
   reviewReason,
   processing = false,
   isLoading,
+  startingProviderId = null,
+  directOpen = false,
   error,
   onSelectProvider,
   onDoneVerifying,
@@ -1961,6 +2002,7 @@ function KycModalTemplate({
   onClose
 }) {
   const cssVars = buildModalCssVars(theme, accentColor, styleOverrides, "hero");
+  const busy = isLoading || startingProviderId !== null;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -1988,7 +2030,7 @@ function KycModalTemplate({
                 type: "button",
                 className: "pollar-modal-close",
                 onClick: onRefresh,
-                disabled: isLoading,
+                disabled: busy,
                 "aria-label": "Refresh",
                 title: "Refresh providers",
                 children: /* @__PURE__ */ jsx(
@@ -2018,7 +2060,14 @@ function KycModalTemplate({
           ] })
         ] }),
         error && /* @__PURE__ */ jsx("p", { className: "pollar-kyc-error", role: "alert", children: error }),
-        step === "select_provider" && (isLoading && providers.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "pollar-loading-block", children: [
+        step === "select_provider" && (startingProviderId !== null && directOpen ? /* @__PURE__ */ jsxs("div", { className: "pollar-loading-block", "aria-live": "polite", children: [
+          /* @__PURE__ */ jsx("div", { className: "pollar-spinner" }),
+          /* @__PURE__ */ jsxs("span", { children: [
+            "Opening ",
+            selectedProvider?.name ?? "verification",
+            "\u2026"
+          ] })
+        ] }) : isLoading && providers.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "pollar-loading-block", children: [
           /* @__PURE__ */ jsx("div", { className: "pollar-spinner" }),
           /* @__PURE__ */ jsx("span", { children: "Loading providers\u2026" })
         ] }) : /* @__PURE__ */ jsxs("div", { className: "pollar-kyc-providers", children: [
@@ -2028,11 +2077,15 @@ function KycModalTemplate({
             {
               type: "button",
               className: "pollar-kyc-provider-btn",
-              disabled: isLoading,
+              disabled: busy,
+              "aria-busy": startingProviderId === p.id,
               onClick: () => onSelectProvider(p),
               children: [
                 /* @__PURE__ */ jsx("span", { className: "pollar-kyc-provider-name", children: p.name }),
-                /* @__PURE__ */ jsx("span", { className: "pollar-kyc-provider-flow", children: isLoading && selectedProvider?.id === p.id ? "Opening\u2026" : p.flow === "redirect" ? "Continue in a new tab" : "Continue here" })
+                /* @__PURE__ */ jsx("span", { className: "pollar-kyc-provider-flow", children: startingProviderId === p.id ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
+                  "Opening\u2026"
+                ] }) : p.flow === "redirect" ? "Continue in a new tab" : "Continue here" })
               ]
             },
             p.id
@@ -2083,7 +2136,7 @@ function KycModalTemplate({
           /* @__PURE__ */ jsx(KycStatus, { status: kycStatus, ...processing ? { label: "Approved" } : {} }),
           /* @__PURE__ */ jsx("p", { className: "pollar-kyc-result-text", children: kycStatus === "approved" ? "Your identity has been verified successfully." : kycStatus === "rejected" ? "Your verification was not approved. Contact support for the next steps." : kycStatus === "expired" ? "Your verification expired. Start again to verify your identity." : processing ? kycProcessingMessage() : kycReviewMessage(reviewReason) }),
           /* @__PURE__ */ jsxs("div", { className: "pollar-modal-actions", children: [
-            kycStatus === "expired" && onStartAgain && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onStartAgain, disabled: isLoading, children: "Start again" }),
+            kycStatus === "expired" && onStartAgain && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onStartAgain, disabled: busy, children: "Start again" }),
             kycStatus !== "approved" && kycStatus !== "rejected" && kycStatus !== "expired" && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onDoneVerifying, children: "Check again" }),
             /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-primary", onClick: onClose, children: "Close" })
           ] })
@@ -2116,6 +2169,8 @@ function KycModal({
   const [reviewReason, setReviewReason] = useState(null);
   const [processing, setProcessing] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
+  const [startingProviderId, setStartingProviderId] = useState(null);
+  const [directOpen, setDirectOpen] = useState(false);
   const [error, setError] = useState(null);
   const idempotencyKeys = useRef({});
   const autoOpened = useRef(false);
@@ -2143,7 +2198,7 @@ function KycModal({
     starting.current = true;
     setSelectedProvider(provider);
     setError(null);
-    setIsLoading(true);
+    setStartingProviderId(provider.id);
     const key = (_a = idempotencyKeys.current)[_b = provider.id] ?? (_a[_b] = newIdempotencyKey());
     try {
       const result = await client.resolveKyc(
@@ -2181,7 +2236,7 @@ function KycModal({
       setStep("select_provider");
     } finally {
       starting.current = false;
-      setIsLoading(false);
+      setStartingProviderId(null);
     }
   }
   const loadProviders = useCallback(() => {
@@ -2200,6 +2255,7 @@ function KycModal({
     void loadProviders().then((list) => {
       if (!providerId || autoOpened.current) return;
       autoOpened.current = true;
+      setDirectOpen(true);
       const target = list.find((p) => p.id === providerId);
       if (target) void handleSelectProvider(target);
       else
@@ -2249,6 +2305,8 @@ function KycModal({
       reviewReason,
       processing,
       isLoading,
+      startingProviderId,
+      directOpen,
       error,
       onSelectProvider: handleSelectProvider,
       onDoneVerifying: handleDoneVerifying,
@@ -2938,7 +2996,7 @@ function LoginModalTemplate({
       }
     ) }),
     /* @__PURE__ */ jsxs("div", { className: "pollar-header", children: [
-      /* @__PURE__ */ jsx("div", { className: "pollar-logo-wrap", children: /* @__PURE__ */ jsx("img", { src: logoUrl ?? LOGO_POLLAR, alt: "Logo", className: "pollar-logo" }) }),
+      /* @__PURE__ */ jsx("div", { className: "pollar-logo-wrap", children: /* @__PURE__ */ jsx(ModalLogo, { logoUrl }) }),
       /* @__PURE__ */ jsx("h2", { className: "pollar-title", children: appName }),
       /* @__PURE__ */ jsx("p", { className: "pollar-subtitle", children: "Log in or sign up" })
     ] }),
@@ -3104,7 +3162,7 @@ function LoginModalStatus({
       }
     ) }),
     /* @__PURE__ */ jsxs("div", { className: "pollar-header", children: [
-      /* @__PURE__ */ jsx("div", { className: "pollar-logo-wrap", children: /* @__PURE__ */ jsx("img", { src: logoUrl ?? LOGO_POLLAR, alt: "Logo", className: "pollar-logo" }) }),
+      /* @__PURE__ */ jsx("div", { className: "pollar-logo-wrap", children: /* @__PURE__ */ jsx(ModalLogo, { logoUrl }) }),
       /* @__PURE__ */ jsx("h2", { className: "pollar-title", children: appName }),
       /* @__PURE__ */ jsx("p", { className: "pollar-subtitle", children: "Log in or sign up" })
     ] }),
@@ -3206,7 +3264,7 @@ function PrivyLoginSubmodal({
       }
     ) }),
     /* @__PURE__ */ jsxs("div", { className: "pollar-header", children: [
-      /* @__PURE__ */ jsx("div", { className: "pollar-logo-wrap", children: /* @__PURE__ */ jsx("img", { src: logoUrl ?? LOGO_POLLAR, alt: "Logo", className: "pollar-logo" }) }),
+      /* @__PURE__ */ jsx("div", { className: "pollar-logo-wrap", children: /* @__PURE__ */ jsx(ModalLogo, { logoUrl }) }),
       /* @__PURE__ */ jsx("h2", { className: "pollar-title", children: appName }),
       /* @__PURE__ */ jsx("p", { className: "pollar-subtitle", children: adapter.meta.label })
     ] }),
@@ -3407,256 +3465,45 @@ function LoginModal({ onClose }) {
     }
   ) });
 }
-
-// src/lib/qr-code/index.tsx
-var import_ErrorCorrectLevel = __toESM(require_ErrorCorrectLevel());
-var import_QRCode = __toESM(require_QRCode());
-var QRCodeSvg = forwardRef(function QRCodeSvg2({ bgColor, bgD, fgD, fgColor, size, title, viewBoxSize, xmlns = "http://www.w3.org/2000/svg", ...props }, ref) {
-  return /* @__PURE__ */ jsxs("svg", { ...props, height: size, ref, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: size, xmlns, children: [
-    title ? /* @__PURE__ */ jsx("title", { children: title }) : null,
-    /* @__PURE__ */ jsx("path", { d: bgD, fill: bgColor }),
-    /* @__PURE__ */ jsx("path", { d: fgD, fill: fgColor })
-  ] });
-});
-QRCodeSvg.displayName = "QRCodeSvg";
-function bytesToBinaryString(bytes) {
-  return bytes.map((b) => String.fromCharCode(b & 255)).join("");
-}
-function encodeStringToUtf8Bytes(input) {
-  return Array.from(new TextEncoder().encode(input));
-}
-var QRCode = forwardRef(function QRCode2({ bgColor = "#FFFFFF", fgColor = "#000000", level = "L", size = 256, value, ...props }, ref) {
-  const qrcode = new import_QRCode.default(-1, import_ErrorCorrectLevel.default[level]);
-  const utf8Bytes = encodeStringToUtf8Bytes(value);
-  const binaryString = bytesToBinaryString(utf8Bytes);
-  qrcode.addData(binaryString, "Byte");
-  qrcode.make();
-  const cells = qrcode.modules;
-  return /* @__PURE__ */ jsx(
-    QRCodeSvg,
-    {
-      ...props,
-      bgColor,
-      bgD: cells.map(
-        (row, rowIndex) => row.map((cell, cellIndex) => !cell ? `M ${cellIndex} ${rowIndex} l 1 0 0 1 -1 0 Z` : "").join(" ")
-      ).join(" "),
-      fgColor,
-      fgD: cells.map(
-        (row, rowIndex) => row.map((cell, cellIndex) => cell ? `M ${cellIndex} ${rowIndex} l 1 0 0 1 -1 0 Z` : "").join(" ")
-      ).join(" "),
-      ref,
-      size,
-      viewBoxSize: cells.length
-    }
-  );
-});
-function RampWorkflow({
-  client,
-  snapshot,
-  onChange,
-  onBusyChange
-}) {
-  const model = describeRampAction(snapshot);
-  const locked = useRef(false);
-  useEffect(() => {
-    setFields({});
-    setError(null);
-  }, [model.action?.actionId]);
-  const [busy, setBusy] = useState(false);
-  const [error, setError] = useState(null);
-  const [fields, setFields] = useState({});
-  const fieldsComplete = model.action?.kind !== "collect_information" || model.action.fields.every((field) => {
-    const value = (fields[field.key] ?? "").trim();
-    if (!value) return field.optional;
-    if (field.type === "email") return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
-    return field.type !== "select" || field.options?.some((option) => option.value === value);
+function findWalletBalance(balances, asset) {
+  const { issuer } = asset;
+  return balances.find((b) => {
+    if (resolveChain(b.chain) !== asset.chain) return false;
+    if (issuer === null) return b.type === "native" || !b.issuer && b.code === asset.code;
+    if (b.code !== asset.code) return false;
+    return issuer === void 0 || !b.issuer || b.issuer.toLowerCase() === issuer.toLowerCase();
   });
-  async function continueAction() {
-    if (!model.action || locked.current || !fieldsComplete) return;
-    locked.current = true;
-    setBusy(true);
-    onBusyChange?.(true);
-    setError(null);
-    try {
-      onChange(
-        model.canSign ? await client.signRampAction(snapshot.txId, snapshot) : await client.continueRamp(snapshot.txId, {
-          actionId: model.action.actionId,
-          transactionVersion: snapshot.transactionVersion,
-          ...model.action.kind === "collect_information" ? { fields } : {}
-        })
-      );
-    } catch (e) {
-      setError(e instanceof Error ? e.message : "Unable to continue.");
-    } finally {
-      locked.current = false;
-      setBusy(false);
-      onBusyChange?.(false);
-    }
-  }
-  return /* @__PURE__ */ jsxs(
-    "section",
-    {
-      className: "pollar-ramp-payment pollar-ramp-workflow",
-      "aria-label": "Ramp progress",
-      "aria-live": "polite",
-      "aria-busy": busy,
-      children: [
-        /* @__PURE__ */ jsx("h3", { className: "pollar-ramp-payment-title", children: model.title }),
-        snapshot.terms && /* @__PURE__ */ jsxs("p", { className: "pollar-ramp-terms", children: [
-          snapshot.terms.fiatAmount,
-          " ",
-          snapshot.terms.fiatCurrency,
-          " \xB7 ",
-          snapshot.terms.cryptoAmount,
-          " ",
-          snapshot.terms.assetCode,
-          /* @__PURE__ */ jsx("br", {}),
-          "Includes ",
-          snapshot.terms.feeAmount,
-          " ",
-          snapshot.terms.feeCurrency,
-          " fee"
-        ] }),
-        model.details.map((item, index) => /* @__PURE__ */ jsxs("p", { className: "pollar-ramp-workflow-detail", children: [
-          /* @__PURE__ */ jsxs("strong", { children: [
-            item.label,
-            ": "
-          ] }),
-          item.value
-        ] }, index)),
-        model.links.map((link, index) => /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx("a", { className: "pollar-btn-primary pollar-ramp-hosted-link", href: link.url, target: "_blank", rel: "noopener noreferrer", children: link.label }) }, index)),
-        model.qr && /* @__PURE__ */ jsx(QRCode, { value: model.qr, size: 180 }),
-        model.qr && /* @__PURE__ */ jsx(
-          "button",
-          {
-            className: "pollar-btn-secondary",
-            type: "button",
-            onClick: () => void navigator.clipboard.writeText(model.qr).catch(() => setError("Unable to copy. Select the payment code to copy it manually.")),
-            children: "Copy payment code"
-          }
-        ),
-        model.action?.kind === "collect_information" && model.action.fields.map((field) => /* @__PURE__ */ jsxs("label", { className: "pollar-ramp-field", children: [
-          /* @__PURE__ */ jsxs("span", { className: "pollar-ramp-label", children: [
-            field.label,
-            field.optional ? " (optional)" : ""
-          ] }),
-          field.type === "select" ? /* @__PURE__ */ jsxs(
-            "select",
-            {
-              className: "pollar-ramp-input",
-              disabled: busy,
-              value: fields[field.key] ?? "",
-              onChange: (e) => setFields((previous) => ({ ...previous, [field.key]: e.target.value })),
-              children: [
-                /* @__PURE__ */ jsx("option", { value: "", children: "Choose" }),
-                field.options?.map((option) => /* @__PURE__ */ jsx("option", { value: option.value, children: option.label }, option.value))
-              ]
-            }
-          ) : /* @__PURE__ */ jsx(
-            "input",
-            {
-              className: "pollar-ramp-input",
-              disabled: busy,
-              type: field.type,
-              placeholder: field.placeholder,
-              value: fields[field.key] ?? "",
-              onChange: (e) => setFields((previous) => ({ ...previous, [field.key]: e.target.value }))
-            }
-          ),
-          field.hint && /* @__PURE__ */ jsx("small", { className: "pollar-ramp-field-hint", children: field.hint })
-        ] }, field.key)),
-        (model.canContinue || model.canSign) && /* @__PURE__ */ jsx(
-          "button",
-          {
-            className: "pollar-btn-primary",
-            type: "button",
-            disabled: busy || !fieldsComplete,
-            onClick: () => void continueAction(),
-            children: busy ? model.canSign ? "Waiting for your wallet\u2026" : "Continuing\u2026" : model.canSign ? "Authorize" : "Continue"
-          }
-        ),
-        snapshot.milestones?.map((milestone, index) => /* @__PURE__ */ jsxs("p", { children: [
-          milestone.kind.replace(/_/g, " "),
-          " \xB7 ",
-          milestone.verifiedAt
-        ] }, index)),
-        error && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-field-error", role: "alert", children: error }),
-        /* @__PURE__ */ jsxs("small", { className: "pollar-ramp-reference", children: [
-          "Reference: ",
-          snapshot.txId
-        ] })
-      ]
-    }
-  );
-}
-
-// src/components/ramp-widget/ramp-kyc.ts
-var nonEmpty = (value) => typeof value === "string" && !!value.trim();
-function requiredRampKyc(error) {
-  if (!error || typeof error !== "object") return null;
-  if (!("code" in error) || error.code !== "SDK_RAMPS_KYC_REQUIRED") return null;
-  const body = "body" in error ? error.body : void 0;
-  if (typeof body !== "object" || body === null) return null;
-  const rampProviderId = "rampProviderId" in body ? body.rampProviderId : void 0;
-  const corridorId = "corridorId" in body ? body.corridorId : void 0;
-  const requirementType = "requirementType" in body ? body.requirementType : void 0;
-  const optionId = "optionId" in body ? body.optionId : void 0;
-  const kycProviderId = "kycProviderId" in body ? body.kycProviderId : void 0;
-  if (!nonEmpty(rampProviderId) || !nonEmpty(corridorId)) return null;
-  if ((requirementType === "FORM" || requirementType === "REGISTRY_CHECK" || requirementType === "PROVIDER_REGISTRATION") && nonEmpty(optionId)) {
-    return { rampProviderId, corridorId, type: requirementType, optionId };
-  }
-  const kyc = nonEmpty(optionId) && requirementType === "KYC" ? optionId : kycProviderId;
-  return nonEmpty(kyc) ? { rampProviderId, corridorId, type: "KYC", optionId: kyc } : null;
-}
-function pendingFromQuote(requirement) {
-  return {
-    rampProviderId: requirement.rampProviderId,
-    corridorId: requirement.corridorId,
-    type: requirement.type,
-    optionId: requirement.optionId,
-    progress: { position: requirement.completed + 1, total: requirement.total }
-  };
-}
-function lockedRouteCopy(requirement) {
-  if (requirement.type === "FORM") return { message: "Answer a few questions to see this route", action: "Continue" };
-  if (requirement.type === "PROVIDER_REGISTRATION") {
-    return { message: "Register with the provider to see this route", action: "Continue" };
-  }
-  if (requirement.type === "REGISTRY_CHECK") {
-    return requirement.status === "pending" ? { message: "Your details are under review", action: null } : { message: "Confirm your details to see this route", action: "Confirm" };
-  }
-  switch (requirement.status) {
-    case "expired":
-      return { message: "Your verification expired", action: "Verify again" };
-    case "pending":
-      if (!requirement.reviewReason) return { message: "Verification in progress", action: "Continue" };
-      return {
-        message: requirement.reviewReason === "DUPLICATE_DOCUMENT" ? kycReviewMessage(requirement.reviewReason) : "Your verification is under review",
-        action: null
-      };
-    case "rejected":
-      return { message: "Verification was not approved", action: null };
-    default:
-      return { message: "Verify your identity to see this route", action: "Verify" };
-  }
 }
-var RAIL_LABELS = {
-  SPEI: "SPEI (Mexico)",
-  PIX: "PIX (Brazil)",
-  PSE: "PSE (Colombia)",
-  ACH: "ACH (US)"
-};
-function RouteDisplay({ quote, busy = false, disabled = false, onSelect }) {
+function useWalletAvailable(asset) {
+  const { walletBalance, refreshWalletBalance } = usePollar();
+  const wanted = !!asset;
+  useEffect(() => {
+    if (wanted && walletBalance.step === "idle") void refreshWalletBalance();
+  }, [wanted, walletBalance.step, refreshWalletBalance]);
+  if (!asset || walletBalance.step !== "loaded") return void 0;
+  const record = findWalletBalance(walletBalance.data.balances, asset);
+  return record ? record.available : "0";
+}
+var CUSTODY_LABEL = { COSIGNED: "co-signed", SELF_CUSTODY: "self-custody" };
+var assetOf = (node) => node.kind === "fiat" ? node.currency : node.code;
+function etaText(seconds) {
+  if (seconds === null) return null;
+  if (seconds < 90) return `~${Math.max(1, Math.round(seconds))} s`;
+  if (seconds < 5400) return `~${Math.round(seconds / 60)} min`;
+  return `~${Math.round(seconds / 3600)} h`;
+}
+function RouteDisplay({ quote, best = false, busy = false, disabled = false, onSelect }) {
   const inert = busy || disabled;
   const select = () => {
     if (!inert) onSelect(quote);
   };
+  const first = quote.legs[0];
+  const last = quote.legs[quote.legs.length - 1];
   return /* @__PURE__ */ jsxs(
     "div",
     {
       className: "pollar-ramp-route-card",
-      "data-recommended": quote.recommended,
+      "data-recommended": best,
       "data-busy": busy || void 0,
       "data-disabled": disabled || void 0,
       role: "button",
@@ -3667,55 +3514,152 @@ function RouteDisplay({ quote, busy = false, disabled = false, onSelect }) {
       onKeyDown: (e) => e.key === "Enter" && select(),
       children: [
         /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-route-left", children: [
-          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-provider", children: quote.provider }),
-          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-meta", children: busy ? "Starting\u2026" : [
-            quote.route ? `${quote.route.asset.code} on ${quote.route.asset.chain}` : null,
-            RAIL_LABELS[quote.rail] ?? quote.rail,
-            quote.estimatedTime
-          ].filter(Boolean).join(" \xB7 ") })
+          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-provider", children: first && last ? `${quote.amountIn} ${assetOf(first.from)} \u2192 ~${quote.amountOut} ${assetOf(last.to)}` : `~${quote.amountOut}` }),
+          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-meta", children: busy ? "Starting\u2026" : [quote.legs.map((leg) => rampLegTitle(leg)).join(" \xB7 "), etaText(quote.etaSeconds)].filter(Boolean).join(" \xB7 ") })
         ] }),
         /* @__PURE__ */ jsx("div", { className: "pollar-ramp-route-right", children: busy ? /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-fee", children: quote.terms ? `${quote.terms.fiatAmount} ${quote.terms.fiatCurrency} \xB7 ${quote.terms.cryptoAmount} ${quote.terms.assetCode} \xB7 Includes ${quote.terms.feeAmount} ${quote.terms.feeCurrency}` : `${quote.fee}% fee` }),
-          quote.recommended && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-badge", children: "Best rate" })
+          /* @__PURE__ */ jsxs("span", { className: "pollar-ramp-route-fee", children: [
+            quote.legs.length === 1 ? "1 step" : `${quote.legs.length} steps`,
+            " \xB7 fees included"
+          ] }),
+          best && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-badge", children: "Best rate" })
         ] }) })
       ]
     }
   );
 }
-function LockedRouteDisplay({ requirement, disabled = false, onVerify }) {
-  const { message, action } = lockedRouteCopy(requirement);
+function RejectedRouteDisplay({
+  rejection,
+  disabled = false,
+  trusting = false,
+  walletBusy = false,
+  custodyChoice = false,
+  onVerify,
+  onTrust,
+  onWalletStep
+}) {
+  const requirement = rejection.requirement;
+  const copy = requirement ? rampRequirementCopy(requirement) : null;
+  const trustAsset = !requirement && onTrust ? rampTrustlineAsset(rejection) : null;
+  const step = !requirement ? rampWalletStep(rejection) : null;
+  const fromMenu = step?.action === "create_wallet" && custodyChoice;
+  const walletStep = onWalletStep && !fromMenu ? step : null;
+  const picks = custodyChoice && step?.action !== "set_up_recovery" ? ["COSIGNED", "SELF_CUSTODY"] : [void 0];
+  const meta = copy ? copy.message : fromMenu ? "You need a wallet to receive this. Create it from the wallet menu, then find the route again." : rampResolutionText(rejection.failure);
+  const busy = trusting || !!walletStep && walletBusy;
   return /* @__PURE__ */ jsxs(
     "div",
     {
       className: "pollar-ramp-route-card",
       "data-locked": true,
-      "data-kyc-status": requirement.status,
-      "data-disabled": disabled || void 0,
+      "data-kyc-status": requirement?.status,
+      "data-disabled": !(copy?.action && onVerify) && !trustAsset && !walletStep || disabled && !busy || void 0,
       children: [
         /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-route-left", children: [
-          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-provider", children: requirement.provider }),
-          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-meta", children: message })
+          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-provider", children: rejection.legs.map((leg) => rampLegTitle(leg)).join(" \xB7 ") }),
+          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-route-meta", children: meta })
         ] }),
-        action && /* @__PURE__ */ jsx("div", { className: "pollar-ramp-route-right", children: /* @__PURE__ */ jsx(
+        trustAsset && /* @__PURE__ */ jsx("div", { className: "pollar-ramp-route-right", children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "pollar-btn-secondary pollar-ramp-route-verify",
+            disabled,
+            "aria-busy": trusting,
+            onClick: () => onTrust(trustAsset),
+            children: trusting ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
+              " Adding\u2026"
+            ] }) : `Add ${trustAsset.code} trustline`
+          }
+        ) }),
+        walletStep && /* @__PURE__ */ jsx("div", { className: "pollar-ramp-route-right", children: walletBusy ? /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-btn-secondary pollar-ramp-route-verify", disabled: true, "aria-busy": true, children: [
+          /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
+          " ",
+          walletStep.busyLabel
+        ] }) : picks.map((custody) => /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "pollar-btn-secondary pollar-ramp-route-verify",
+            disabled,
+            onClick: () => onWalletStep(walletStep, custody),
+            children: custody ? `${walletStep.label} (${CUSTODY_LABEL[custody]})` : walletStep.label
+          },
+          custody ?? "app"
+        )) }),
+        requirement && copy?.action && onVerify && /* @__PURE__ */ jsx("div", { className: "pollar-ramp-route-right", children: /* @__PURE__ */ jsx(
           "button",
           {
             type: "button",
             className: "pollar-btn-secondary pollar-ramp-route-verify",
             disabled,
             onClick: () => onVerify(requirement),
-            children: action
+            children: copy.action
           }
         ) })
       ]
     }
   );
 }
-var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-function isFieldValid(spec, raw) {
-  const value = (raw ?? "").trim();
-  if (!value) return spec.optional === true;
-  if (spec.type === "email") return EMAIL_RE.test(value);
-  return true;
+function formatAvailable(available) {
+  if (available === null) return "\u2014";
+  const n = parseFloat(available);
+  return isNaN(n) ? available : n.toLocaleString(void 0, { maximumFractionDigits: 7 });
+}
+function AmountField({
+  id,
+  label,
+  value,
+  onChange,
+  unit,
+  available,
+  onMax,
+  placeholder = "0.00",
+  disabled = false
+}) {
+  const showBalance = available !== void 0;
+  const canMax = showBalance && available !== null && parseFloat(available) > 0 && !disabled;
+  return /* @__PURE__ */ jsxs("div", { className: "pollar-send-field", children: [
+    /* @__PURE__ */ jsxs("div", { className: "pollar-send-label-row", children: [
+      /* @__PURE__ */ jsx("label", { className: "pollar-send-label", htmlFor: id, children: label }),
+      showBalance && /* @__PURE__ */ jsxs("span", { className: "pollar-send-hint", children: [
+        "Available: ",
+        formatAvailable(available),
+        " ",
+        unit ?? ""
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "pollar-send-input-shell", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          id,
+          className: "pollar-input pollar-send-amount-input",
+          type: "text",
+          inputMode: "decimal",
+          placeholder,
+          value,
+          disabled,
+          onChange: (e) => onChange(e.target.value),
+          "aria-label": id ? void 0 : label
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "pollar-send-input-suffix", children: [
+        showBalance && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "pollar-send-inline-action",
+            disabled: !canMax,
+            onClick: () => onMax ? onMax() : available && onChange(available),
+            children: "Max"
+          }
+        ),
+        unit && /* @__PURE__ */ jsx("span", { children: unit })
+      ] })
+    ] })
+  ] });
 }
 function scannableImageSrc(image) {
   return image.encoding === "base64" ? `data:${image.mediaType};base64,${image.data}` : `data:${image.mediaType};charset=utf-8,${encodeURIComponent(image.data)}`;
@@ -3734,109 +3678,143 @@ function placeholderFor(field, fields, values) {
   }
   return field.placeholder;
 }
-var CHAIN_NAME = { STELLAR: "Stellar", POLYGON: "Polygon", SOLANA: "Solana" };
-var EXPLORER_NAME = { STELLAR: "Stellar Expert", POLYGON: "Polygonscan", SOLANA: "Solana Explorer" };
-var LOADING_STEPS = ["Detecting your country\u2026", "Consulting providers\u2026", "Route found!"];
 function flagEmoji(code) {
   const cc = code.trim().toUpperCase();
   if (!/^[A-Z]{2}$/.test(cc)) return "";
   const base = 127462;
   return String.fromCodePoint(base + (cc.charCodeAt(0) - 65), base + (cc.charCodeAt(1) - 65));
 }
-var STATUS_LABEL = {
-  pending: "Pending",
-  processing: "Processing",
-  completed: "Completed",
-  failed: "Failed"
-};
-function displayValue(field) {
-  if (field.type !== "datetime") return field.value;
-  const at = new Date(field.value);
-  return Number.isNaN(at.getTime()) ? field.value : at.toLocaleString();
+var CHAIN_NAME = { STELLAR: "Stellar", POLYGON: "Polygon", SOLANA: "Solana" };
+function explorerTxUrl2(chain, hash, network) {
+  const testnet = network === "testnet";
+  if (chain === "SOLANA") return `https://explorer.solana.com/tx/${hash}${testnet ? "?cluster=devnet" : ""}`;
+  if (chain === "POLYGON") return `https://${testnet ? "amoy." : ""}polygonscan.com/tx/${hash}`;
+  return `https://stellar.expert/explorer/${testnet ? "testnet" : "public"}/tx/${hash}`;
+}
+function legChain(leg) {
+  if (leg.from.kind === "asset") return leg.from.chain;
+  return leg.to.kind === "asset" ? leg.to.chain : "STELLAR";
+}
+function stepChain(kind, leg) {
+  if (kind === "mint" && leg.to.kind === "asset") return leg.to.chain;
+  return legChain(leg);
+}
+var timeLeftText = (seconds) => seconds <= 0 ? "Taking a little longer than usual" : seconds < 60 ? `About ${seconds}s left` : `About ${Math.ceil(seconds / 60)} min left`;
+function useNowEverySecond(running) {
+  const [now, setNow] = useState(() => Date.now());
+  useEffect(() => {
+    if (!running) return;
+    const timer = setInterval(() => setNow(Date.now()), 1e3);
+    return () => clearInterval(timer);
+  }, [running]);
+  return now;
+}
+var fiatKey = (fiat) => `${fiat.currency}:${fiat.rail}`;
+var assetKey3 = (asset) => `${asset.code}:${asset.chain}:${asset.identifier ?? ""}`;
+function trustKey(rejection) {
+  const asset = rampTrustlineAsset(rejection);
+  return asset ? `${asset.code}:${asset.issuer}` : null;
+}
+var LOADING_STEPS = ["Checking routes\u2026", "Quoting each step\u2026", "Route found!"];
+function useRenderAt(at) {
+  const [, setTick] = useState(0);
+  useEffect(() => {
+    if (at === null) return;
+    const timer = setTimeout(() => setTick((n) => n + 1), Math.max(0, at - Date.now()) + 50);
+    return () => clearTimeout(timer);
+  }, [at]);
 }
 function RampWidgetTemplate({
-  workflowContent,
-  routeSelector,
   theme,
   accentColor,
   styleOverrides,
+  network,
   step,
   flowSteps,
   flowStepIndex,
-  startingQuoteId,
   direction,
-  amount,
-  currency,
-  country,
-  requiredFields,
-  fieldValues,
+  routesLoading,
   countries,
-  countriesLoading,
-  refreshing,
+  country,
+  fiats,
+  fiat,
+  assets,
+  asset,
+  amount,
+  sellAvailable,
   quotes,
-  kycRequired,
+  rejected,
+  startingQuoteId,
+  fields,
+  fieldValues,
+  order,
+  pendingOrders,
   isLoading,
-  provider,
-  txStatus,
-  kycUrl,
-  tosUrl,
-  kycBlocking,
-  onboardingStatus,
-  kycJustApproved,
-  stellarTxHash,
-  txHash,
-  txChain,
-  explorerUrl,
-  fundsInTransit = false,
-  retrying = false,
-  onRetryTransit,
-  depositInstructions,
-  canComplete,
-  completing,
-  savedRamps = [],
-  onResumeRamp,
-  onDismissRamp,
-  onDismissCurrentRamp,
-  onExploreRoutes,
+  refreshing,
+  signing,
   errorMsg,
-  noticeMsg,
+  notice = null,
   onDirectionChange,
-  onAmountChange,
-  onFieldChange,
   onCountryChange,
+  onFiatChange,
+  onAssetChange,
+  onAmountChange,
   onFindRoute,
   onSelectQuote,
   onVerifyRoute,
+  trustingAsset = null,
+  onTrustAsset,
+  walletBusy = null,
+  custodyChoice = false,
+  onWalletStep,
+  noChains = false,
+  retrying = false,
+  onRetryOrder,
+  onSetUpRecovery,
+  recoveryMissing = null,
+  checkingPayment = false,
+  onCheckPayment,
+  pollTrouble = false,
+  onFieldChange,
   onContactContinue,
-  onOpenKyc,
-  onOpenTos,
-  onCompleteWithdraw,
+  onSign,
+  onApprove,
+  onResumeOrder,
+  onNewOrder,
   onBack,
+  onStepSelect,
   onRetry,
   onRefresh,
   onClose
 }) {
-  const settledHash = txHash ?? stellarTxHash;
-  const chainName = CHAIN_NAME[txChain ?? "STELLAR"];
   const cssVars = buildModalCssVars(theme, accentColor, styleOverrides, "hero");
+  const onramp = direction === "ONRAMP";
+  const sendUnit = onramp ? fiat?.currency : asset?.code;
+  const view = order ? describeRampAction(order) : null;
+  const settled = order ? ["completed", "failed", "refunded"].includes(order.state) : false;
+  const running = order?.legs.find((leg) => rampLegStatus(leg) === "active" && order.pendingAction?.legIndex !== leg.index);
+  const now = useNowEverySecond(step === "status" && !settled && !!running && running.etaSeconds !== null);
+  const nextApproval = order && !settled ? rampNextApproval(order) : null;
+  const stopped = order ? rampOrderStopped(order) : false;
+  const receive = order ? rampOrderReceive(order) : null;
+  const waitsOnRecovery = order?.failure?.resolutionAction === "set_up_recovery";
+  const payBy = view?.action?.kind === "FIAT_PAYMENT" && view.expiresAt ? Date.parse(view.expiresAt) : null;
+  useRenderAt(view?.canSign && view.expiresAt ? Date.parse(view.expiresAt) : null);
+  const stepsOpen = !!onStepSelect && step !== "status" && !isLoading && startingQuoteId === null && trustingAsset === null && walletBusy === null;
   const stepTitle = {
-    input: direction === "onramp" ? "Buy crypto" : "Sell crypto",
-    loading_quote: "Finding best route",
-    select_route: "Select provider",
+    input: onramp ? "Buy crypto" : "Sell crypto",
+    loading_quote: "Finding the best route",
+    select_route: "Choose a route",
     contact: "Your details",
-    status: direction === "onramp" ? "Complete your deposit" : "Complete your withdrawal",
+    status: order?.state === "completed" ? "Transfer completed" : onramp ? "Your purchase" : "Your sale",
     error: "Something went wrong"
   };
   const stepSubtitle = {
-    input: direction === "onramp" ? "Enter the amount you want to deposit" : "Enter the amount you want to withdraw",
-    loading_quote: "Comparing providers in real time\u2026",
-    select_route: "All prices include fees",
-    // What this step actually asks for is whatever the route declared, and that
-    // is rarely a name and an email: an Abroad off-ramp asks where to send the
-    // money, not who you are. Say which, rather than asserting the Bridge case
-    // over every provider.
-    contact: `${provider || "This provider"} needs ${listOf(requiredFields.filter((f) => !f.optional).map((f) => f.label.toLowerCase()))} to continue`,
-    status: workflowContent ? "Follow the next step below to continue" : `Finish the flow at ${provider || "the provider"} to continue`,
+    input: onramp ? "Pick what you receive and how much you pay" : "Pick what you sell and how much",
+    loading_quote: "Comparing routes in real time\u2026",
+    select_route: "All amounts include fees",
+    contact: `This route needs ${listOf(fields.filter((f) => !f.optional).map((f) => f.label.toLowerCase()))} to continue`,
+    status: view?.title ?? "Processing",
     error: "Please try again"
   };
   return /* @__PURE__ */ jsxs("div", { className: "pollar-modal-card pollar-ramp-modal", style: cssVars, onClick: (e) => e.stopPropagation(), children: [
@@ -3877,128 +3855,124 @@ function RampWidgetTemplate({
         " of ",
         flowSteps.length
       ] }),
-      /* @__PURE__ */ jsx(
-        "div",
+      /* @__PURE__ */ jsx("ol", { className: "pollar-ramp-steps-track", children: flowSteps.map((label, i) => /* @__PURE__ */ jsx("li", { className: "pollar-ramp-steps-item", "aria-current": i === flowStepIndex ? "step" : void 0, children: /* @__PURE__ */ jsxs(
+        "button",
         {
-          className: "pollar-ramp-steps-track",
-          role: "progressbar",
-          "aria-valuenow": flowStepIndex + 1,
-          "aria-valuemin": 1,
-          "aria-valuemax": flowSteps.length,
-          "aria-label": flowSteps[flowStepIndex],
-          children: flowSteps.map((label, i) => /* @__PURE__ */ jsx("span", { className: "pollar-ramp-steps-segment", "data-done": i <= flowStepIndex || void 0 }, label))
+          type: "button",
+          className: "pollar-ramp-steps-step",
+          "data-done": i <= flowStepIndex || void 0,
+          disabled: !stepsOpen || i >= flowStepIndex,
+          onClick: () => onStepSelect?.(label),
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "pollar-ramp-steps-segment" }),
+            /* @__PURE__ */ jsx("span", { className: "pollar-ramp-steps-name", children: label })
+          ]
         }
-      )
+      ) }, label)) })
     ] }),
-    step === "input" && savedRamps.length > 0 && /* @__PURE__ */ jsxs("section", { className: "pollar-ramp-payment pollar-ramp-saved", "aria-label": "Pending operations", children: [
-      /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "Your pending operations are saved. Starting another route does not cancel them." }),
-      savedRamps.map((ramp) => /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-saved-row", children: [
-        /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            className: "pollar-btn-secondary",
-            disabled: isLoading,
-            onClick: () => onResumeRamp?.(ramp.txId),
-            children: [
-              "Resume ",
-              ramp.provider,
-              " \xB7 ",
-              ramp.txId.slice(-8)
-            ]
-          }
-        ),
-        onDismissRamp && /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: "pollar-btn-secondary",
-            disabled: isLoading,
-            "aria-label": `Remove ${ramp.provider} ${ramp.txId.slice(-8)} from pending list`,
-            onClick: () => onDismissRamp(ramp.txId),
-            children: "Remove"
-          }
-        )
-      ] }, ramp.txId))
+    step === "input" && pendingOrders.length > 0 && /* @__PURE__ */ jsxs("section", { className: "pollar-ramp-payment pollar-ramp-saved", "aria-label": "Pending operations", children: [
+      /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "These operations are waiting for you. Starting another does not cancel them." }),
+      pendingOrders.map((pending) => /* @__PURE__ */ jsx("div", { className: "pollar-ramp-saved-row", children: /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          className: "pollar-btn-secondary",
+          disabled: isLoading,
+          onClick: () => onResumeOrder(pending.id),
+          children: [
+            "Resume ",
+            pending.direction === "ONRAMP" ? "purchase" : "sale",
+            " \xB7 ",
+            pending.id.slice(-8)
+          ]
+        }
+      ) }, pending.id))
     ] }),
     step === "input" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      noticeMsg && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", role: "status", children: noticeMsg }),
       /* @__PURE__ */ jsxs("div", { className: "pollar-tabs", children: [
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: "pollar-tab",
-            "data-active": direction === "onramp",
-            onClick: () => onDirectionChange("onramp"),
-            children: "Buy"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: "pollar-tab",
-            "data-active": direction === "offramp",
-            onClick: () => onDirectionChange("offramp"),
-            children: "Sell"
-          }
-        )
+        /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-tab", "data-active": onramp, onClick: () => onDirectionChange("ONRAMP"), children: "Buy" }),
+        /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-tab", "data-active": !onramp, onClick: () => onDirectionChange("OFFRAMP"), children: "Sell" })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
-        /* @__PURE__ */ jsx("label", { className: "pollar-ramp-label", htmlFor: "pollar-ramp-country", children: "Country" }),
-        countriesLoading ? /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-input pollar-select-loading", children: [
-          /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
-          /* @__PURE__ */ jsx("span", { children: "Loading countries\u2026" })
-        ] }) : countries.length === 0 ? /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: "No ramp providers available on this network yet." }) : /* @__PURE__ */ jsx(
-          "select",
-          {
-            id: "pollar-ramp-country",
-            className: "pollar-ramp-input",
-            value: country,
-            onChange: (e) => onCountryChange(e.target.value),
-            children: countries.map((c) => /* @__PURE__ */ jsxs("option", { value: c.code, children: [
-              flagEmoji(c.code),
-              " ",
-              c.code,
-              c.currency ? ` \u2014 ${c.currency}` : ""
-            ] }, c.code))
-          }
-        )
-      ] }),
-      routeSelector,
-      /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
-        /* @__PURE__ */ jsxs("label", { className: "pollar-ramp-label", htmlFor: "pollar-ramp-amount", children: [
-          "Amount",
-          currency ? ` (${currency})` : ""
+      routesLoading ? /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-input pollar-select-loading", children: [
+        /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
+        /* @__PURE__ */ jsx("span", { children: "Loading routes\u2026" })
+      ] }) : countries.length === 0 ? /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: noChains ? "This app has no chains enabled, so there is nothing to buy or sell yet." : "No ramp routes are available for this app yet." }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
+          /* @__PURE__ */ jsx("label", { className: "pollar-ramp-label", htmlFor: "pollar-ramp-country", children: "Country" }),
+          /* @__PURE__ */ jsx(
+            "select",
+            {
+              id: "pollar-ramp-country",
+              className: "pollar-ramp-input",
+              value: country,
+              onChange: (e) => onCountryChange(e.target.value),
+              children: countries.map((c) => /* @__PURE__ */ jsxs("option", { value: c.country, children: [
+                flagEmoji(c.country),
+                " ",
+                c.country
+              ] }, c.country))
+            }
+          )
         ] }),
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            id: "pollar-ramp-amount",
-            type: "number",
-            className: "pollar-ramp-input",
-            placeholder: "0.00",
-            value: amount,
-            min: "0",
-            onChange: (e) => onAmountChange(e.target.value)
-          }
-        ),
-        errorMsg && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-field-error", children: errorMsg })
+        fiats.length > 1 && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
+          /* @__PURE__ */ jsx("label", { className: "pollar-ramp-label", htmlFor: "pollar-ramp-fiat", children: onramp ? "Pay with" : "Receive in" }),
+          /* @__PURE__ */ jsx(
+            "select",
+            {
+              id: "pollar-ramp-fiat",
+              className: "pollar-ramp-input",
+              value: fiat ? fiatKey(fiat) : "",
+              onChange: (e) => onFiatChange(e.target.value),
+              children: fiats.map((f) => /* @__PURE__ */ jsxs("option", { value: fiatKey(f), children: [
+                f.currency,
+                " \xB7 ",
+                rampRailLabel(f.rail, { language: formLanguage() })
+              ] }, fiatKey(f)))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
+          /* @__PURE__ */ jsx("label", { className: "pollar-ramp-label", htmlFor: "pollar-ramp-asset", children: onramp ? "Receive" : "Sell" }),
+          /* @__PURE__ */ jsx(
+            "select",
+            {
+              id: "pollar-ramp-asset",
+              className: "pollar-ramp-input",
+              value: asset ? assetKey3(asset) : "",
+              onChange: (e) => onAssetChange(e.target.value),
+              children: assets.map((a) => /* @__PURE__ */ jsxs("option", { value: assetKey3(a), children: [
+                a.code,
+                " on ",
+                CHAIN_NAME[a.chain] ?? a.chain
+              ] }, assetKey3(a)))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
+          /* @__PURE__ */ jsx(
+            AmountField,
+            {
+              id: "pollar-ramp-amount",
+              label: onramp ? "You pay" : "You sell",
+              value: amount,
+              onChange: onAmountChange,
+              unit: sendUnit,
+              available: onramp ? void 0 : sellAvailable
+            }
+          ),
+          errorMsg && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-field-error", children: errorMsg })
+        ] })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "pollar-modal-actions", children: [
-        /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onClose, children: "Cancel" }),
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: "pollar-btn-primary",
-            disabled: !amount || isLoading || countriesLoading || countries.length === 0,
-            onClick: onFindRoute,
-            children: "Find best route"
-          }
-        )
-      ] })
+      /* @__PURE__ */ jsx("div", { className: "pollar-modal-actions", children: /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "pollar-btn-primary",
+          disabled: !amount || !fiat || !asset || isLoading || routesLoading,
+          onClick: onFindRoute,
+          children: "Find best route"
+        }
+      ) })
     ] }),
     step === "loading_quote" && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-loading", children: [
       /* @__PURE__ */ jsx("div", { className: "pollar-spinner pollar-ramp-loading-spinner" }),
@@ -4008,33 +3982,44 @@ function RampWidgetTemplate({
       ] }, i))
     ] }),
     step === "select_route" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      noticeMsg && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: noticeMsg }),
       /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-route-list", children: [
         quotes.map((q, i) => /* @__PURE__ */ jsx(
           RouteDisplay,
           {
             quote: q,
-            busy: startingQuoteId != null && q.quoteId === startingQuoteId,
+            best: i === 0,
+            busy: startingQuoteId === q.quoteId,
             disabled: startingQuoteId != null && q.quoteId !== startingQuoteId,
             onSelect: onSelectQuote
           },
-          i
+          q.quoteId
         )),
-        kycRequired.map((r) => /* @__PURE__ */ jsx(
-          LockedRouteDisplay,
+        rejected.map((r, i) => /* @__PURE__ */ jsx(
+          RejectedRouteDisplay,
           {
-            requirement: r,
-            disabled: startingQuoteId != null,
-            onVerify: onVerifyRoute
+            rejection: r,
+            disabled: startingQuoteId != null || trustingAsset !== null || walletBusy !== null,
+            trusting: trustKey(r) === trustingAsset,
+            walletBusy: walletBusy === i,
+            custodyChoice,
+            onVerify: onVerifyRoute,
+            onTrust: onTrustAsset,
+            onWalletStep: onWalletStep && ((step2, custody) => onWalletStep(step2, i, custody))
           },
-          `${r.rampProviderId}:${r.corridorId}`
+          i
         ))
       ] }),
+      quotes.length === 0 && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: rampNoRouteText(rejected) }),
+      notice && /* @__PURE__ */ jsxs("p", { className: "pollar-ramp-payment-note", children: [
+        /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm", "aria-hidden": true }),
+        " ",
+        notice
+      ] }),
       errorMsg && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", style: { color: "var(--pollar-error-text)" }, children: errorMsg }),
-      /* @__PURE__ */ jsx("button", { type: "button", className: errorMsg ? "pollar-btn-primary" : "pollar-btn-secondary", onClick: onBack, children: "Back" })
+      (errorMsg || !quotes.length) && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-primary", onClick: onBack, children: "Back" })
     ] }),
     step === "contact" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      requiredFields.map((f) => /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
+      fields.map((f) => /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
         /* @__PURE__ */ jsxs("label", { className: "pollar-ramp-label", children: [
           f.label,
           f.optional && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-field-optional", children: " (optional)" })
@@ -4056,184 +4041,178 @@ function RampWidgetTemplate({
             type: f.type,
             className: "pollar-ramp-input",
             value: fieldValues[f.key] ?? "",
-            placeholder: placeholderFor(f, requiredFields, fieldValues),
+            placeholder: placeholderFor(f, fields, fieldValues),
             autoComplete: f.type === "email" ? "email" : "off",
             onChange: (e) => onFieldChange(f.key, e.target.value)
           }
         ),
         f.hint && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-field-hint", children: f.hint }),
-        f.type === "email" && (fieldValues[f.key] ?? "").trim() !== "" && !isFieldValid(f, fieldValues[f.key]) && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-field-error", children: "Enter a valid email address." })
+        rampFieldError(f, fieldValues[f.key]) && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-field-error", children: rampFieldError(f, fieldValues[f.key]) })
       ] }, f.key)),
-      /* @__PURE__ */ jsxs("div", { className: "pollar-modal-actions", children: [
-        /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onBack, children: "Back" }),
-        /* @__PURE__ */ jsx(
+      errorMsg && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-field-error", children: errorMsg }),
+      /* @__PURE__ */ jsx("div", { className: "pollar-modal-actions", children: /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "pollar-btn-primary",
+          disabled: fields.some((f) => !rampFieldValid(f, fieldValues[f.key])) || isLoading,
+          onClick: onContactContinue,
+          children: isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
+            "Starting\u2026"
+          ] }) : "Continue"
+        }
+      ) })
+    ] }),
+    step === "status" && order && view && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment", children: [
+      /* @__PURE__ */ jsx("ol", { className: "pollar-ramp-legs", "aria-label": "Progress", children: order.legs.map((leg) => {
+        const status = rampLegStatus(leg);
+        const hash = leg.onchainTxHash;
+        const note = rampLegNote(leg);
+        return /* @__PURE__ */ jsxs("li", { className: "pollar-ramp-leg", "data-status": status, children: [
+          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-leg-dot", "aria-hidden": true }),
+          /* @__PURE__ */ jsx("span", { className: "pollar-ramp-leg-title", children: rampLegTitle(leg) }),
+          status === "active" && !settled && /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm", "aria-label": "In progress" }),
+          hash && /* @__PURE__ */ jsxs(
+            "a",
+            {
+              className: "pollar-ramp-leg-link",
+              href: explorerTxUrl2(legChain(leg), hash, network),
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: [
+                hash.slice(0, 6),
+                "\u2026",
+                hash.slice(-4)
+              ]
+            }
+          ),
+          note && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-leg-note", children: note }),
+          status === "active" && !settled && !!leg.steps?.length && /* @__PURE__ */ jsx("ol", { className: "pollar-ramp-steps", children: leg.steps.map((s) => /* @__PURE__ */ jsxs("li", { className: "pollar-ramp-step", "data-status": s.status, children: [
+            /* @__PURE__ */ jsx("span", { className: "pollar-ramp-step-title", children: rampStepTitle(s, leg) }),
+            /* @__PURE__ */ jsxs("span", { className: "pollar-ramp-step-state", children: [
+              s.status === "confirming" && /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm", "aria-hidden": true }),
+              s.hash ? /* @__PURE__ */ jsx(
+                "a",
+                {
+                  className: "pollar-ramp-leg-link",
+                  href: explorerTxUrl2(stepChain(s.kind, leg), s.hash, network),
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  children: rampStepStatusText(s)
+                }
+              ) : rampStepStatusText(s)
+            ] })
+          ] }, s.kind)) }),
+          running === leg && !settled && rampLegTimeLeft(leg, now) !== null && /* @__PURE__ */ jsx("span", { className: "pollar-ramp-leg-eta", children: timeLeftText(rampLegTimeLeft(leg, now)) })
+        ] }, leg.index);
+      }) }),
+      nextApproval && !order.pendingAction && /* @__PURE__ */ jsxs("p", { className: "pollar-ramp-next", children: [
+        "Next: ",
+        nextApproval,
+        ". You approve it on this device when it comes up."
+      ] }),
+      receive && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
+        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: order.state === "completed" ? "You received" : "You receive" }),
+        /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-value", children: [
+          receive.estimated && "~",
+          receive.amount,
+          " ",
+          receive.unit
+        ] })
+      ] }),
+      order.failure && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
+        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: "What to do" }),
+        /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: rampOrderResolutionText(order) }),
+        stopped && !settled && waitsOnRecovery && recoveryMissing !== false && onSetUpRecovery && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onSetUpRecovery, children: "Set up recovery" }),
+        stopped && !settled && waitsOnRecovery && recoveryMissing === true && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "Once it is set up, the order goes on by itself." }),
+        stopped && !settled && order.failure.resolutionOwner === "END_USER" && onRetryOrder && /* @__PURE__ */ jsx(
           "button",
           {
             type: "button",
             className: "pollar-btn-primary",
-            disabled: requiredFields.some((f) => !isFieldValid(f, fieldValues[f.key])) || isLoading,
-            onClick: onContactContinue,
-            children: isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            disabled: retrying || waitsOnRecovery && recoveryMissing === true,
+            onClick: onRetryOrder,
+            children: retrying ? /* @__PURE__ */ jsxs(Fragment, { children: [
               /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
-              "Starting\u2026"
-            ] }) : "Continue"
+              " Trying again\u2026"
+            ] }) : "Try again"
           }
-        )
-      ] })
-    ] }),
-    step === "status" && workflowContent,
-    step === "status" && onDismissCurrentRamp && txStatus !== "completed" && txStatus !== "failed" && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-explore", children: [
-      /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", disabled: completing, onClick: onDismissCurrentRamp, children: "Remove from pending list" }),
-      /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "This only hides the operation in this tab. To request cancellation, open the provider link above when available or contact the provider\u2019s support. Payments and refunds must be confirmed by the provider." })
-    ] }),
-    step === "status" && onExploreRoutes && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-explore", children: [
-      /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", disabled: completing, onClick: onExploreRoutes, children: txStatus === "completed" || txStatus === "failed" ? "Start another operation" : "Try another route" }),
-      txStatus !== "completed" && txStatus !== "failed" && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "Your current operation stays saved so you can resume it later." })
-    ] }),
-    step === "status" && !workflowContent && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment", children: [
-      /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
-        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: "Provider" }),
-        /* @__PURE__ */ jsx("div", { className: "pollar-ramp-payment-value", children: /* @__PURE__ */ jsx("code", { children: provider }) })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
-        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: "Status" }),
-        /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-value", children: [
-          /* @__PURE__ */ jsx("code", { style: { color: txStatus === "completed" ? "var(--pollar-success-text)" : void 0 }, children: txStatus ? STATUS_LABEL[txStatus] : "Processing" }),
-          txStatus !== "completed" && txStatus !== "failed" && /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm", "aria-label": "Checking status" })
-        ] })
-      ] }),
-      fundsInTransit && txStatus !== "completed" && txStatus !== "failed" && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
-        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: "Funds in transit" }),
-        /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "Your money is safe in your own wallet, waiting for the next step of the transfer." }),
-        onRetryTransit && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onRetryTransit, disabled: retrying, children: retrying ? "Retrying..." : "Retry now" })
-      ] }),
-      settledHash && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
-        /* @__PURE__ */ jsxs("span", { className: "pollar-ramp-payment-label", children: [
-          chainName,
-          " tx"
-        ] }),
+        ),
         /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-value", style: { display: "flex", alignItems: "center", gap: 6 }, children: [
           /* @__PURE__ */ jsxs("code", { style: { flex: 1, wordBreak: "break-all" }, children: [
-            settledHash.slice(0, 8),
-            "\u2026",
-            settledHash.slice(-8)
+            "Order ",
+            order.id
           ] }),
-          /* @__PURE__ */ jsx(CopyButton, { value: settledHash, label: "Copy transaction hash" }),
-          explorerUrl && /* @__PURE__ */ jsx(
-            "a",
-            {
-              href: explorerUrl,
-              target: "_blank",
-              rel: "noopener noreferrer",
-              className: "pollar-copy-btn",
-              "aria-label": `View on ${EXPLORER_NAME[txChain ?? "STELLAR"]}`,
-              title: `View on ${EXPLORER_NAME[txChain ?? "STELLAR"]}`,
-              children: /* @__PURE__ */ jsxs("svg", { width: "13", height: "13", viewBox: "0 0 14 14", fill: "none", "aria-hidden": true, children: [
-                /* @__PURE__ */ jsx(
-                  "path",
-                  {
-                    d: "M6 3H3v8h8V8",
-                    stroke: "currentColor",
-                    strokeWidth: "1.5",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round"
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "path",
-                  {
-                    d: "M8.5 2.5h3v3M11 3L6.5 7.5",
-                    stroke: "currentColor",
-                    strokeWidth: "1.5",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round"
-                  }
-                )
-              ] })
-            }
-          )
+          /* @__PURE__ */ jsx(CopyButton, { value: order.id, label: "Copy order id" })
         ] })
       ] }),
-      depositInstructions?.scannable && txStatus !== "completed" && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
+      !settled && payBy !== null && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: payBy > Date.now() ? `Pay before ${new Date(payBy).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" })}.` : "This payment window has closed. If you have not paid, start a new operation." }),
+      !settled && view.scannable && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
         /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: "Payment QR" }),
-        /* @__PURE__ */ jsx("div", { className: "pollar-ramp-payment-value", children: depositInstructions.scannable.image.inlineSafe ? /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: "pollar-ramp-payment-value", children: view.scannable.image.inlineSafe ? /* @__PURE__ */ jsx(
           "div",
           {
             className: "pollar-ramp-qr",
             "aria-label": "Payment QR",
-            dangerouslySetInnerHTML: { __html: depositInstructions.scannable.image.data }
+            dangerouslySetInnerHTML: { __html: view.scannable.image.data }
           }
         ) : /* @__PURE__ */ jsx(
           "img",
           {
-            src: scannableImageSrc(depositInstructions.scannable.image),
+            src: scannableImageSrc(view.scannable.image),
             alt: "Payment QR",
             style: { width: "100%", maxWidth: 220, height: "auto", display: "block", margin: "0 auto" }
           }
         ) })
       ] }),
-      depositInstructions?.scannable?.payload && depositInstructions.scannable.payloadLabel && txStatus !== "completed" && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
-        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: depositInstructions.scannable.payloadLabel }),
+      !settled && view.codeMissing && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", style: { color: "var(--pollar-error-text)" }, children: "The payment code could not be shown. Refresh; if it still does not appear, contact this app's support." }),
+      !settled && view.scannable?.payload && view.scannable.payloadLabel && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
+        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: view.scannable.payloadLabel }),
         /* @__PURE__ */ jsx("div", { className: "pollar-ramp-payment-value", children: /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
-          /* @__PURE__ */ jsx("code", { style: { flex: 1, wordBreak: "break-all" }, children: depositInstructions.scannable.payload }),
-          /* @__PURE__ */ jsx(
-            CopyButton,
-            {
-              value: depositInstructions.scannable.payload,
-              label: `Copy ${depositInstructions.scannable.payloadLabel}`
-            }
-          )
+          /* @__PURE__ */ jsx("code", { style: { flex: 1, wordBreak: "break-all" }, children: view.scannable.payload }),
+          /* @__PURE__ */ jsx(CopyButton, { value: view.scannable.payload, label: `Copy ${view.scannable.payloadLabel}` })
         ] }) })
       ] }),
-      depositInstructions && txStatus !== "completed" && depositInstructions.fields.map((f) => /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
-        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: f.label }),
-        /* @__PURE__ */ jsx("div", { className: "pollar-ramp-payment-value", children: f.copyable ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
-          /* @__PURE__ */ jsx("code", { style: { flex: 1, wordBreak: "break-all" }, children: f.value }),
-          /* @__PURE__ */ jsx(CopyButton, { value: f.value, label: `Copy ${f.label}` })
-        ] }) : f.type === "url" ? /* @__PURE__ */ jsx("a", { href: f.value, target: "_blank", rel: "noopener noreferrer", children: f.value }) : /* @__PURE__ */ jsx("span", { children: displayValue(f) }) })
-      ] }, f.key)),
-      tosUrl && !depositInstructions && txStatus !== "completed" && /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-btn-primary", onClick: onOpenTos, children: [
-        "Accept terms at ",
-        provider
-      ] }),
-      kycUrl && !depositInstructions && txStatus !== "completed" && /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-btn-primary", onClick: onOpenKyc, children: [
-        "Continue at ",
-        provider
-      ] }),
-      kycBlocking && onboardingStatus === "awaiting_provider" && /* @__PURE__ */ jsxs("p", { className: "pollar-ramp-payment-note", children: [
-        provider,
-        " is still setting up your account for this payment method. Your verification is complete and there is nothing left for you to do \u2014 nothing has been sent, and this will update on its own once ",
-        provider,
-        " is ready."
-      ] }),
-      kycBlocking && onboardingStatus !== "awaiting_provider" && /* @__PURE__ */ jsxs("p", { className: "pollar-ramp-payment-note", children: [
-        provider,
-        " needs to verify your identity before this payout. Nothing has been sent yet \u2014 complete verification with ",
-        provider,
-        ", and this will update on its own."
-      ] }),
-      kycJustApproved && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsxs("p", { className: "pollar-ramp-payment-note", children: [
-          provider,
-          " approved your verification. Request a new quote to continue \u2014 the previous one was consumed."
-        ] }),
-        /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-primary", onClick: onRetry, children: "Request a new quote" })
-      ] }),
-      canComplete && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-primary", disabled: completing, onClick: onCompleteWithdraw, children: completing ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      !settled && view.details.map((d) => /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment-field", children: [
+        /* @__PURE__ */ jsx("span", { className: "pollar-ramp-payment-label", children: d.label }),
+        /* @__PURE__ */ jsx("div", { className: "pollar-ramp-payment-value", children: /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
+          /* @__PURE__ */ jsx("code", { style: { flex: 1, wordBreak: "break-all" }, children: d.value }),
+          /* @__PURE__ */ jsx(CopyButton, { value: d.value, label: `Copy ${d.label}` })
+        ] }) })
+      ] }, d.label)),
+      !settled && view.action?.kind === "FIAT_PAYMENT" && onCheckPayment && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-primary", disabled: checkingPayment, onClick: onCheckPayment, children: checkingPayment ? /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
-        "Submitting\u2026"
-      ] }) : "Check verification and continue" }),
-      errorMsg && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", style: { color: "var(--pollar-error-text)" }, children: errorMsg }),
-      /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onClose, children: txStatus === "completed" ? "Done" : "Close" })
+        " Checking your payment..."
+      ] }) : "I've paid" }),
+      !settled && view.canSign && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-primary", disabled: signing, onClick: onSign, children: signing ? "Waiting for your wallet\u2026" : "Authorize" }),
+      !settled && view.action?.kind === "SIGNATURE" && !view.canSign && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "Preparing a new signature request\u2026" }),
+      !settled && view.canApprove && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-primary", onClick: onApprove, children: "Approve on this device" }),
+      !settled && view.link && /* @__PURE__ */ jsx(
+        "a",
+        {
+          className: "pollar-btn-primary pollar-ramp-hosted-link",
+          href: view.link,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          children: view.linkLabel
+        }
+      ),
+      !settled && order.pendingAction?.kind === "KYC" && !view.link && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: view.note ?? "The provider is reviewing your details. This updates on its own." }),
+      pollTrouble && !settled && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "Having trouble reaching the server. Retrying\u2026" }),
+      errorMsg && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-field-error", children: errorMsg }),
+      /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-explore", children: [
+        /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onNewOrder, children: "Start another operation" }),
+        !stopped && /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", children: "This one keeps going; you can resume it later." })
+      ] })
     ] }),
-    step === "error" && /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-payment", children: [
-      /* @__PURE__ */ jsx("p", { className: "pollar-ramp-payment-note", style: { color: "var(--pollar-error-text)" }, children: errorMsg ?? "Unexpected error." }),
+    step === "error" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: errorMsg ?? "Something went wrong." }),
       /* @__PURE__ */ jsxs("div", { className: "pollar-modal-actions", children: [
         /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-secondary", onClick: onClose, children: "Close" }),
         /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-btn-primary", onClick: onRetry, children: "Try again" })
       ] })
-    ] }),
-    /* @__PURE__ */ jsx(PollarModalFooter, {})
+    ] })
   ] });
 }
 
@@ -4727,776 +4706,580 @@ function ProviderRegistrationModal({
     }
   ) });
 }
-
-// src/components/ramp-widget/ramp-quotes.ts
-function unavailableRampMessage(country, unavailable) {
-  if (!unavailable.length) return `No ramp providers available for ${country} yet.`;
-  return unavailable.map(
-    ({ provider, code }) => code === "SDK_RAMPS_PROVIDER_NOT_CONFIGURED" ? `${provider} is not configured correctly. Contact the app administrator to enable this provider.` : `${provider} is temporarily unavailable. Please try again later.`
-  ).join(" ");
-}
-async function quoteRampOptions(client, query, routes) {
-  const matching = routes.filter(
-    (route) => route.country === query.country && route.direction === query.direction && route.fiatCurrency === query.currency
-  );
-  const responses = await Promise.allSettled([
-    client.getRampsQuote(query),
-    ...matching.map((route) => client.getRampsQuote({ ...query, routeId: route.routeId, chain: route.asset.chain }))
-  ]);
-  const results = responses.flatMap((response) => response.status === "fulfilled" ? [response.value] : []);
-  if (!results.length) throw responses[0].reason;
-  const quotes = /* @__PURE__ */ new Map();
-  const requirements = /* @__PURE__ */ new Map();
-  const unavailable = /* @__PURE__ */ new Map();
-  for (const result of results) {
-    for (const quote of result.quotes) {
-      const key = JSON.stringify([quote.provider, quote.route?.routeId, quote.route?.asset.chain, quote.rail, quote.protocol]);
-      if (!quotes.has(key)) quotes.set(key, quote);
-    }
-    for (const requirement of result.requirementsRequired ?? [])
-      requirements.set(`${requirement.rampProviderId}:${requirement.corridorId}`, requirement);
-    for (const item of result.unavailable ?? []) unavailable.set(item.provider, item);
-  }
-  const failed = responses.find((response) => response.status === "rejected");
-  if (!quotes.size && !requirements.size && failed?.status === "rejected") throw failed.reason;
-  return {
-    quotes: [...quotes.values()],
-    requirementsRequired: [...requirements.values()],
-    unavailable: [...unavailable.values()]
-  };
-}
-var TERMINAL = ["completed", "failed"];
-var BANK_TYPES = ["CLABE", "PIX", "PSE", "ACH", "BREB"];
-function isBankType(value) {
-  return BANK_TYPES.some((type) => type === value);
-}
-function requiredFieldsOf(quote) {
-  return "requiredFields" in quote ? quote.requiredFields : [];
-}
-function flowStepsOf(quotes, selected) {
-  const needsDetails = selected != null ? requiredFieldsOf(selected).length > 0 : quotes.some((q) => requiredFieldsOf(q).length > 0);
-  return needsDetails ? ["Amount", "Provider", "Details", "Complete"] : ["Amount", "Provider", "Complete"];
-}
-var STEP_LABEL = {
-  input: "Amount",
-  loading_quote: "Amount",
-  select_route: "Provider",
-  contact: "Details",
-  status: "Complete"
-};
-function brokenLimitOf(amount, quote) {
-  const minAmount = "minAmount" in quote ? quote.minAmount : void 0;
-  const maxAmount = "maxAmount" in quote ? quote.maxAmount : void 0;
-  if (!Number.isFinite(amount)) return null;
-  if (minAmount != null && amount < minAmount) return { limit: "min", value: minAmount };
-  if (maxAmount != null && amount > maxAmount) return { limit: "max", value: maxAmount };
-  return null;
-}
-function limitMessage(limit, value, currency) {
-  return `The ${limit === "min" ? "minimum" : "maximum"} amount for this route is ${value} ${currency}.`;
-}
+var PAYMENT_CHECK_EVERY_MS = 1e4;
+var PAYMENT_CHECK_WINDOW_MS = 2 * 6e4;
 var RAMP_ERROR_MESSAGES = {
-  SDK_RAMPS_QUOTE_EXPIRED: "This quote expired. Request a new one and try again.",
-  SDK_RAMPS_ASSET_NOT_ENABLED: "This currency is not available for that route right now.",
-  SDK_RAMPS_KYC_REQUIRED: "The provider needs to verify your identity before continuing.",
-  SDK_RAMPS_WALLET_UNSUPPORTED: "This wallet type cannot be used for this ramp.",
-  SDK_RAMPS_PROVIDER_NOT_CONFIGURED: "This ramp provider is not configured for this app yet.",
-  SDK_RAMPS_ANCHOR_ERROR: "The provider rejected the request. Please try again in a moment.",
-  SDK_RAMPS_BRIDGE_ERROR: "The provider rejected the request. Please try again in a moment.",
-  SDK_RAMPS_ETHERFUSE_ERROR: "The provider rejected the request. Please try again in a moment.",
-  SDK_RAMPS_INSUFFICIENT_BALANCE: "This wallet does not hold enough to cover that amount. Try a smaller one.",
-  // Nothing moved on-chain, so the balance is untouched. Almost always no XLM
-  // for the network fee on a wallet the app does not sponsor.
-  SDK_RAMPS_ONCHAIN_SUBMIT_FAILED: "The network rejected the transaction, so nothing was sent. The wallet may need XLM for the fee."
+  SDK_RAMPS_QUOTE_EXPIRED: "This quote expired. Find a route again.",
+  SDK_RAMPS_QUOTE_NOT_FOUND: "This quote is no longer available. Find a route again.",
+  SDK_RAMPS_ACTION_STALE: "This step changed. It was refreshed; try again.",
+  SDK_RAMPS_TX_NOT_FOUND: "This operation was not found.",
+  SDK_RAMPS_WALLET_NOT_READY: "Approve the new wallet account on your device, then try again."
 };
-function rampErrorMessage(e, fallback) {
-  const code = typeof e === "object" && e !== null && "code" in e ? e.code : void 0;
-  if (typeof code !== "string") return e instanceof Error ? e.message : fallback;
-  const raw = typeof e === "object" && e !== null && "body" in e ? e.body : void 0;
-  const body = typeof raw === "object" && raw !== null ? raw : {};
-  const limit = "limit" in body ? body.limit : void 0;
-  const value = "limitAmount" in body ? body.limitAmount : void 0;
-  const currency = "limitCurrency" in body ? body.limitCurrency : void 0;
-  if ((limit === "min" || limit === "max") && typeof value === "number" && typeof currency === "string") {
-    return limitMessage(limit, value, currency);
-  }
-  return RAMP_ERROR_MESSAGES[code] ?? (e instanceof Error ? e.message : fallback);
-}
-function readRampStorage(key) {
-  try {
-    return typeof window === "undefined" ? null : window.sessionStorage.getItem(key);
-  } catch {
-    return null;
-  }
-}
-function writeRampStorage(key, value) {
-  try {
-    if (typeof window === "undefined") return;
-    if (value === null) window.sessionStorage.removeItem(key);
-    else window.sessionStorage.setItem(key, value);
-  } catch {
+function rampErrorMessage(error, fallback) {
+  const unavailable = appUnavailableMessage(error);
+  if (unavailable) return unavailable;
+  if (isPollarApiError(error)) {
+    const known = RAMP_ERROR_MESSAGES[error.code];
+    if (known) return known;
+    const message = error.body.message;
+    if (typeof message === "string" && message && !/^[A-Z0-9_]+$/.test(message)) return message;
   }
+  return fallback;
 }
-function savedRampsOf(key) {
-  try {
-    const value = JSON.parse(readRampStorage(`${key}:saved`) ?? "[]");
-    return Array.isArray(value) ? value.filter((item) => typeof item?.txId === "string" && typeof item?.provider === "string") : [];
-  } catch {
-    return [];
-  }
+function routeKey(quote) {
+  const node = (n) => n.kind === "asset" ? `${n.code}:${n.chain}` : `${n.currency}:${n.rail}`;
+  return quote.legs.map((leg) => `${leg.kind}:${node(leg.from)}>${node(leg.to)}`).join("|");
 }
-function hiddenRampsOf(key) {
+var DECIMAL = /^\d+(\.\d+)?$/;
+async function signLegWithWallet(client, orderId, actionId) {
+  const lent = [];
+  const lend = (chain, encoding, handler) => {
+    try {
+      lent.push(client.registerRampSigningHandler(chain, encoding, handler));
+    } catch {
+    }
+  };
+  lend("STELLAR", "xdr", async (action) => {
+    const wallet = client.getWallet();
+    if (!wallet) throw new Error("Connect the Stellar wallet this step was built for.");
+    assertRampStellarSigner(action, wallet.address);
+    const outcome = await client.signTx(action.payload.value);
+    if (client.getWallet()?.address !== wallet.address)
+      throw new Error("The connected wallet changed. Refresh before signing.");
+    if (outcome.status === "signed") return outcome.signedXdr;
+    throw new Error(
+      outcome.status === "error" ? outcome.message ?? outcome.details ?? "Signing was cancelled." : "Signing was cancelled."
+    );
+  });
+  lend("SOLANA", "solana-v0-json", async (action) => {
+    const payload = JSON.parse(action.payload.value);
+    const solanaWallet = () => client.getWallets().find((w) => w.chain === "SOLANA" && w.custody === "external");
+    const wallet = solanaWallet();
+    if (!wallet || payload.from !== wallet.address || !payload.unsignedTransaction)
+      throw new Error("This step must be signed by the Solana wallet it was built for. Reconnect that wallet.");
+    const signed = await client.signSolanaTransaction(payload.unsignedTransaction);
+    if (solanaWallet()?.address !== wallet.address) throw new Error("The connected wallet changed. Refresh before signing.");
+    return signed;
+  });
   try {
-    const value = JSON.parse(readRampStorage(`${key}:hidden`) ?? "[]");
-    return Array.isArray(value) ? value.filter((id) => typeof id === "string") : [];
-  } catch {
-    return [];
+    return await client.signRampLeg(orderId, actionId);
+  } finally {
+    for (const release of lent) release();
   }
 }
-function explorerTxUrl2(chain, hash, network) {
-  if (!hash) return null;
-  const testnet = network === "testnet";
-  if (chain === "SOLANA") return `https://explorer.solana.com/tx/${hash}${testnet ? "?cluster=devnet" : ""}`;
-  if (chain === "POLYGON") return `https://${testnet ? "amoy." : ""}polygonscan.com/tx/${hash}`;
-  return `https://stellar.expert/explorer/${testnet ? "testnet" : "public"}/tx/${hash}`;
-}
 function RampWidget({ onClose }) {
-  const { getClient, wallet, styles, network } = usePollar();
-  const walletAddress = wallet?.address ?? "";
+  const {
+    getClient,
+    styles,
+    network,
+    openCosignModal,
+    setCosignNextStep,
+    openRecoveryModal,
+    recovery,
+    recoveryLocked,
+    appConfig,
+    cosign,
+    refreshWalletBalance
+  } = usePollar();
   const client = getClient();
   const { theme, accentColor, styleOverrides, overlayStyle } = modalChrome(styles);
   const [step, setStep] = useState("input");
-  const [direction, setDirection] = useState("onramp");
-  const [amount, setAmount] = useState("");
-  const [currency, setCurrency] = useState("");
+  const [direction, setDirection] = useState("ONRAMP");
+  const [routes, setRoutes] = useState([]);
+  const [routesLoading, setRoutesLoading] = useState(true);
   const [country, setCountry] = useState("");
-  const [fieldValues, setFieldValues] = useState({});
-  const setFieldValue = (key, value) => setFieldValues((v) => ({ ...v, [key]: value }));
-  const [legacyCountries, setCountries] = useState([]);
-  const [countriesLoading, setCountriesLoading] = useState(true);
-  const [refreshing, setRefreshing] = useState(false);
+  const [fiatChoice, setFiatChoice] = useState("");
+  const [assetChoice, setAssetChoice] = useState("");
+  const [amount, setAmount] = useState("");
   const [quotes, setQuotes] = useState([]);
-  const [requirementsRequired, setRequirementsRequired] = useState([]);
-  const [selectedQuote, setSelectedQuote] = useState(null);
+  const [rejected, setRejected] = useState([]);
+  const [selected, setSelected] = useState(null);
+  const [startingQuoteId, setStartingQuoteId] = useState(null);
+  const [fieldValues, setFieldValues] = useState({});
+  const [order, setOrder] = useState(null);
+  const [pendingOrders, setPendingOrders] = useState([]);
   const [isLoading, setIsLoading] = useState(false);
-  const [pendingKyc, setPendingKyc] = useState(null);
-  const [noticeMsg, setNoticeMsg] = useState(null);
-  const kycAttempt = useRef(null);
-  useEffect(
-    () => () => {
-      kycAttempt.current = null;
-    },
-    []
-  );
-  const [txId, setTxId] = useState(null);
-  const [provider, setProvider] = useState("");
-  const [kycUrl, setKycUrl] = useState(null);
-  const [tosUrl, setTosUrl] = useState(null);
-  const [kycPending, setKycPending] = useState(false);
-  const [kycApproved, setKycApproved] = useState(false);
-  const [onboardingStatus, setOnboardingStatus] = useState(void 0);
-  const [txStatus, setTxStatus] = useState(null);
-  const [stellarTxHash, setStellarTxHash] = useState(null);
-  const [txHash, setTxHash] = useState(null);
-  const [txChain, setTxChain] = useState(null);
-  const [fundsInTransit, setFundsInTransit] = useState(false);
-  const [retrying, setRetrying] = useState(false);
-  const [depositInstructions, setDepositInstructions] = useState(null);
-  const [workflow, setWorkflow] = useState(null);
-  const workflowRef = useRef(null);
-  const storageKey = `pollar:ramp:${client.apiKey}:${walletAddress}`;
-  const [savedRamps, setSavedRamps] = useState([]);
-  const [legacySignature, setLegacySignature] = useState(void 0);
-  function acceptWorkflow(incoming) {
-    if (hiddenRampsOf(storageKey).includes(incoming.txId)) return false;
-    const next = mergeRampSnapshot(workflowRef.current, incoming);
-    workflowRef.current = next;
-    setWorkflow(next);
-    if (next === incoming) {
-      const pending = savedRampsOf(storageKey).filter((item) => item.txId !== incoming.txId);
-      if (!["completed", "failed", "refunded"].includes(incoming.lifecycleState ?? incoming.status))
-        pending.push({
-          txId: incoming.txId,
-          provider: "provider" in incoming && typeof incoming.provider === "string" ? incoming.provider : provider || "Ramp"
-        });
-      writeRampStorage(`${storageKey}:saved`, JSON.stringify(pending));
-      writeRampStorage(storageKey, incoming.txId);
-      writeRampStorage(`${storageKey}:selection`, null);
-      setSavedRamps(pending);
-    }
-    return next === incoming;
-  }
-  const [routes, setRoutes] = useState([]);
-  const countries = mergeRampCountries(legacyCountries, routes);
-  useEffect(() => {
-    if (!country && countries[0]) {
-      setCountry(countries[0].code);
-      setCurrency(countries[0].currency ?? "");
-    }
-  }, [countries, country]);
-  useEffect(() => {
-    let active = true;
-    void client.getRampRoutes().then((result) => {
-      if (active) setRoutes(result.routes);
-    }).catch(() => {
-    });
-    return () => {
-      active = false;
-    };
-  }, [client]);
-  const [completing, setCompleting] = useState(false);
-  const completionLocked = useRef(false);
+  const [refreshing, setRefreshing] = useState(false);
+  const [signing, setSigning] = useState(false);
   const [errorMsg, setErrorMsg] = useState(null);
+  const [verifying, setVerifying] = useState(null);
+  const [trustingAsset, setTrustingAsset] = useState(null);
+  const [walletBusy, setWalletBusy] = useState(null);
+  const [retrying, setRetrying] = useState(false);
+  const [awaitingAccount, setAwaitingAccount] = useState(null);
+  const [pollTrouble, setPollTrouble] = useState(false);
+  const [pollKey, setPollKey] = useState(0);
+  const [paymentCheckUntil, setPaymentCheckUntil] = useState(null);
+  const promptedApproval = useRef(null);
+  const custodyChoice = appConfig.application?.walletCustodyMode === "USER_CHOICE";
+  const appChains = appConfig.application?.chains;
+  const verifyAttempt = useRef(null);
+  const countries = useMemo(() => rampCountries(routes), [routes]);
+  const fiats = countries.find((c) => c.country === country)?.fiats ?? [];
+  const fiat = fiats.find((f) => fiatKey(f) === fiatChoice) ?? fiats[0] ?? null;
+  const assets = useMemo(() => {
+    const seen = /* @__PURE__ */ new Map();
+    for (const route of routes)
+      if (fiat && route.fiat.country === country && fiatKey(route.fiat) === fiatKey(fiat))
+        seen.set(assetKey3(route.asset), route.asset);
+    return [...seen.values()];
+  }, [routes, country, fiat]);
+  const asset = assets.find((a) => assetKey3(a) === assetChoice) ?? assets[0] ?? null;
+  const fields = selected ? rampQuoteFields(selected) : [];
+  const sellAvailable = useWalletAvailable(
+    direction === "OFFRAMP" && asset ? { chain: asset.chain, code: asset.code, issuer: asset.identifier } : null
+  );
   useEffect(() => {
-    if (typeof window === "undefined" || !walletAddress) return;
-    setSavedRamps(savedRampsOf(storageKey));
-    if (readRampStorage(`${storageKey}:selection`) === "1") return;
-    const hidden = hiddenRampsOf(storageKey);
-    const savedId = [new URLSearchParams(window.location.search).get("rampTxId"), readRampStorage(storageKey)].find(
-      (id) => id && !hidden.includes(id)
-    );
-    if (!savedId) return;
-    let active = true;
-    void client.getRampTransaction(savedId).then(async (result) => {
-      if (!active || result.transactionVersion === void 0) return;
-      setDirection(result.direction);
-      await applyResult(result);
-    }).catch(() => {
-      if (active)
-        setErrorMsg("Could not restore the saved ramp. Retry opening the modal; do not create a replacement order.");
-    });
-    return () => {
-      active = false;
-    };
-  }, [client, storageKey, walletAddress]);
-  async function resumeSavedRamp(id) {
-    if (completionLocked.current) return;
-    setIsLoading(true);
-    setErrorMsg(null);
+    if (direction === "OFFRAMP") void refreshWalletBalance();
+  }, [direction, refreshWalletBalance]);
+  async function loadRoutes(next) {
+    setRoutesLoading(true);
     try {
-      const result = await client.getRampTransaction(id);
-      if (result.transactionVersion === void 0) throw new Error("This saved ramp cannot be restored.");
-      setDirection(result.direction);
-      await applyResult(result);
+      const { routes: found } = await client.getRampRoutes(next);
+      setRoutes(found);
+      const first = rampCountries(found)[0]?.country ?? "";
+      setCountry((current) => found.some((r) => r.fiat.country === current) ? current : first);
     } catch (error) {
-      setErrorMsg(rampErrorMessage(error, "Could not resume the saved ramp."));
+      setRoutes([]);
+      setErrorMsg(rampErrorMessage(error, "Could not load the ramp routes."));
     } finally {
-      setIsLoading(false);
+      setRoutesLoading(false);
     }
   }
-  const directionRef = useRef(direction);
-  directionRef.current = direction;
-  function applySettlement(tx) {
-    if (tx.stellarTxHash) setStellarTxHash(tx.stellarTxHash);
-    if (tx.txHash) setTxHash(tx.txHash);
-    if (tx.chain) setTxChain(tx.chain);
-    setFundsInTransit(tx.fundsInTransit === true);
-  }
-  async function handleRetryTransit() {
-    if (!txId || retrying) return;
-    setRetrying(true);
-    setErrorMsg(null);
+  async function loadPendingOrders() {
     try {
-      const tx = await client.retryRampTransaction(txId);
-      setTxStatus(tx.status);
-      applySettlement(tx);
-    } catch (e) {
-      setErrorMsg(e instanceof Error && e.message ? e.message : "Could not retry the transfer. Try again in a moment.");
-    } finally {
-      setRetrying(false);
+      const page = await client.listRampOrders({ open: "true", limit: 5 });
+      setPendingOrders(page.orders);
+    } catch {
+      setPendingOrders([]);
     }
   }
-  const workflowTerminal = !!workflow && ["completed", "failed", "refunded"].includes(workflow.lifecycleState ?? workflow.status);
   useEffect(() => {
-    if (step !== "status" || !txId) return;
-    if (workflowTerminal || txStatus && TERMINAL.includes(txStatus)) return;
-    let active = true;
-    const id = setInterval(async () => {
-      try {
-        const tx = await client.getRampTransaction(txId);
-        if (!active) return;
-        if (tx.transactionVersion !== void 0 && !acceptWorkflow(tx)) return;
-        setTxStatus(tx.status);
-        applySettlement(tx);
-        const pending = "pendingSignature" in tx ? tx.pendingSignature : void 0;
-        if (pending) setLegacySignature(pending);
-        if (tx.kycUrl) setKycUrl(tx.kycUrl);
-        if (tx.depositInstructions) setDepositInstructions(tx.depositInstructions);
-        if (TERMINAL.includes(tx.status)) clearInterval(id);
-      } catch {
-      }
-    }, 5e3);
-    return () => {
-      active = false;
-      clearInterval(id);
-    };
-  }, [step, txId, txStatus, workflowTerminal, client]);
+    void loadRoutes(direction);
+  }, [client, direction]);
   useEffect(() => {
-    if (workflow || step !== "status" || !kycPending || kycApproved || provider.toLowerCase() !== "abroad") return;
-    if (onboardingStatus === "awaiting_provider") return;
-    let active = true;
-    const check = async () => {
-      try {
-        const { hasApproved } = await client.getRampKycStatus();
-        if (active && hasApproved) setKycApproved(true);
-      } catch {
-      }
-    };
-    void check();
-    const id = setInterval(check, 1e4);
-    return () => {
-      active = false;
-      clearInterval(id);
-    };
-  }, [step, kycPending, kycApproved, onboardingStatus, workflow, client, provider]);
-  async function loadCountries(resetSelection) {
-    setCountriesLoading(true);
-    try {
-      const { countries: list } = await client.getRampCountries();
-      setCountries(list);
-      const available = mergeRampCountries(list, routes);
-      const first = available[0];
-      const stillValid = available.some((c) => c.code === country);
-      if (first && (resetSelection || !stillValid)) {
-        setCountry(first.code);
-        if (first.currency) setCurrency(first.currency);
-      }
-    } catch {
-      setCountries([]);
-    } finally {
-      setCountriesLoading(false);
-    }
-  }
+    void loadPendingOrders();
+  }, [client]);
+  const orderId = order?.id ?? null;
   useEffect(() => {
-    loadCountries(true);
-  }, []);
-  function handleCountryChange(code) {
-    setCountry(code);
-    const match = countries.find((c) => c.code === code);
-    if (match?.currency) setCurrency(match.currency);
-  }
-  async function handleRefresh() {
-    if (refreshing) return;
-    setRefreshing(true);
-    try {
-      await loadCountries(false);
-      if (step === "select_route") {
-        const result = await quoteRampOptions(
-          client,
-          {
-            country,
-            amount: Number(amount),
-            amountExact: amount,
-            currency,
-            direction
-          },
-          routes
-        );
-        setQuotes(result.quotes ?? []);
-        setRequirementsRequired(result.requirementsRequired ?? []);
-      } else if (step === "status" && txId) {
-        const tx = await client.getRampTransaction(txId);
-        if (tx.transactionVersion !== void 0 && !acceptWorkflow(tx)) return;
-        setTxStatus(tx.status);
-        applySettlement(tx);
-        if (tx.kycUrl) setKycUrl(tx.kycUrl);
-        if (tx.depositInstructions) setDepositInstructions(tx.depositInstructions);
-      }
-    } catch {
-    } finally {
-      setRefreshing(false);
-    }
-  }
-  function resetToInput({ keepMessage = false } = {}) {
-    writeRampStorage(storageKey, null);
-    writeRampStorage(`${storageKey}:selection`, "1");
-    setStep("input");
-    setQuotes([]);
-    setRequirementsRequired([]);
-    setSelectedQuote(null);
-    setFieldValues({});
-    setWorkflow(null);
-    workflowRef.current = null;
-    setLegacySignature(void 0);
-    setTxId(null);
-    setProvider("");
-    setKycUrl(null);
-    setTosUrl(null);
-    setTxStatus(null);
-    setStellarTxHash(null);
-    setTxHash(null);
-    setTxChain(null);
-    setFundsInTransit(false);
-    setDepositInstructions(null);
-    setKycPending(false);
-    setKycApproved(false);
-    setNoticeMsg(null);
-    if (!keepMessage) setErrorMsg(null);
-  }
-  function dismissSavedRamp(id) {
-    if (completionLocked.current) return;
-    const pending = savedRampsOf(storageKey).filter((ramp) => ramp.txId !== id);
-    writeRampStorage(`${storageKey}:saved`, JSON.stringify(pending));
-    writeRampStorage(`${storageKey}:hidden`, JSON.stringify([.../* @__PURE__ */ new Set([...hiddenRampsOf(storageKey), id])]));
-    if (readRampStorage(storageKey) === id) writeRampStorage(storageKey, null);
-    setSavedRamps(pending);
-    if (txId === id) resetToInput();
-    setNoticeMsg(
-      "Removed from this tab\u2019s pending list. The operation may still be active at the provider; no payment was cancelled or refunded."
-    );
-  }
-  async function resumeWithSignature(id, ps) {
-    const outcome = await client.signTx(ps.unsignedXdr, { skipSponsorship: ps.action === "sep10" });
-    if (outcome.status === "cosign_pending") {
-      setErrorMsg("Approve the signature on your device, then resume.");
-      setStep("error");
+    if (step !== "status" || !orderId) return;
+    const controller = new AbortController();
+    client.pollRampOrder(orderId, {
+      signal: controller.signal,
+      onUpdate: (next) => {
+        setOrder(next);
+        setPollTrouble(false);
+      },
+      onError: () => setPollTrouble(true)
+    }).catch((error) => {
+      if (!controller.signal.aborted) setErrorMsg(rampErrorMessage(error, "This operation could not be read."));
+    });
+    return () => controller.abort();
+  }, [client, step, orderId, pollKey]);
+  const awaitingPayment = step === "status" && order?.pendingAction?.kind === "FIAT_PAYMENT";
+  useEffect(() => {
+    if (paymentCheckUntil === null || !orderId) return;
+    if (!awaitingPayment) {
+      setPaymentCheckUntil(null);
+      setPollKey((key) => key + 1);
       return;
     }
-    if (outcome.status !== "signed") {
-      setErrorMsg(outcome.message ?? outcome.details ?? "Signing was cancelled.");
-      setStep("error");
+    const timer = setInterval(() => {
+      if (Date.now() >= paymentCheckUntil) {
+        setPaymentCheckUntil(null);
+        return;
+      }
+      client.checkRampOrder(orderId).then(setOrder).catch(() => void 0);
+    }, PAYMENT_CHECK_EVERY_MS);
+    return () => clearInterval(timer);
+  }, [client, orderId, awaitingPayment, paymentCheckUntil]);
+  const approval = order?.pendingAction?.kind === "COSIGN_APPROVAL" ? order.pendingAction.actionId : null;
+  useEffect(() => {
+    if (!approval || promptedApproval.current === approval) return;
+    promptedApproval.current = approval;
+    void client.cosign.pending().catch(() => void 0).then(() => openCosignModal());
+  }, [approval, client, openCosignModal]);
+  const nextApproval = step === "status" && order ? rampNextApproval(order) : null;
+  useEffect(() => {
+    setCosignNextStep(nextApproval);
+  }, [nextApproval, setCosignNextStep]);
+  useEffect(() => () => setCosignNextStep(null), [setCosignNextStep]);
+  const resolvedRequest = cosign.lastResolved;
+  useEffect(() => {
+    if (!awaitingAccount || resolvedRequest?.id !== awaitingAccount.requestId) return;
+    setAwaitingAccount(null);
+    if (resolvedRequest.status !== "APPROVED") {
+      setErrorMsg("The new account was not approved, so this route cannot start.");
       return;
     }
-    const result = await client.submitRampSignature(id, {
-      signedXdr: outcome.signedXdr,
-      action: ps.action
-    });
-    await applyResult(result);
-  }
-  async function applyResult(result) {
-    if ("transactionVersion" in result && result.transactionVersion !== void 0 && !acceptWorkflow(result)) return;
-    setTxId(result.txId);
-    setProvider(result.provider);
-    setLegacySignature(result.pendingSignature);
-    setKycUrl(result.kycUrl ?? null);
-    setTosUrl(result.tosUrl ?? null);
-    setOnboardingStatus(result.onboardingStatus);
-    setKycPending(result.kycRequired === true);
-    if (result.kycRequired) setKycApproved(false);
-    setTxStatus(result.status);
-    setStellarTxHash(result.stellarTxHash ?? null);
-    setDepositInstructions(result.depositInstructions ?? null);
-    setStep("status");
-  }
-  async function loadQuotes() {
-    const result = await quoteRampOptions(
-      client,
-      {
-        country,
-        amount: Number(amount),
-        amountExact: amount,
-        currency,
-        direction
-      },
-      routes
-    );
-    const list = result.quotes ?? [];
-    const locked = result.requirementsRequired ?? [];
-    if (list.length === 0 && locked.length === 0) {
-      setErrorMsg(unavailableRampMessage(country, result.unavailable ?? []));
-      setStep("error");
-      return false;
-    }
-    setQuotes(list);
-    setRequirementsRequired(locked);
-    return true;
+    void resumeRoute(awaitingAccount.routeKey);
+  }, [awaitingAccount, resolvedRequest]);
+  function handleDirectionChange(next) {
+    setDirection(next);
+    setErrorMsg(null);
+    setAwaitingAccount(null);
   }
   async function handleFindRoute() {
+    if (!fiat || !asset) return [];
+    if (!DECIMAL.test(amount.trim()) || Number(amount) <= 0) {
+      setErrorMsg("Enter an amount greater than zero.");
+      return [];
+    }
     setStep("loading_quote");
-    setIsLoading(true);
     setErrorMsg(null);
+    setSelected(null);
     try {
-      if (!await loadQuotes()) return;
+      const result = await client.quoteRamp({
+        direction,
+        fiat: { currency: fiat.currency, rail: fiat.rail, country: fiat.country },
+        asset: { code: asset.code, identifier: asset.identifier, chain: asset.chain },
+        amount: { value: amount.trim(), denomination: "in" }
+      });
+      setQuotes(result.quotes);
+      setRejected(result.rejected);
       setStep("select_route");
-    } catch (e) {
-      setErrorMsg(rampErrorMessage(e, "Failed to fetch quotes."));
+      return result.quotes;
+    } catch (error) {
+      if (isPollarApiError(error) && error.code === "SDK_RAMPS_NO_ROUTE") {
+        setQuotes([]);
+        setRejected(Array.isArray(error.body.rejected) ? error.body.rejected : []);
+        setStep("select_route");
+        return [];
+      }
+      setErrorMsg(rampErrorMessage(error, "Could not find a route. Please try again."));
       setStep("error");
+      return [];
+    }
+  }
+  function handleVerifyRoute(requirement) {
+    setErrorMsg(null);
+    verifyAttempt.current = requirement;
+    setVerifying(requirement);
+  }
+  function closeVerification() {
+    verifyAttempt.current = null;
+    setVerifying(null);
+  }
+  function verificationDone(requirement) {
+    if (verifyAttempt.current !== requirement) return;
+    closeVerification();
+    void handleFindRoute();
+  }
+  async function handleTrustAsset(asset2) {
+    if (trustingAsset) return;
+    setTrustingAsset(`${asset2.code}:${asset2.issuer}`);
+    setErrorMsg(null);
+    try {
+      const outcome = await client.setTrustline(asset2);
+      if (outcome.status === "error") {
+        setErrorMsg(rampTrustlineErrorText(outcome, asset2.code));
+        return;
+      }
+      if (outcome.status === "cosign_pending") {
+        setErrorMsg(`Approve the ${asset2.code} trustline, then refresh the routes.`);
+        openCosignModal();
+        return;
+      }
+      await client.refreshAssets().catch(() => {
+      });
+      await handleFindRoute();
+    } catch (error) {
+      setErrorMsg(rampErrorMessage(error, `Could not add the ${asset2.code} trustline. Please try again.`));
     } finally {
-      setIsLoading(false);
+      setTrustingAsset(null);
     }
   }
-  function handleSelectQuote(quote) {
-    setSelectedQuote(quote);
+  async function handleWalletStep(walletStep, index, custody) {
+    if (walletBusy !== null) return;
+    setWalletBusy(index);
     setErrorMsg(null);
-    setNoticeMsg(null);
-    const broken = brokenLimitOf(Number(amount), quote);
-    if (broken) {
-      setErrorMsg(limitMessage(broken.limit, broken.value, currency));
-      return;
+    try {
+      const { recoveryRequired } = await client.runRampWalletStep(walletStep, custody);
+      if (recoveryRequired) {
+        setErrorMsg("Add a way to recover your wallet, then find the route again.");
+        openRecoveryModal();
+        return;
+      }
+      await handleFindRoute();
+    } catch (error) {
+      const code = isPollarApiError(error) ? error.code : null;
+      if (code === "SDK_RAMPS_WALLET_NOT_READY") {
+        setErrorMsg("Approve the new account, then find the route again.");
+        openCosignModal();
+        return;
+      }
+      setErrorMsg(
+        code === "SDK_WALLET_PROVISIONING_DISABLED" ? "This app does not create wallets." : rampErrorMessage(error, "Could not prepare the wallet. Please try again.")
+      );
+    } finally {
+      setWalletBusy(null);
     }
-    const fields = requiredFieldsOf(quote);
-    const missing = fields.some((f) => !f.optional && !(fieldValues[f.key] ?? "").trim());
-    if (fields.length > 0 && missing) {
-      setStep("contact");
+  }
+  async function resumeRoute(key) {
+    const same = (await handleFindRoute()).find((q) => routeKey(q) === key);
+    if (same) handleSelectQuote(same, true);
+    else setErrorMsg("That route is no longer available. Pick another one.");
+  }
+  function handleSelectQuote(quote, fresh = false) {
+    if (!fresh && Date.parse(quote.expiresAt) <= Date.now()) {
+      void resumeRoute(routeKey(quote));
       return;
     }
-    void startRamp(quote);
-  }
-  function handleContactContinue() {
-    if (selectedQuote) void startRamp(selectedQuote);
+    setSelected(quote);
+    setErrorMsg(null);
+    const missing = rampQuoteFields(quote).some((f) => !f.optional && !(fieldValues[f.key] ?? "").trim());
+    if (missing) setStep("contact");
+    else void startOrder(quote, fresh);
   }
-  async function startRamp(quote) {
+  async function startOrder(quote, fresh = false) {
     setIsLoading(true);
+    setStartingQuoteId(quote.quoteId);
     setErrorMsg(null);
+    setAwaitingAccount(null);
     try {
-      const body = {
+      const payee = Object.fromEntries(
+        rampQuoteFields(quote).map((f) => [f.key, (fieldValues[f.key] ?? "").trim()]).filter(([, value]) => value)
+      );
+      const created = await client.createRampOrder({
         quoteId: quote.quoteId,
-        amount: quote.fiatAmount ?? Number(amount),
-        ...quote.terms ? { amountExact: quote.terms.fiatAmount } : {},
-        currency,
-        country,
-        ...walletAddress ? { walletAddress } : {}
-      };
-      const extraFields = {};
-      for (const f of requiredFieldsOf(quote)) {
-        const val = (fieldValues[f.key] ?? "").trim();
-        if (!val) continue;
-        if (f.bankType) {
-          if (isBankType(f.bankType)) body.bankDetails = { type: f.bankType, value: val };
-        } else if (f.key === "email" || f.key === "fullName" || f.key === "taxId" || f.key === "qrCode") body[f.key] = val;
-        else extraFields[f.key] = val;
+        ...Object.keys(payee).length ? { payee } : {}
+      });
+      setOrder(created);
+      setStep("status");
+    } catch (error) {
+      if (isPollarApiError(error) && error.code === "SDK_RAMPS_WALLET_NOT_READY") {
+        const pending = await client.cosign.pending().catch(() => []);
+        const request = pending.find((r) => r.intent === "add_accounts");
+        if (request) setAwaitingAccount({ routeKey: routeKey(quote), requestId: request.id });
+        else setErrorMsg(rampErrorMessage(error, "Could not start the operation. Please try again."));
+        openCosignModal();
+        setStep("select_route");
+        return;
       }
-      if (quote.route)
-        body.fields = Object.fromEntries(
-          requiredFieldsOf(quote).map((field) => [field.key, (fieldValues[field.key] ?? "").trim()]).filter(([, value]) => value)
-        );
-      else if (Object.keys(extraFields).length > 0) body.fields = extraFields;
-      const onrampBody = {
-        quoteId: body.quoteId,
-        amount: body.amount,
-        currency: body.currency,
-        country: body.country,
-        ...body.amountExact !== void 0 ? { amountExact: body.amountExact } : {},
-        ...body.walletAddress !== void 0 ? { walletAddress: body.walletAddress } : {},
-        ...body.email !== void 0 ? { email: body.email } : {},
-        ...body.fullName !== void 0 ? { fullName: body.fullName } : {},
-        ...body.fields !== void 0 ? { fields: body.fields } : {}
-      };
-      const result = direction === "onramp" ? await client.createOnRamp(onrampBody) : await client.createOffRamp(body);
-      await applyResult(result);
-    } catch (e) {
-      const requirement = requiredRampKyc(e);
-      if (requirement) {
-        setStep(requiredFieldsOf(quote).length ? "contact" : "select_route");
-        setErrorMsg(
-          requirement.type === "KYC" ? "Identity verification is required before continuing." : "A few more details are required before continuing."
-        );
-        kycAttempt.current = requirement;
-        setPendingKyc(requirement);
+      if (isPollarApiError(error) && error.code === "SDK_RAMPS_QUOTE_EXPIRED" && !fresh) {
+        void resumeRoute(routeKey(quote));
         return;
       }
-      setErrorMsg(rampErrorMessage(e, "Failed to start the ramp."));
-      setStep("error");
+      setErrorMsg(rampErrorMessage(error, "Could not start the operation. Please try again."));
+      if (isPollarApiError(error) && error.code === "VALIDATION_ERROR" && rampQuoteFields(quote).length) setStep("contact");
+      else setStep("select_route");
     } finally {
       setIsLoading(false);
+      setStartingQuoteId(null);
     }
   }
-  async function requoteAfterKyc(completed = "KYC") {
-    setStep("loading_quote");
+  async function handleSign() {
+    const action = order?.pendingAction;
+    if (!order || action?.kind !== "SIGNATURE" || signing) return;
+    setSigning(true);
+    setErrorMsg(null);
+    try {
+      setOrder(await signLegWithWallet(client, order.id, action.actionId));
+    } catch (error) {
+      setErrorMsg(rampErrorMessage(error, error instanceof Error && error.message ? error.message : "Signing was cancelled."));
+      setOrder(await client.getRampOrder(order.id).catch(() => order));
+    } finally {
+      setSigning(false);
+    }
+  }
+  async function handleResumeOrder(id) {
     setIsLoading(true);
     setErrorMsg(null);
-    setSelectedQuote(null);
     try {
-      if (!await loadQuotes()) return;
-      setNoticeMsg(
-        completed === "KYC" ? "Your identity is verified. Prices may have changed, so choose a route to continue." : "Thanks, your details are saved. Prices may have changed, so choose a route to continue."
-      );
-      setStep("select_route");
-    } catch (e) {
-      setErrorMsg(rampErrorMessage(e, "Failed to fetch quotes."));
-      setStep("error");
+      const found = await client.getRampOrder(id);
+      setDirection(found.direction);
+      setOrder(found);
+      setStep("status");
+    } catch (error) {
+      setErrorMsg(rampErrorMessage(error, "Could not resume the operation."));
     } finally {
       setIsLoading(false);
     }
   }
-  function handleVerifyRoute(requirement) {
-    const attempt = pendingFromQuote(requirement);
+  function handleNewOrder() {
+    setAwaitingAccount(null);
+    setOrder(null);
+    setSelected(null);
+    setQuotes([]);
+    setRejected([]);
     setErrorMsg(null);
-    setNoticeMsg(null);
-    kycAttempt.current = attempt;
-    setPendingKyc(attempt);
+    setStep("input");
+    void loadPendingOrders();
   }
-  function handleOpenKyc() {
-    if (kycUrl) window.open(kycUrl, "_blank", "noopener,noreferrer");
+  function handleBack() {
+    setErrorMsg(null);
+    setAwaitingAccount(null);
+    setStep(step === "contact" ? "select_route" : "input");
   }
-  function handleOpenTos() {
-    if (tosUrl) window.open(tosUrl, "_blank", "noopener,noreferrer");
+  function handleStepSelect(target) {
+    setErrorMsg(null);
+    setAwaitingAccount(null);
+    setStep(target === "Route" ? "select_route" : "input");
   }
-  async function handleLegacySignature() {
-    if (!txId || !legacySignature || completionLocked.current) return;
-    completionLocked.current = true;
-    setCompleting(true);
+  async function handleCheckPayment() {
+    if (!order || paymentCheckUntil !== null) return;
     setErrorMsg(null);
+    setPaymentCheckUntil(Date.now() + PAYMENT_CHECK_WINDOW_MS);
     try {
-      await resumeWithSignature(txId, legacySignature);
-    } catch (e) {
-      setErrorMsg(rampErrorMessage(e, "Failed to submit the signature."));
-      setStep("error");
-    } finally {
-      completionLocked.current = false;
-      setCompleting(false);
+      setOrder(await client.checkRampOrder(order.id));
+    } catch (error) {
+      setPaymentCheckUntil(null);
+      setErrorMsg(rampErrorMessage(error, "Could not check the payment. Please try again."));
     }
   }
-  async function handleCompleteWithdraw() {
-    if (!txId || completionLocked.current) return;
-    completionLocked.current = true;
-    setCompleting(true);
+  async function handleRetryOrder() {
+    if (!order || retrying) return;
+    setRetrying(true);
     setErrorMsg(null);
     try {
-      const result = await client.completeWithdraw(txId);
-      if (result.pendingSignature) {
-        await resumeWithSignature(txId, result.pendingSignature);
-        return;
-      }
-      setTxStatus(result.status);
-      setStellarTxHash(result.stellarTxHash ?? null);
-    } catch (e) {
-      const msg = e instanceof Error ? e.message : "";
-      setErrorMsg(
-        msg.includes("KYC") ? "Finish KYC at the provider first, then try again." : msg || "Failed to complete the withdrawal."
-      );
+      setOrder(await client.retryRampOrder(order.id));
+      setPollKey((key) => key + 1);
+    } catch (error) {
+      setErrorMsg(rampErrorMessage(error, "Could not try again. Please try again."));
     } finally {
-      completionLocked.current = false;
-      setCompleting(false);
+      setRetrying(false);
     }
   }
-  const kycBlocking = kycPending && !kycApproved;
-  const canComplete = !workflow && !legacySignature && direction === "offramp" && step === "status" && txStatus !== "completed" && txStatus !== "failed" && !stellarTxHash && !txHash && !kycPending;
-  const flowSteps = flowStepsOf(quotes, selectedQuote);
-  const flowStepIndex = flowSteps.indexOf(STEP_LABEL[step] ?? "");
-  if (pendingKyc?.type === "FORM") {
-    return /* @__PURE__ */ jsx(
-      RequirementFormModal,
-      {
-        formId: pendingKyc.optionId,
-        ...pendingKyc.progress ? { progress: pendingKyc.progress } : {},
-        onClose: () => {
-          kycAttempt.current = null;
-          setPendingKyc(null);
-        },
-        onSubmitted: () => {
-          if (kycAttempt.current !== pendingKyc) return;
-          kycAttempt.current = null;
-          setPendingKyc(null);
-          void requoteAfterKyc("FORM");
-        }
+  const heldForRecovery = step === "status" && order?.failure?.resolutionAction === "set_up_recovery";
+  const wasRecoveryLocked = useRef(recoveryLocked);
+  useEffect(() => {
+    if (heldForRecovery && wasRecoveryLocked.current && !recoveryLocked && recovery) void handleRetryOrder();
+    wasRecoveryLocked.current = recoveryLocked;
+  }, [heldForRecovery, recoveryLocked, recovery]);
+  async function handleRefresh() {
+    if (refreshing) return;
+    setRefreshing(true);
+    try {
+      if (step === "status" && order) {
+        setOrder(await client.getRampOrder(order.id));
+        setPollKey((key) => key + 1);
+      } else if (step === "select_route") await handleFindRoute();
+      else {
+        await loadRoutes(direction);
+        await loadPendingOrders();
+        if (direction === "OFFRAMP") await refreshWalletBalance();
       }
-    );
-  }
-  if (pendingKyc?.type === "REGISTRY_CHECK" || pendingKyc?.type === "PROVIDER_REGISTRATION") {
-    const close = () => {
-      kycAttempt.current = null;
-      setPendingKyc(null);
-    };
-    const done = () => {
-      if (kycAttempt.current !== pendingKyc) return;
-      close();
-      void requoteAfterKyc(pendingKyc.type);
-    };
-    const progress = pendingKyc.progress ? { progress: pendingKyc.progress } : {};
-    return pendingKyc.type === "REGISTRY_CHECK" ? /* @__PURE__ */ jsx(RegistryCheckModal, { optionId: pendingKyc.optionId, ...progress, onClose: close, onApproved: done }) : /* @__PURE__ */ jsx(ProviderRegistrationModal, { corridorId: pendingKyc.corridorId, ...progress, onClose: close, onRegistered: done });
+    } catch (error) {
+      setErrorMsg(rampErrorMessage(error, "Could not refresh."));
+    } finally {
+      setRefreshing(false);
+    }
   }
-  if (pendingKyc) {
+  const flowSteps = fields.length || quotes.some((q) => rampQuoteFields(q).length) ? ["Amount", "Route", "Details", "Complete"] : ["Amount", "Route", "Complete"];
+  const stepLabel = {
+    input: "Amount",
+    loading_quote: "Amount",
+    select_route: "Route",
+    contact: "Details",
+    status: "Complete"
+  };
+  const label = stepLabel[step];
+  if (verifying) {
+    const progress = { progress: { position: verifying.completed + 1, total: verifying.total } };
+    const done = () => verificationDone(verifying);
+    if (verifying.type === "FORM")
+      return /* @__PURE__ */ jsx(RequirementFormModal, { formId: verifying.optionId, ...progress, onClose: closeVerification, onSubmitted: done });
+    if (verifying.type === "REGISTRY_CHECK")
+      return /* @__PURE__ */ jsx(RegistryCheckModal, { optionId: verifying.optionId, ...progress, onClose: closeVerification, onApproved: done });
+    if (verifying.type === "PROVIDER_REGISTRATION")
+      return /* @__PURE__ */ jsx(
+        ProviderRegistrationModal,
+        {
+          corridorId: verifying.corridorId,
+          ...progress,
+          onClose: closeVerification,
+          onRegistered: done
+        }
+      );
     return /* @__PURE__ */ jsx(
       KycModal,
       {
         country,
-        corridorId: pendingKyc.corridorId,
-        providerId: pendingKyc.optionId,
-        onClose: () => {
-          kycAttempt.current = null;
-          setPendingKyc(null);
-        },
-        onApproved: () => {
-          if (kycAttempt.current !== pendingKyc) return;
-          kycAttempt.current = null;
-          setPendingKyc(null);
-          void requoteAfterKyc();
-        }
+        corridorId: verifying.corridorId,
+        providerId: verifying.optionId,
+        onClose: closeVerification,
+        onApproved: done
       }
     );
   }
   return /* @__PURE__ */ jsx("div", { className: "pollar-overlay", style: overlayStyle, onClick: onClose, children: /* @__PURE__ */ jsx(
     RampWidgetTemplate,
     {
-      workflowContent: workflow ? /* @__PURE__ */ jsx(
-        RampWorkflow,
-        {
-          client,
-          snapshot: workflow,
-          onBusyChange: (busy) => {
-            completionLocked.current = busy;
-            setCompleting(busy);
-          },
-          onChange: (next) => {
-            if (acceptWorkflow(next)) setTxStatus(next.status);
-          }
-        }
-      ) : legacySignature && step === "status" && txStatus !== "completed" && txStatus !== "failed" ? /* @__PURE__ */ jsx("button", { type: "button", disabled: completing, onClick: () => void handleLegacySignature(), children: "Authorize wallet request" }) : void 0,
       theme,
       accentColor,
-      styleOverrides,
+      ...styleOverrides ? { styleOverrides } : {},
+      network,
       step,
       flowSteps,
-      flowStepIndex,
-      startingQuoteId: isLoading && selectedQuote ? selectedQuote.quoteId : null,
+      flowStepIndex: label ? flowSteps.indexOf(label) : -1,
       direction,
-      amount,
-      currency,
-      country,
-      requiredFields: selectedQuote ? requiredFieldsOf(selectedQuote) : [],
-      fieldValues,
+      routesLoading,
       countries,
-      countriesLoading,
-      refreshing,
+      country,
+      fiats,
+      fiat,
+      assets,
+      asset,
+      amount,
+      sellAvailable,
       quotes,
-      kycRequired: requirementsRequired,
+      rejected,
+      startingQuoteId,
+      fields,
+      fieldValues,
+      order,
+      pendingOrders,
       isLoading,
-      provider,
-      txStatus,
-      kycUrl,
-      tosUrl,
-      kycBlocking,
-      onboardingStatus: onboardingStatus ?? null,
-      kycJustApproved: kycPending && kycApproved,
-      stellarTxHash,
-      txHash,
-      txChain,
-      explorerUrl: explorerTxUrl2(txChain ?? "STELLAR", txHash ?? stellarTxHash, network),
-      fundsInTransit,
-      retrying,
-      onRetryTransit: handleRetryTransit,
-      depositInstructions,
-      canComplete,
-      completing,
-      savedRamps,
-      onResumeRamp: resumeSavedRamp,
-      onDismissRamp: dismissSavedRamp,
-      onDismissCurrentRamp: workflow ? () => dismissSavedRamp(workflow.txId) : void 0,
-      onExploreRoutes: workflow ? () => {
-        if (!completionLocked.current) resetToInput();
-      } : void 0,
+      refreshing,
+      signing,
       errorMsg,
-      noticeMsg,
-      onDirectionChange: (next) => {
-        setDirection(next);
+      notice: awaitingAccount ? "Approve the new account on your device. The order starts once it is approved." : null,
+      onDirectionChange: handleDirectionChange,
+      onCountryChange: (next) => {
+        setCountry(next);
+        setFiatChoice("");
+        setAssetChoice("");
+      },
+      onFiatChange: (key) => {
+        setFiatChoice(key);
+        setAssetChoice("");
       },
-      onAmountChange: (next) => {
-        setAmount(next);
+      onAssetChange: setAssetChoice,
+      onAmountChange: (value) => {
+        setAmount(value);
         setErrorMsg(null);
       },
-      onFieldChange: setFieldValue,
-      onCountryChange: handleCountryChange,
-      onFindRoute: handleFindRoute,
-      onSelectQuote: handleSelectQuote,
+      onFindRoute: () => void handleFindRoute(),
+      onSelectQuote: (quote) => handleSelectQuote(quote),
       onVerifyRoute: handleVerifyRoute,
-      onContactContinue: handleContactContinue,
-      onOpenKyc: handleOpenKyc,
-      onOpenTos: handleOpenTos,
-      onCompleteWithdraw: handleCompleteWithdraw,
-      onBack: () => resetToInput({ keepMessage: true }),
-      onRetry: () => resetToInput(),
-      onRefresh: handleRefresh,
+      trustingAsset,
+      onTrustAsset: (asset2) => void handleTrustAsset(asset2),
+      walletBusy,
+      custodyChoice,
+      onWalletStep: (walletStep, index, custody) => void handleWalletStep(walletStep, index, custody),
+      noChains: Array.isArray(appChains) && appChains.length === 0,
+      onFieldChange: (key, value) => setFieldValues((current) => ({ ...current, [key]: value })),
+      onContactContinue: () => {
+        if (selected) void startOrder(selected);
+      },
+      onSign: () => void handleSign(),
+      onApprove: openCosignModal,
+      retrying,
+      onRetryOrder: () => void handleRetryOrder(),
+      onSetUpRecovery: openRecoveryModal,
+      recoveryMissing: recovery === null ? null : recoveryLocked,
+      pollTrouble,
+      checkingPayment: paymentCheckUntil !== null,
+      onCheckPayment: () => void handleCheckPayment(),
+      onResumeOrder: (id) => void handleResumeOrder(id),
+      onNewOrder: handleNewOrder,
+      onBack: handleBack,
+      onStepSelect: handleStepSelect,
+      onRetry: () => {
+        setErrorMsg(null);
+        setStep("input");
+      },
+      onRefresh: () => void handleRefresh(),
       onClose
     }
   ) });
@@ -5513,6 +5296,49 @@ function walletNotReadyReason(wallet, chain) {
   }
   return null;
 }
+
+// src/lib/qr-code/index.tsx
+var import_ErrorCorrectLevel = __toESM(require_ErrorCorrectLevel());
+var import_QRCode = __toESM(require_QRCode());
+var QRCodeSvg = forwardRef(function QRCodeSvg2({ bgColor, bgD, fgD, fgColor, size, title, viewBoxSize, xmlns = "http://www.w3.org/2000/svg", ...props }, ref) {
+  return /* @__PURE__ */ jsxs("svg", { ...props, height: size, ref, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: size, xmlns, children: [
+    title ? /* @__PURE__ */ jsx("title", { children: title }) : null,
+    /* @__PURE__ */ jsx("path", { d: bgD, fill: bgColor }),
+    /* @__PURE__ */ jsx("path", { d: fgD, fill: fgColor })
+  ] });
+});
+QRCodeSvg.displayName = "QRCodeSvg";
+function bytesToBinaryString(bytes) {
+  return bytes.map((b) => String.fromCharCode(b & 255)).join("");
+}
+function encodeStringToUtf8Bytes(input) {
+  return Array.from(new TextEncoder().encode(input));
+}
+var QRCode = forwardRef(function QRCode2({ bgColor = "#FFFFFF", fgColor = "#000000", level = "L", size = 256, value, ...props }, ref) {
+  const qrcode = new import_QRCode.default(-1, import_ErrorCorrectLevel.default[level]);
+  const utf8Bytes = encodeStringToUtf8Bytes(value);
+  const binaryString = bytesToBinaryString(utf8Bytes);
+  qrcode.addData(binaryString, "Byte");
+  qrcode.make();
+  const cells = qrcode.modules;
+  return /* @__PURE__ */ jsx(
+    QRCodeSvg,
+    {
+      ...props,
+      bgColor,
+      bgD: cells.map(
+        (row, rowIndex) => row.map((cell, cellIndex) => !cell ? `M ${cellIndex} ${rowIndex} l 1 0 0 1 -1 0 Z` : "").join(" ")
+      ).join(" "),
+      fgColor,
+      fgD: cells.map(
+        (row, rowIndex) => row.map((cell, cellIndex) => cell ? `M ${cellIndex} ${rowIndex} l 1 0 0 1 -1 0 Z` : "").join(" ")
+      ).join(" "),
+      ref,
+      size,
+      viewBoxSize: cells.length
+    }
+  );
+});
 function PollarLogo(props) {
   return /* @__PURE__ */ jsxs("svg", { width: "45", height: "48", viewBox: "0 0 45 48", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
     /* @__PURE__ */ jsx(
@@ -5912,7 +5738,7 @@ function formatBalance(balance) {
   const n = parseFloat(balance);
   return isNaN(n) ? balance : n.toLocaleString(void 0, { maximumFractionDigits: 7 });
 }
-function assetKey3(record) {
+function assetKey4(record) {
   return `${record.code}:${record.issuer ?? "native"}`;
 }
 function chainLabel(chain) {
@@ -5983,8 +5809,8 @@ function SendAssetSelector({ assets, selectedAsset, loading, onSelectAsset }) {
         }
       ),
       open && assets.length > 0 && /* @__PURE__ */ jsx("div", { className: "pollar-send-asset-menu", role: "listbox", "aria-label": "Assets", children: assets.map((asset) => {
-        const key = assetKey3(asset);
-        const selected = selectedAsset ? key === assetKey3(selectedAsset) : false;
+        const key = assetKey4(asset);
+        const selected = selectedAsset ? key === assetKey4(selectedAsset) : false;
         return /* @__PURE__ */ jsxs(
           "button",
           {
@@ -6028,6 +5854,9 @@ function SendModalTemplate({
   destination,
   formError,
   isLoadingBalance,
+  isCheckingDestination = false,
+  minStartingBalance = 1,
+  onCreateAccount,
   transaction,
   showXdr,
   copied,
@@ -6057,8 +5886,10 @@ function SendModalTemplate({
   const cssVars = buildModalCssVars(theme, accentColor, styleOverrides);
   const parsedAmount = amount ? Number(amount) : 0;
   const availableAmount = selectedAsset?.available === null || selectedAsset?.available === void 0 ? 0 : Number(selectedAsset.available);
-  const canSubmit = canSendOnChain && !notReadyReason && !!selectedAsset && Number.isFinite(parsedAmount) && parsedAmount > 0 && parsedAmount <= availableAmount && !!destination.trim() && !isLoadingBalance;
-  const title = step === "form" ? "Send" : txTitle;
+  const canSubmit = canSendOnChain && !notReadyReason && !!selectedAsset && Number.isFinite(parsedAmount) && parsedAmount > 0 && parsedAmount <= availableAmount && !!destination.trim() && !isLoadingBalance && !isCheckingDestination;
+  const title = step === "form" ? "Send" : step === "create-account" ? "Create account?" : txTitle;
+  const createsWithNative = selectedAsset?.type === "native";
+  const meetsMinimum = Number.isFinite(parsedAmount) && parsedAmount >= minStartingBalance;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -6108,44 +5939,18 @@ function SendModalTemplate({
               onSelectAsset
             }
           ),
-          /* @__PURE__ */ jsxs("div", { className: "pollar-send-field", children: [
-            /* @__PURE__ */ jsxs("div", { className: "pollar-send-label-row", children: [
-              /* @__PURE__ */ jsx("label", { className: "pollar-send-label", children: "Amount" }),
-              selectedAsset && /* @__PURE__ */ jsxs("span", { className: "pollar-send-hint", children: [
-                "Available: ",
-                formatBalance(selectedAsset.available),
-                " ",
-                selectedAsset.code
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "pollar-send-input-shell", children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  className: "pollar-input pollar-send-amount-input",
-                  type: "text",
-                  inputMode: "decimal",
-                  placeholder: "0.00",
-                  value: amount,
-                  onChange: (e) => onAmountChange(e.target.value),
-                  "aria-label": "Amount"
-                }
-              ),
-              /* @__PURE__ */ jsxs("div", { className: "pollar-send-input-suffix", children: [
-                /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    className: "pollar-send-inline-action",
-                    onClick: onMax,
-                    disabled: !selectedAsset?.available,
-                    children: "Max"
-                  }
-                ),
-                /* @__PURE__ */ jsx("span", { children: selectedAsset?.code ?? "" })
-              ] })
-            ] })
-          ] }),
+          /* @__PURE__ */ jsx(
+            AmountField,
+            {
+              id: "pollar-send-amount",
+              label: "Amount",
+              value: amount,
+              onChange: onAmountChange,
+              unit: selectedAsset?.code,
+              available: selectedAsset ? selectedAsset.available : void 0,
+              onMax
+            }
+          ),
           /* @__PURE__ */ jsxs("div", { className: "pollar-send-field", children: [
             /* @__PURE__ */ jsx("label", { className: "pollar-send-label", children: "Destination wallet" }),
             /* @__PURE__ */ jsxs("div", { className: "pollar-send-input-shell", children: [
@@ -6197,7 +6002,41 @@ function SendModalTemplate({
             ] })
           ] }),
           formError && /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: formError }),
-          /* @__PURE__ */ jsx("div", { className: "pollar-modal-actions", children: /* @__PURE__ */ jsx("button", { className: "pollar-btn-primary", onClick: onSubmit, disabled: !canSubmit, children: "Continue" }) })
+          /* @__PURE__ */ jsx("div", { className: "pollar-modal-actions", children: /* @__PURE__ */ jsx("button", { className: "pollar-btn-primary", onClick: onSubmit, disabled: !canSubmit, children: isCheckingDestination ? "Checking destination\u2026" : "Continue" }) })
+        ] }),
+        step === "create-account" && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs("div", { className: "pollar-send-notice", children: [
+            /* @__PURE__ */ jsx("p", { className: "pollar-send-notice-title", children: "This account doesn't exist yet" }),
+            /* @__PURE__ */ jsx("p", { className: "pollar-send-notice-address", children: destination.trim() }),
+            createsWithNative ? /* @__PURE__ */ jsxs("p", { children: [
+              "A Stellar account has to be created and funded before it can receive payments. Instead of a payment, this will",
+              " ",
+              /* @__PURE__ */ jsx("strong", { children: "create the account" }),
+              " with ",
+              amount,
+              " XLM as its starting balance."
+            ] }) : /* @__PURE__ */ jsxs("p", { children: [
+              "It can't receive ",
+              selectedAsset?.code ?? "this asset",
+              " yet: it has to be created and funded with XLM first, and then add a trustline for ",
+              selectedAsset?.code ?? "the asset",
+              "."
+            ] }),
+            createsWithNative && !meetsMinimum && /* @__PURE__ */ jsxs("p", { className: "pollar-send-notice-warning", children: [
+              "A new account needs a starting balance of at least ",
+              minStartingBalance,
+              " XLM. Go back and raise the amount to create it."
+            ] }),
+            /* @__PURE__ */ jsx("p", { children: "Or wait until another wallet funds it, and send afterwards." })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "pollar-send-account-actions", children: [
+            createsWithNative && onCreateAccount && /* @__PURE__ */ jsxs("button", { className: "pollar-btn-primary", onClick: onCreateAccount, disabled: !meetsMinimum, children: [
+              "Create account with ",
+              amount,
+              " XLM"
+            ] }),
+            /* @__PURE__ */ jsx("button", { className: "pollar-btn-secondary", onClick: onBack, children: "I'll wait until it's funded" })
+          ] })
         ] }),
         step === "tx" && /* @__PURE__ */ jsx(
           TxStatusView,
@@ -6234,6 +6073,7 @@ function parseMemo(type, raw) {
   if (!/^\d+$/.test(value) || BigInt(value) > MAX_MEMO_ID) return "The memo ID must be a whole number up to 2^64 - 1.";
   return { type, value };
 }
+var MIN_STARTING_BALANCE_XLM = 1;
 function assetParam(record) {
   if (record.type === "native") return { type: "native" };
   if (record.type === "credit_alphanum4") {
@@ -6251,11 +6091,14 @@ function SendModal({ onClose }) {
     tx: transaction,
     wallet,
     network,
-    styles
+    styles,
+    getClient
   } = usePollar();
   const walletType = wallet?.custody === "external" ? wallet.provider : null;
   const { theme, accentColor, styleOverrides, overlayStyle } = modalChrome(styles);
   const [step, setStep] = useState("form");
+  const [createsAccount, setCreatesAccount] = useState(false);
+  const [checkingDestination, setCheckingDestination] = useState(false);
   const [amount, setAmount] = useState("");
   const [destination, setDestination] = useState("");
   const [memo, setMemo] = useState("");
@@ -6311,8 +6154,15 @@ function SendModal({ onClose }) {
     "building-signing-submitting"
   ];
   const isInProgress = IN_FLIGHT_STEPS3.includes(transaction.step);
-  const showBack = step === "tx" && (transaction.step === "error" || transaction.step === "success") && !isInProgress;
-  const txTitle = isInProgress ? "Sending\u2026" : transaction.step === "success" ? "Sent!" : transaction.step === "error" ? "Send failed" : "Confirm Send";
+  const showBack = step === "create-account" || step === "tx" && (transaction.step === "error" || transaction.step === "success") && !isInProgress;
+  const txTitle = createsAccount ? isInProgress ? "Creating account\u2026" : transaction.step === "success" ? "Account created!" : transaction.step === "error" ? "Create account failed" : "Confirm Create Account" : isInProgress ? "Sending\u2026" : transaction.step === "success" ? "Sent!" : transaction.step === "error" ? "Send failed" : "Confirm Send";
+  async function stellarAccountExists(address) {
+    try {
+      return (await getClient().getWalletBalance(address)).exists;
+    } catch {
+      return null;
+    }
+  }
   async function handleSubmit() {
     setFormError("");
     if (!canSendOnChain) {
@@ -6359,6 +6209,16 @@ function SendModal({ onClose }) {
         return;
       }
     }
+    if (selectedChain === "STELLAR") {
+      setCheckingDestination(true);
+      const exists = await stellarAccountExists(destination.trim());
+      setCheckingDestination(false);
+      if (exists === false) {
+        setStep("create-account");
+        return;
+      }
+    }
+    setCreatesAccount(false);
     setStep("tx");
     if (selectedChain === "SOLANA" || selectedChain === "POLYGON") {
       await sendPayment({
@@ -6377,6 +6237,17 @@ function SendModal({ onClose }) {
       parsedMemo ? { memo: parsedMemo } : void 0
     );
   }
+  async function handleCreateAccount() {
+    const parsedMemo = parseMemo(memoType, memo);
+    if (typeof parsedMemo === "string" || parseFloat(amount) < MIN_STARTING_BALANCE_XLM) return;
+    setCreatesAccount(true);
+    setStep("tx");
+    await buildTx(
+      "create_account",
+      { destination: destination.trim(), startingBalance: amount },
+      parsedMemo ? { memo: parsedMemo } : void 0
+    );
+  }
   function handleSignAndSend() {
     if (transaction.step === "built") {
       void signAndSubmitTx(transaction.buildData.unsignedXdr);
@@ -6431,6 +6302,7 @@ function SendModal({ onClose }) {
   }
   function handleBack() {
     setStep("form");
+    setCreatesAccount(false);
     setShowXdr(false);
     setCopied(false);
   }
@@ -6453,6 +6325,9 @@ function SendModal({ onClose }) {
       destination,
       formError,
       isLoadingBalance: walletBalance.step === "loading",
+      isCheckingDestination: checkingDestination,
+      minStartingBalance: MIN_STARTING_BALANCE_XLM,
+      onCreateAccount: () => void handleCreateAccount(),
       transaction,
       showXdr,
       copied,
@@ -6740,7 +6615,7 @@ function SwapModalTemplate({
                 ] })
               ] }),
               /* @__PURE__ */ jsxs("div", { className: "pollar-swap-panel-main", children: [
-                /* @__PURE__ */ jsx("div", { className: `pollar-swap-output${quoteLoading ? " is-loading" : ""}`, "aria-live": "polite", children: quoteLoading ? /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }) : formatAmount2(quote?.amountOut) }),
+                /* @__PURE__ */ jsx("div", { className: `pollar-swap-output${quoteLoading ? " is-loading" : ""}`, "aria-live": "polite", children: quoteLoading ? /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }) : quote ? `~${formatAmount2(quote.amountOut)}` : "\u2014" }),
                 /* @__PURE__ */ jsxs("div", { className: "pollar-swap-panel-selector", children: [
                   /* @__PURE__ */ jsx(
                     AssetPill,
@@ -7204,7 +7079,6 @@ function EarnModal({ onClose }) {
     earnWithdraw,
     tx: transaction,
     wallet,
-    walletBalance,
     refreshWalletBalance,
     enabledAssets,
     refreshAssets,
@@ -7286,13 +7160,9 @@ function EarnModal({ onClose }) {
   const withdrawUnit = position?.withdrawUnit ?? "asset";
   const assetCode = selectedOpportunity?.asset.code ?? "";
   const amountUnitLabel = tab === "deposit" ? assetCode : withdrawUnit === "shares" ? "shares" : assetCode;
-  const walletAvailable = (() => {
-    if (!selectedOpportunity) return null;
-    const balances = walletBalance.step === "loaded" ? walletBalance.data.balances : [];
-    const issuer = selectedOpportunity.asset.issuer;
-    const rec = balances.find((b) => issuer === null ? b.type === "native" : b.code === assetCode && b.issuer === issuer);
-    return rec ? rec.available : null;
-  })();
+  const walletAvailable = useWalletAvailable(
+    selectedOpportunity ? { chain: "STELLAR", code: assetCode, issuer: selectedOpportunity.asset.issuer } : null
+  );
   const depositAssetRecord = (() => {
     if (!selectedOpportunity?.asset.issuer || enabledAssets.step !== "loaded") return void 0;
     return enabledAssets.data.assets.find(
@@ -7526,37 +7396,17 @@ function EarnModal({ onClose }) {
               ] })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs("div", { className: "pollar-send-field", children: [
-            /* @__PURE__ */ jsxs("div", { className: "pollar-send-label-row", children: [
-              /* @__PURE__ */ jsx("label", { className: "pollar-send-label", children: tab === "deposit" ? "Amount" : "Withdraw amount" }),
-              tab === "deposit" && walletAvailable != null && /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-swap-custom-toggle", onClick: () => setAmount(walletAvailable), children: [
-                "Max: ",
-                formatAmount3(walletAvailable),
-                " ",
-                amountUnitLabel
-              ] }),
-              tab === "withdraw" && position && /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-swap-custom-toggle", onClick: () => setAmount(position.withdrawable), children: [
-                "Max: ",
-                formatAmount3(position.withdrawable),
-                " ",
-                amountUnitLabel
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "pollar-earn-amount", children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  className: "pollar-input",
-                  type: "text",
-                  inputMode: "decimal",
-                  placeholder: "0.00",
-                  value: amount,
-                  onChange: (e) => setAmount(e.target.value)
-                }
-              ),
-              amountUnitLabel && /* @__PURE__ */ jsx("span", { className: "pollar-earn-amount-unit", children: amountUnitLabel })
-            ] })
-          ] }),
+          /* @__PURE__ */ jsx(
+            AmountField,
+            {
+              id: "pollar-earn-amount",
+              label: tab === "deposit" ? "Amount" : "Withdraw amount",
+              value: amount,
+              onChange: setAmount,
+              unit: amountUnitLabel,
+              available: tab === "deposit" ? walletAvailable : position ? position.withdrawable : void 0
+            }
+          ),
           formError && /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: formError }),
           depositNeedsTrustline && selectedOpportunity && /* @__PURE__ */ jsxs("div", { className: "pollar-swap-trustline-notice", children: [
             "To deposit ",
@@ -7588,7 +7438,7 @@ function EarnModal({ onClose }) {
 }
 
 // src/components/card-modal/card-kyc.ts
-var nonEmpty2 = (value) => typeof value === "string" && !!value.trim();
+var nonEmpty = (value) => typeof value === "string" && !!value.trim();
 function requiredCardStep(error) {
   if (!error || typeof error !== "object") return null;
   if (!("code" in error) || error.code !== "SDK_CARDS_REQUIREMENT_REQUIRED") return null;
@@ -7597,7 +7447,7 @@ function requiredCardStep(error) {
   const cardProviderId = "cardProviderId" in body ? body.cardProviderId : void 0;
   const requirementType = "requirementType" in body ? body.requirementType : void 0;
   const optionId = "optionId" in body ? body.optionId : void 0;
-  if (!nonEmpty2(cardProviderId) || !nonEmpty2(optionId)) return null;
+  if (!nonEmpty(cardProviderId) || !nonEmpty(optionId)) return null;
   if (requirementType === "KYC" || requirementType === "FORM" || requirementType === "REGISTRY_CHECK" || requirementType === "PROVIDER_REGISTRATION") {
     return { cardProviderId, type: requirementType, optionId };
   }
@@ -7752,6 +7602,8 @@ function CardModal({ onClose }) {
   const [error, setError] = useState("");
   const revealTimer = useRef(null);
   const provider = providers?.[0] ?? null;
+  const fundingAsset = provider?.fundingAssets[0] ?? "USDC";
+  const fundAvailable = useWalletAvailable(panel === "fund" ? { chain: "STELLAR", code: fundingAsset } : null);
   const card = cards?.[0] ?? null;
   const loadHolder = useCallback(async () => {
     const h = await getClient().getCardHolder();
@@ -8277,19 +8129,18 @@ function CardModal({ onClose }) {
             provider.fundingAssets.join(" or ") || "USDC",
             " from your wallet to your card. It takes a few minutes to cross to the card network."
           ] }),
-          /* @__PURE__ */ jsxs("label", { className: "pollar-send-field", children: [
-            /* @__PURE__ */ jsx("span", { className: "pollar-send-label", children: "Amount (USDC)" }),
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                className: "pollar-input",
-                inputMode: "decimal",
-                placeholder: "10",
-                value: fundAmount,
-                onChange: (e) => setFundAmount(e.target.value.replace(/[^0-9.]/g, ""))
-              }
-            )
-          ] }),
+          /* @__PURE__ */ jsx(
+            AmountField,
+            {
+              id: "pollar-card-fund-amount",
+              label: "Amount",
+              value: fundAmount,
+              onChange: (value) => setFundAmount(value.replace(/[^0-9.]/g, "")),
+              unit: fundingAsset,
+              available: fundAvailable,
+              placeholder: "10"
+            }
+          ),
           /* @__PURE__ */ jsx("div", { className: "pollar-modal-actions", children: /* @__PURE__ */ jsx(
             "button",
             {
@@ -8711,6 +8562,12 @@ function detailRows(request) {
 function CloseIcon2() {
   return /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": true, children: /* @__PURE__ */ jsx("path", { d: "m3 3 8 8M11 3l-8 8", stroke: "currentColor", strokeWidth: "1.7", strokeLinecap: "round" }) });
 }
+function VerifiedIcon() {
+  return /* @__PURE__ */ jsxs("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "7", cy: "7", r: "7", fill: "currentColor" }),
+    /* @__PURE__ */ jsx("path", { d: "M3.5 7l2.5 2.5 4.5-5", stroke: "white", strokeWidth: "1.4", strokeLinecap: "round", strokeLinejoin: "round" })
+  ] });
+}
 function CosignModalTemplate({
   theme,
   accentColor,
@@ -8723,6 +8580,8 @@ function CosignModalTemplate({
   approveBlocked = false,
   lastResolved,
   explorerUrl,
+  closesIn = null,
+  nextStep = null,
   onSelect,
   onApprove,
   onReject,
@@ -8731,6 +8590,8 @@ function CosignModalTemplate({
   const cssVars = buildModalCssVars(theme, accentColor, styleOverrides);
   const verified = verification?.ok === true;
   const canVote = !!current && verified && !busy && !approveBlocked;
+  const [verifiedOpenFor, setVerifiedOpenFor] = useState(null);
+  const verifiedOpen = !!current && verifiedOpenFor === current.id;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -8743,27 +8604,48 @@ function CosignModalTemplate({
           /* @__PURE__ */ jsx("h2", { className: "pollar-modal-title", children: "Confirm with your device" }),
           /* @__PURE__ */ jsx("div", { className: "pollar-modal-header-actions", children: /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-modal-close", onClick: onClose, "aria-label": "Close", title: "Close", children: /* @__PURE__ */ jsx(CloseIcon2, {}) }) })
         ] }),
-        pending.length === 0 && /* @__PURE__ */ jsx("div", { className: "pollar-cosign-empty", children: lastResolved ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          lastResolved.status === "APPROVED" && /* @__PURE__ */ jsxs("svg", { className: "pollar-cosign-approved-icon", width: "44", height: "44", viewBox: "0 0 14 14", fill: "none", "aria-hidden": true, children: [
-            /* @__PURE__ */ jsx("circle", { cx: "7", cy: "7", r: "7", fill: "currentColor" }),
-            /* @__PURE__ */ jsx(
-              "path",
-              {
-                d: "M3.5 7l2.5 2.5 4.5-5",
-                stroke: "white",
-                strokeWidth: "1.2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round"
-              }
-            )
+        pending.length === 0 && /* @__PURE__ */ jsxs("div", { className: "pollar-cosign-empty", children: [
+          lastResolved ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            lastResolved.status === "APPROVED" && /* @__PURE__ */ jsxs("svg", { className: "pollar-cosign-approved-icon", width: "44", height: "44", viewBox: "0 0 14 14", fill: "none", "aria-hidden": true, children: [
+              /* @__PURE__ */ jsx("circle", { cx: "7", cy: "7", r: "7", fill: "currentColor" }),
+              /* @__PURE__ */ jsx(
+                "path",
+                {
+                  d: "M3.5 7l2.5 2.5 4.5-5",
+                  stroke: "white",
+                  strokeWidth: "1.2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx("p", { className: "pollar-cosign-empty-title", children: lastResolved.status === "APPROVED" ? "Approved" : lastResolved.status === "REJECTED" ? "Rejected" : lastResolved.status.toLowerCase() }),
+            /* @__PURE__ */ jsx("p", { className: "pollar-cosign-muted", children: lastResolved.submit?.hash ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              "Sent. Transaction",
+              " ",
+              explorerUrl ? /* @__PURE__ */ jsx("a", { className: "pollar-cosign-tx-link", href: explorerUrl, target: "_blank", rel: "noopener noreferrer", children: cropAddress(lastResolved.submit.hash) }) : cropAddress(lastResolved.submit.hash),
+              /* @__PURE__ */ jsx(
+                CopyButton,
+                {
+                  value: lastResolved.submit.hash,
+                  label: "Copy transaction hash",
+                  className: "pollar-copy-btn-sm pollar-cosign-copy"
+                }
+              )
+            ] }) : lastResolved.signedXdr ? "Signed. The app will send it." : "Nothing was signed." })
+          ] }) : /* @__PURE__ */ jsx("p", { className: "pollar-cosign-muted", children: "Nothing waits for your approval." }),
+          nextStep && /* @__PURE__ */ jsxs("p", { className: "pollar-cosign-next", children: [
+            /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm", "aria-hidden": true }),
+            " Next: ",
+            nextStep,
+            ". It appears here in a few seconds."
           ] }),
-          /* @__PURE__ */ jsx("p", { className: "pollar-cosign-empty-title", children: lastResolved.status === "APPROVED" ? "Approved" : lastResolved.status === "REJECTED" ? "Rejected" : lastResolved.status.toLowerCase() }),
-          /* @__PURE__ */ jsx("p", { className: "pollar-cosign-muted", children: lastResolved.submit?.hash ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            "Sent. Transaction",
-            " ",
-            explorerUrl ? /* @__PURE__ */ jsx("a", { className: "pollar-cosign-tx-link", href: explorerUrl, target: "_blank", rel: "noopener noreferrer", children: cropAddress(lastResolved.submit.hash) }) : cropAddress(lastResolved.submit.hash)
-          ] }) : lastResolved.signedXdr ? "Signed. The app will send it." : "Nothing was signed." })
-        ] }) : /* @__PURE__ */ jsx("p", { className: "pollar-cosign-muted", children: "Nothing waits for your approval." }) }),
+          closesIn !== null && /* @__PURE__ */ jsxs("p", { className: "pollar-cosign-muted pollar-cosign-closing", children: [
+            "Closing in ",
+            closesIn,
+            "s"
+          ] })
+        ] }),
         pending.length > 1 && /* @__PURE__ */ jsx("ul", { className: "pollar-cosign-list", children: pending.map((r) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
           "button",
           {
@@ -8777,7 +8659,26 @@ function CosignModalTemplate({
           }
         ) }, r.id)) }),
         current && /* @__PURE__ */ jsxs("div", { className: "pollar-cosign-detail", children: [
-          /* @__PURE__ */ jsx("p", { className: "pollar-cosign-detail-title", children: labelOf(current) }),
+          /* @__PURE__ */ jsxs("div", { className: "pollar-cosign-detail-head", children: [
+            /* @__PURE__ */ jsx("p", { className: "pollar-cosign-detail-title", children: labelOf(current) }),
+            !verification && /* @__PURE__ */ jsxs("span", { className: "pollar-cosign-chip", children: [
+              /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm", "aria-hidden": true }),
+              "Checking..."
+            ] }),
+            verification?.ok && /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                className: "pollar-cosign-chip pollar-cosign-chip-ok",
+                "aria-expanded": verifiedOpen,
+                onClick: () => setVerifiedOpenFor(verifiedOpen ? null : current.id),
+                children: [
+                  /* @__PURE__ */ jsx(VerifiedIcon, {}),
+                  "Verified"
+                ]
+              }
+            )
+          ] }),
           current.summary && /* @__PURE__ */ jsx("p", { className: "pollar-cosign-muted", children: current.summary }),
           /* @__PURE__ */ jsxs("dl", { className: "pollar-cosign-rows", children: [
             detailRows(current).map(([k, v]) => /* @__PURE__ */ jsxs("div", { className: "pollar-cosign-row", children: [
@@ -8789,17 +8690,11 @@ function CosignModalTemplate({
               /* @__PURE__ */ jsx("dd", { children: expiresIn(current) })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: `pollar-cosign-verify pollar-cosign-verify-${verification ? verification.ok ? "ok" : "bad" : "pending"}`,
-              children: [
-                !verification && "Checking the transaction against Turnkey...",
-                verification?.ok && "Verified: this is exactly what will be signed.",
-                verification && !verification.ok && `Not verified: ${verification.reason}`
-              ]
-            }
-          ),
+          verification?.ok && verifiedOpen && /* @__PURE__ */ jsx("div", { className: "pollar-cosign-verify pollar-cosign-verify-ok", children: "Checked against Turnkey: this is exactly what will be signed." }),
+          verification && !verification.ok && /* @__PURE__ */ jsxs("div", { className: "pollar-cosign-verify pollar-cosign-verify-bad", children: [
+            "Not verified: ",
+            verification.reason
+          ] }),
           error && /* @__PURE__ */ jsx("div", { className: "pollar-cosign-error", children: error }),
           /* @__PURE__ */ jsxs("div", { className: "pollar-cosign-actions", children: [
             /* @__PURE__ */ jsx(
@@ -8829,10 +8724,13 @@ function CosignModalTemplate({
     }
   );
 }
-function CosignModal({ onClose }) {
+var CLOSE_AFTER_SECONDS = 3;
+var CLOSE_AFTER_SENT_SECONDS = 5;
+var NEXT_REQUEST_EVERY_MS = 2e3;
+function CosignModal({ nextStep = null, onClose }) {
   const { getClient, styles, network } = usePollar();
   const { theme, accentColor, styleOverrides, overlayStyle } = modalChrome(styles);
-  const { pending, lastResolved, approve, reject, verify, inspectQuorum } = useCosign();
+  const { pending, lastResolved, loaded, refresh, approve, reject, verify, inspectQuorum } = useCosign();
   const [selectedId, setSelectedId] = useState(null);
   const [verification, setVerification] = useState(null);
   const [busy, setBusy] = useState(null);
@@ -8875,6 +8773,33 @@ function CosignModal({ onClose }) {
       if (authState.step === "idle") onCloseRef.current();
     });
   }, [getClient]);
+  const silent = pending.length === 0 && (lastResolved ? lastResolved.status === "APPROVED" && !lastResolved.submit?.hash && !lastResolved.signedXdr : loaded);
+  const sent = pending.length === 0 && lastResolved?.status === "APPROVED" && !!lastResolved.submit?.hash;
+  const awaitingNext = sent && !!nextStep;
+  const closeAfter = awaitingNext ? null : sent ? CLOSE_AFTER_SENT_SECONDS : silent ? CLOSE_AFTER_SECONDS : null;
+  useEffect(() => {
+    if (!awaitingNext) return;
+    const timer = setInterval(() => void refresh().catch(() => void 0), NEXT_REQUEST_EVERY_MS);
+    return () => clearInterval(timer);
+  }, [awaitingNext, refresh]);
+  const [closesIn, setClosesIn] = useState(null);
+  useEffect(() => {
+    if (closeAfter === null) {
+      setClosesIn(null);
+      return;
+    }
+    let left = closeAfter;
+    setClosesIn(left);
+    const timer = setInterval(() => {
+      left -= 1;
+      if (left > 0) setClosesIn(left);
+      else {
+        clearInterval(timer);
+        onCloseRef.current();
+      }
+    }, 1e3);
+    return () => clearInterval(timer);
+  }, [closeAfter, lastResolved?.id]);
   const run = useCallback(
     async (kind, request, action) => {
       setBusy(kind);
@@ -8903,6 +8828,8 @@ function CosignModal({ onClose }) {
       error,
       approveBlocked: !!current && approveFailedFor === current.id,
       ...lastResolved ? { lastResolved } : {},
+      closesIn,
+      nextStep: awaitingNext ? nextStep : null,
       explorerUrl: lastResolved?.submit?.hash ? explorerTxUrl(lastResolved.network, lastResolved.submit.hash, network) : null,
       onSelect: (r) => setSelectedId(r.id),
       onApprove: (r) => void run("approving", r, approve),
@@ -9282,7 +9209,7 @@ function RecoveryModalTemplate(p) {
   );
 }
 function errorText2(err) {
-  return transactionErrorMessage(isPollarApiError(err) ? err.code : null, err instanceof Error ? err.message : null);
+  return cosignRefusalMessage(err) ?? transactionErrorMessage(isPollarApiError(err) ? err.code : null, err instanceof Error ? err.message : null);
 }
 function RecoveryModal({ onClose }) {
   const { getClient, styles, refreshRecovery, appConfig } = usePollar();
@@ -10296,6 +10223,7 @@ function PollarProvider({
   const [receiveModalOpen, setReceiveModalOpen] = useState(false);
   const [sessionsModalOpen, setSessionsModalOpen] = useState(false);
   const [cosignModalOpen, setCosignModalOpen] = useState(false);
+  const [cosignNextStep, setCosignNextStep] = useState(null);
   const [recoveryModalOpen, setRecoveryModalOpen] = useState(false);
   const cosignPendingCount = useRef(0);
   useEffect(() => {
@@ -10446,6 +10374,7 @@ function PollarProvider({
       // cosign
       cosign,
       openCosignModal: () => setCosignModalOpen(true),
+      setCosignNextStep,
       recovery,
       recoveryLocked,
       refreshRecovery,
@@ -10536,7 +10465,7 @@ function PollarProvider({
     /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setCardModalOpen(false), children: /* @__PURE__ */ jsx(CardModal, { onClose: () => setCardModalOpen(false) }) }, `${cardModalKey}:${walletAddress}`),
     receiveModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setReceiveModalOpen(false), children: /* @__PURE__ */ jsx(ReceiveModal, { onClose: () => setReceiveModalOpen(false) }) }),
     sessionsModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setSessionsModalOpen(false), children: /* @__PURE__ */ jsx(SessionsModal, { onClose: () => setSessionsModalOpen(false) }) }),
-    cosignModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setCosignModalOpen(false), children: /* @__PURE__ */ jsx(CosignModal, { onClose: () => setCosignModalOpen(false) }) }),
+    cosignModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setCosignModalOpen(false), children: /* @__PURE__ */ jsx(CosignModal, { nextStep: cosignNextStep, onClose: () => setCosignModalOpen(false) }) }),
     custodyMigration?.required && !custodyMigrationLater && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: refreshCustodyMigration, children: /* @__PURE__ */ jsx(
       CustodyMigrationModal,
       {
@@ -10553,7 +10482,15 @@ function PollarProvider({
         }
       }
     ) }),
-    recoveryModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setRecoveryModalOpen(false), children: /* @__PURE__ */ jsx(RecoveryModal, { onClose: () => setRecoveryModalOpen(false) }) }),
+    recoveryModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setRecoveryModalOpen(false), children: /* @__PURE__ */ jsx(
+      RecoveryModal,
+      {
+        onClose: () => {
+          setRecoveryModalOpen(false);
+          refreshRecovery();
+        }
+      }
+    ) }),
     firstConfirmation && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: firstConfirmation.reject, children: /* @__PURE__ */ jsx(ConfirmModal, { confirmation: firstConfirmation }, firstConfirmation.id) }),
     distributionRulesModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setDistributionRulesModalOpen(false), children: /* @__PURE__ */ jsx(DistributionRulesModal, { onClose: () => setDistributionRulesModalOpen(false) }) })
   ] });
@@ -10585,8 +10522,9 @@ function createPollarAdapterHook(key) {
     );
   };
 }
-function ButtonLogo() {
-  return /* @__PURE__ */ jsx("img", { src: LOGO_POLLAR, alt: "Pollar", width: 22, height: 22, className: "pollar-wallet-btn-logo" });
+function ButtonLogo({ accentColor }) {
+  const src = readableTextOn(accentColor) === "#ffffff" ? LOGO_POLLAR_MARK_ON_DARK : LOGO_POLLAR_MARK_ON_LIGHT;
+  return /* @__PURE__ */ jsx("img", { src, alt: "Pollar", width: 22, height: 22, className: "pollar-wallet-btn-logo" });
 }
 function cropWallet(address) {
   if (address.length <= 12) return address;
@@ -10594,12 +10532,11 @@ function cropWallet(address) {
 }
 function WalletButtonTemplate({
   walletAddress,
+  theme,
   accentColor,
+  styleOverrides,
   open,
   copied,
-  dropdownBg,
-  dropdownBorder,
-  itemColor,
   wrapperRef,
   isInProgress,
   showCreateAccount,
@@ -10628,9 +10565,10 @@ function WalletButtonTemplate({
 }) {
   const [selfCustodyNotice, setSelfCustodyNotice] = useState(false);
   const [risksAccepted, setRisksAccepted] = useState(false);
+  const cssVars = buildModalCssVars(theme, accentColor, styleOverrides);
   if (!walletAddress && signedIn) {
-    return /* @__PURE__ */ jsxs("div", { className: "pollar-wallet-wrapper", ref: wrapperRef, children: [
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-btn", style: { backgroundColor: accentColor }, onClick: onToggleOpen, children: [
+    return /* @__PURE__ */ jsxs("div", { className: "pollar-wallet-wrapper", ref: wrapperRef, style: cssVars, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-btn", onClick: onToggleOpen, children: [
         /* @__PURE__ */ jsx("span", { className: "pollar-wallet-btn-label", children: onCreateWallet ? "No wallet" : "Signed in" }),
         /* @__PURE__ */ jsx(
           "svg",
@@ -10646,22 +10584,13 @@ function WalletButtonTemplate({
           }
         )
       ] }),
-      open && /* @__PURE__ */ jsxs("div", { className: "pollar-wallet-dropdown", style: { backgroundColor: dropdownBg, borderColor: dropdownBorder }, children: [
+      open && /* @__PURE__ */ jsxs("div", { className: "pollar-wallet-dropdown", children: [
         createWalletError && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", style: { color: itemColor }, role: "status", children: createWalletError }),
+          /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", role: "status", children: createWalletError }),
           /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" })
         ] }),
         onCreateWallet && !custodyChoice && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              className: "pollar-wallet-dropdown-item",
-              style: { color: itemColor },
-              onClick: () => onCreateWallet(),
-              disabled: creatingWallet,
-              children: creatingWallet ? "Creating wallet\u2026" : "Create wallet"
-            }
-          ),
+          /* @__PURE__ */ jsx("button", { className: "pollar-wallet-dropdown-item", onClick: () => onCreateWallet(), disabled: creatingWallet, children: creatingWallet ? "Creating wallet\u2026" : "Create wallet" }),
           /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" })
         ] }),
         onCreateWallet && custodyChoice && !selfCustodyNotice && /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -10669,29 +10598,27 @@ function WalletButtonTemplate({
             "button",
             {
               className: "pollar-wallet-dropdown-item",
-              style: { color: itemColor },
               onClick: () => onCreateWallet("COSIGNED"),
               disabled: creatingWallet,
               children: creatingWallet ? "Creating wallet\u2026" : "Create co-signed wallet"
             }
           ),
-          /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", style: { color: itemColor }, children: "You and the app approve every signature together. Your wallet can be recovered with help." }),
+          /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", children: "You and the app approve every signature together. Your wallet can be recovered with help." }),
           /* @__PURE__ */ jsx(
             "button",
             {
               className: "pollar-wallet-dropdown-item",
-              style: { color: itemColor },
               onClick: () => setSelfCustodyNotice(true),
               disabled: creatingWallet,
               children: "Create self-custody wallet"
             }
           ),
-          /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", style: { color: itemColor }, children: "Only your device signs. Nobody else can move or recover your funds." }),
+          /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", children: "Only your device signs. Nobody else can move or recover your funds." }),
           /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" })
         ] }),
         onCreateWallet && custodyChoice && selfCustodyNotice && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", style: { color: itemColor }, role: "alert", children: "In a self-custody wallet only your device can sign. If you lose this device and every recovery method, nobody can recover the wallet or its funds, not the app and not Pollar. Nobody can undo or freeze a transaction you sign." }),
-          /* @__PURE__ */ jsxs("label", { className: "pollar-wallet-dropdown-notice", style: { color: itemColor }, children: [
+          /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", role: "alert", children: "In a self-custody wallet only your device can sign. If you lose this device and every recovery method, nobody can recover the wallet or its funds, not the app and not Pollar. Nobody can undo or freeze a transaction you sign." }),
+          /* @__PURE__ */ jsxs("label", { className: "pollar-wallet-dropdown-notice", children: [
             /* @__PURE__ */ jsx(
               "input",
               {
@@ -10708,7 +10635,6 @@ function WalletButtonTemplate({
             "button",
             {
               className: "pollar-wallet-dropdown-item",
-              style: { color: itemColor },
               onClick: () => onCreateWallet("SELF_CUSTODY"),
               disabled: creatingWallet || !risksAccepted,
               children: creatingWallet ? "Creating wallet\u2026" : "Create self-custody wallet"
@@ -10718,7 +10644,6 @@ function WalletButtonTemplate({
             "button",
             {
               className: "pollar-wallet-dropdown-item",
-              style: { color: itemColor },
               onClick: () => {
                 setSelfCustodyNotice(false);
                 setRisksAccepted(false);
@@ -10729,24 +10654,23 @@ function WalletButtonTemplate({
           ),
           /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" })
         ] }),
-        /* @__PURE__ */ jsx("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onSessions, children: "Active sessions" }),
+        /* @__PURE__ */ jsx("button", { className: "pollar-wallet-dropdown-item", onClick: onSessions, children: "Active sessions" }),
         /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" }),
         /* @__PURE__ */ jsx("button", { className: "pollar-wallet-dropdown-item pollar-danger", onClick: onLogout, children: "Log out" })
       ] })
     ] });
   }
   if (!walletAddress) {
-    return /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-wallet-login-btn", style: { backgroundColor: accentColor }, onClick: onLogin, children: [
-      /* @__PURE__ */ jsx(ButtonLogo, {}),
+    return /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-wallet-login-btn", style: cssVars, onClick: onLogin, children: [
+      /* @__PURE__ */ jsx(ButtonLogo, { accentColor }),
       "Login with Pollar"
     ] });
   }
-  return /* @__PURE__ */ jsxs("div", { className: "pollar-wallet-wrapper", ref: wrapperRef, children: [
+  return /* @__PURE__ */ jsxs("div", { className: "pollar-wallet-wrapper", ref: wrapperRef, style: cssVars, children: [
     /* @__PURE__ */ jsxs(
       "button",
       {
         className: "pollar-wallet-btn",
-        style: { backgroundColor: accentColor },
         onClick: isInProgress ? void 0 : onToggleOpen,
         disabled: isInProgress,
         "aria-busy": isInProgress,
@@ -10783,50 +10707,41 @@ function WalletButtonTemplate({
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs("div", { className: "pollar-wallet-dropdown", style: { backgroundColor: dropdownBg, borderColor: dropdownBorder }, children: [
+    open && /* @__PURE__ */ jsxs("div", { className: "pollar-wallet-dropdown", children: [
       recoveryLocked && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice pollar-danger", role: "alert", children: "Locked: add a way to recover this wallet before sending or receiving. If you lose this device without one, the funds are lost." }),
         /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" })
       ] }),
       notReadyReason && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", style: { color: itemColor }, role: "status", children: notReadyReason }),
+        /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-notice", role: "status", children: notReadyReason }),
         /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" })
       ] }),
       showCreateAccount && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsxs(
-          "button",
-          {
-            className: "pollar-wallet-dropdown-item",
-            style: { color: itemColor },
-            onClick: onCreateAccount,
-            disabled: creatingAccount,
-            children: [
-              /* @__PURE__ */ jsxs(
-                "svg",
-                {
-                  width: "14",
-                  height: "14",
-                  viewBox: "0 0 24 24",
-                  fill: "none",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round",
-                  children: [
-                    /* @__PURE__ */ jsx("path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }),
-                    /* @__PURE__ */ jsx("circle", { cx: "9", cy: "7", r: "4" }),
-                    /* @__PURE__ */ jsx("line", { x1: "19", y1: "8", x2: "19", y2: "14" }),
-                    /* @__PURE__ */ jsx("line", { x1: "22", y1: "11", x2: "16", y2: "11" })
-                  ]
-                }
-              ),
-              creatingAccount ? "Creating account\u2026" : "Create account"
-            ]
-          }
-        ),
+        /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onCreateAccount, disabled: creatingAccount, children: [
+          /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              width: "14",
+              height: "14",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: [
+                /* @__PURE__ */ jsx("path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }),
+                /* @__PURE__ */ jsx("circle", { cx: "9", cy: "7", r: "4" }),
+                /* @__PURE__ */ jsx("line", { x1: "19", y1: "8", x2: "19", y2: "14" }),
+                /* @__PURE__ */ jsx("line", { x1: "22", y1: "11", x2: "16", y2: "11" })
+              ]
+            }
+          ),
+          creatingAccount ? "Creating account\u2026" : "Create account"
+        ] }),
         /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" })
       ] }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onSend, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onSend, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -10846,7 +10761,7 @@ function WalletButtonTemplate({
         ),
         "Send"
       ] }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onReceive, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onReceive, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -10868,7 +10783,7 @@ function WalletButtonTemplate({
         "Receive"
       ] }),
       /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onCopy, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onCopy, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -10888,7 +10803,7 @@ function WalletButtonTemplate({
         ),
         copied ? "Copied!" : "Copy address"
       ] }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onWalletBalance, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onWalletBalance, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -10909,7 +10824,7 @@ function WalletButtonTemplate({
         ),
         "Wallet balance"
       ] }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onTxHistory, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onTxHistory, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -10933,7 +10848,7 @@ function WalletButtonTemplate({
         "Transaction history"
       ] }),
       /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onRamp, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onRamp, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -10955,7 +10870,7 @@ function WalletButtonTemplate({
         ),
         "Buy / Sell"
       ] }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onKyc, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onKyc, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -10976,7 +10891,7 @@ function WalletButtonTemplate({
         ),
         "Identity verification"
       ] }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onDistributionRules, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onDistributionRules, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -10999,7 +10914,7 @@ function WalletButtonTemplate({
         ),
         "Distribution rules"
       ] }),
-      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", style: { color: itemColor }, onClick: onSessions, children: [
+      /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item", onClick: onSessions, children: [
         /* @__PURE__ */ jsxs(
           "svg",
           {
@@ -11020,31 +10935,23 @@ function WalletButtonTemplate({
         ),
         "Active sessions"
       ] }),
-      onRecovery && /* @__PURE__ */ jsxs(
-        "button",
-        {
-          className: `pollar-wallet-dropdown-item${recoveryLocked ? " pollar-danger" : ""}`,
-          style: recoveryLocked ? void 0 : { color: itemColor },
-          onClick: onRecovery,
-          children: [
-            /* @__PURE__ */ jsx(
-              "svg",
-              {
-                width: "14",
-                height: "14",
-                viewBox: "0 0 24 24",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                children: /* @__PURE__ */ jsx("path", { d: "M12 2 4 5v6c0 5 3.4 9.3 8 11 4.6-1.7 8-6 8-11V5l-8-3z" })
-              }
-            ),
-            recoveryLocked ? "Set up wallet recovery" : "Wallet recovery"
-          ]
-        }
-      ),
+      onRecovery && /* @__PURE__ */ jsxs("button", { className: `pollar-wallet-dropdown-item${recoveryLocked ? " pollar-danger" : ""}`, onClick: onRecovery, children: [
+        /* @__PURE__ */ jsx(
+          "svg",
+          {
+            width: "14",
+            height: "14",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: /* @__PURE__ */ jsx("path", { d: "M12 2 4 5v6c0 5 3.4 9.3 8 11 4.6-1.7 8-6 8-11V5l-8-3z" })
+          }
+        ),
+        recoveryLocked ? "Set up wallet recovery" : "Wallet recovery"
+      ] }),
       /* @__PURE__ */ jsx("div", { className: "pollar-wallet-dropdown-divider" }),
       /* @__PURE__ */ jsxs("button", { className: "pollar-wallet-dropdown-item pollar-danger", onClick: onLogout, children: [
         /* @__PURE__ */ jsxs(
@@ -11105,11 +11012,7 @@ function WalletButton() {
   const isInProgress = transaction.step === "building" || transaction.step === "signing";
   const canCreateAccount = !created && wallet?.custody === "external" && wallet.existsOnStellar === false && wallet.fundingMode === "IMMEDIATE";
   const notReadyReason = walletNotReadyReason(wallet, primaryChain);
-  const { theme = "light", accentColor = "#005DB4" } = styles;
-  const isDark = theme === "dark";
-  const dropdownBg = isDark ? "#18181b" : "#fff";
-  const dropdownBorder = isDark ? "#3f3f46" : "#e4e4e7";
-  const itemColor = isDark ? "#fafafa" : "#18181b";
+  const { theme, accentColor, styleOverrides } = modalChrome(styles);
   useEffect(() => {
     function handleClickOutside(e) {
       if (wrapperRef.current && !wrapperRef.current.contains(e.target)) {
@@ -11208,12 +11111,11 @@ function WalletButton() {
     WalletButtonTemplate,
     {
       walletAddress: walletAddress ?? null,
+      theme,
       accentColor,
+      styleOverrides,
       open,
       copied,
-      dropdownBg,
-      dropdownBorder,
-      itemColor,
       wrapperRef,
       isInProgress,
       showCreateAccount: canCreateAccount,
@@ -11243,6 +11145,6 @@ function WalletButton() {
   );
 }
 
-export { CardModal, ChainSelect, CosignModal, CosignModalTemplate, CustodyMigrationModal, CustodyMigrationModalTemplate, DistributionRulesModal, DistributionRulesModalTemplate, EarnModal, EnabledAssetsModal, EnabledAssetsModalTemplate, KycModal, KycModalTemplate, KycStatus, LoginModalTemplate, PollarProvider, ProviderRegistrationModal, RampWidget, RampWidgetTemplate, RampWorkflow, ReceiveModal, ReceiveModalTemplate, RecoveryModal, RecoveryModalTemplate, RegistryCheckModal, RequirementFormModal, RouteDisplay, SendModal, SendModalTemplate, SessionsModal, SessionsModalTemplate, SwapModal, SwapModalTemplate, TransactionModalTemplate, TxHistoryModalTemplate, TxStatusView, WalletBalanceModal, WalletBalanceModalTemplate, WalletButton, WalletButtonTemplate, addressForChain, browserPasskeyCeremony, browserPasskeySigner, browserRecoveryPasskey, buildModalCssVars, chainsOf, createPollarAdapterHook, modalChrome, readableTextOn, resolveChain, useChains, useCosign, usePollar, walletNotReadyReason };
+export { CardModal, ChainSelect, CosignModal, CosignModalTemplate, CustodyMigrationModal, CustodyMigrationModalTemplate, DistributionRulesModal, DistributionRulesModalTemplate, EarnModal, EnabledAssetsModal, EnabledAssetsModalTemplate, KycModal, KycModalTemplate, KycStatus, LoginModalTemplate, PollarProvider, ProviderRegistrationModal, RampWidget, RampWidgetTemplate, ReceiveModal, ReceiveModalTemplate, RecoveryModal, RecoveryModalTemplate, RegistryCheckModal, RejectedRouteDisplay, RequirementFormModal, RouteDisplay, SendModal, SendModalTemplate, SessionsModal, SessionsModalTemplate, SwapModal, SwapModalTemplate, TransactionModalTemplate, TxHistoryModalTemplate, TxStatusView, WalletBalanceModal, WalletBalanceModalTemplate, WalletButton, WalletButtonTemplate, addressForChain, browserPasskeyCeremony, browserPasskeySigner, browserRecoveryPasskey, buildModalCssVars, chainsOf, createPollarAdapterHook, modalChrome, readableTextOn, resolveChain, useChains, useCosign, usePollar, walletNotReadyReason };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map