@volr/react-ui 0.1.134 → 0.2.0

package/dist/index.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var React13 = require('react');
+var React14 = require('react');
 var reactDom = require('react-dom');
 var react = require('@volr/react');
 var jsxRuntime = require('react/jsx-runtime');
@@ -10,7 +10,7 @@ var qrcode_react = require('qrcode.react');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var React13__default = /*#__PURE__*/_interopDefault(React13);
+var React14__default = /*#__PURE__*/_interopDefault(React14);
 
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __esm = (fn, res) => function __init() {
@@ -535,7 +535,7 @@ var en = {
     titleFingerprint: "Set up fingerprint login",
     titleQrCode: "Set up mobile login",
     // Short description
-    description: "Sign in instantly, every time.",
+    description: "Register once and sign in easily from now on.",
     // Legacy keys for backward compatibility
     touchId: "Use Touch ID to create your passkey",
     faceId: "Use Face ID to create your passkey",
@@ -604,6 +604,12 @@ var en = {
     walletAddress: "Wallet Address",
     email: "Email",
     logout: "Log out",
+    setup: {
+      title: "Create your wallet",
+      description: "To see balances and use wallet features, you need a wallet. It takes about 1 second.",
+      cta: "Create wallet in 1 second",
+      logout: "Log out"
+    },
     totalBalance: "Total Balance",
     noAssets: "No assets configured",
     menu: {
@@ -696,7 +702,29 @@ var en = {
     messageLabel: "Message",
     domainLabel: "Domain"
   },
+  walletRequired: {
+    ariaLabel: "Create wallet",
+    titleTx: "Create your wallet to continue",
+    titleMessage: "Create your wallet to continue",
+    titleTypedData: "Create your wallet to continue",
+    description: "Create a wallet in about 1 second to continue.",
+    cta: "Create wallet in 1 second",
+    notNow: "Not now"
+  },
   payment: {
+    walletChoice: {
+      title: "Choose how to pay",
+      description: "Use your existing wallet, or create a wallet in about 1 second.",
+      externalCta: "Use my wallet",
+      createAccountCta: "Create wallet in 1 second",
+      externalDisabledNative: "External wallet payments are available for ERC-20 permit tokens only.",
+      externalTitle: "Select a wallet",
+      externalDescription: "Connect your wallet to sign a one-time permission for this payment.",
+      noWalletsDetected: "No wallets detected. Please install a wallet like MetaMask.",
+      connect: "Connect",
+      connecting: "Connecting...",
+      externalConnectFailed: "Failed to connect wallet. Please try again."
+    },
     processing: {
       signing: "Confirming payment...",
       broadcasting: "Sending payment...",
@@ -792,7 +820,7 @@ var ko = {
     titleFingerprint: "\uC9C0\uBB38 \uB85C\uADF8\uC778 \uC124\uC815",
     titleQrCode: "\uD734\uB300\uD3F0\uC73C\uB85C \uB85C\uADF8\uC778 \uC124\uC815",
     // Short description
-    description: "\uD55C \uBC88 \uB4F1\uB85D\uD558\uBA74, \uB2E4\uC74C\uBD80\uD130 \uBC14\uB85C \uB85C\uADF8\uC778",
+    description: "\uD55C \uBC88 \uB4F1\uB85D\uD558\uACE0 \uB2E4\uC74C\uBD80\uD130 \uAC04\uD3B8\uD558\uAC8C \uB85C\uADF8\uC778\uD558\uC138\uC694",
     // Legacy keys for backward compatibility
     touchId: "Touch ID\uB97C \uC0AC\uC6A9\uD558\uC5EC \uD328\uC2A4\uD0A4\uB97C \uC0DD\uC131\uD558\uC138\uC694",
     faceId: "Face ID\uB97C \uC0AC\uC6A9\uD558\uC5EC \uD328\uC2A4\uD0A4\uB97C \uC0DD\uC131\uD558\uC138\uC694",
@@ -886,6 +914,12 @@ var ko = {
     walletAddress: "\uC9C0\uAC11 \uC8FC\uC18C",
     email: "\uC774\uBA54\uC77C",
     logout: "\uB85C\uADF8\uC544\uC6C3",
+    setup: {
+      title: "\uC9C0\uAC11 \uB9CC\uB4E4\uAE30",
+      description: "\uC794\uACE0 \uD655\uC778\uACFC \uC9C0\uAC11 \uAE30\uB2A5\uC744 \uC0AC\uC6A9\uD558\uB824\uBA74 \uC9C0\uAC11\uC774 \uD544\uC694\uD574\uC694. 1\uCD08\uBA74 \uB05D\uB098\uC694.",
+      cta: "1\uCD08\uB9CC\uC5D0 \uC9C0\uAC11 \uB9CC\uB4E4\uAE30",
+      logout: "\uB85C\uADF8\uC544\uC6C3"
+    },
     totalBalance: "\uCD1D \uC794\uACE0",
     noAssets: "\uC124\uC815\uB41C \uC790\uC0B0\uC774 \uC5C6\uC2B5\uB2C8\uB2E4",
     menu: {
@@ -978,7 +1012,29 @@ var ko = {
     messageLabel: "\uBA54\uC2DC\uC9C0",
     domainLabel: "\uB3C4\uBA54\uC778"
   },
+  walletRequired: {
+    ariaLabel: "\uC9C0\uAC11 \uC0DD\uC131",
+    titleTx: "\uACC4\uC18D\uD558\uB824\uBA74 \uC9C0\uAC11\uC774 \uD544\uC694\uD574\uC694",
+    titleMessage: "\uACC4\uC18D\uD558\uB824\uBA74 \uC9C0\uAC11\uC774 \uD544\uC694\uD574\uC694",
+    titleTypedData: "\uACC4\uC18D\uD558\uB824\uBA74 \uC9C0\uAC11\uC774 \uD544\uC694\uD574\uC694",
+    description: "1\uCD08\uB9CC\uC5D0 \uC9C0\uAC11\uC744 \uB9CC\uB4E4\uACE0 \uACC4\uC18D \uC9C4\uD589\uD558\uC138\uC694.",
+    cta: "1\uCD08\uB9CC\uC5D0 \uC9C0\uAC11 \uB9CC\uB4E4\uAE30",
+    notNow: "\uC9C0\uAE08\uC740 \uC548 \uD560\uB798\uC694"
+  },
   payment: {
+    walletChoice: {
+      title: "\uACB0\uC81C \uBC29\uBC95\uC744 \uC120\uD0DD\uD558\uC138\uC694",
+      description: "\uAE30\uC874 \uC9C0\uAC11\uC73C\uB85C \uACB0\uC81C\uD558\uAC70\uB098, 1\uCD08\uB9CC\uC5D0 \uC9C0\uAC11\uC744 \uB9CC\uB4E4 \uC218 \uC788\uC5B4\uC694.",
+      externalCta: "\uB0B4 \uC9C0\uAC11\uC73C\uB85C \uACB0\uC81C",
+      createAccountCta: "1\uCD08\uB9CC\uC5D0 \uC9C0\uAC11 \uB9CC\uB4E4\uAE30",
+      externalDisabledNative: "\uC678\uBD80 \uC9C0\uAC11 \uACB0\uC81C\uB294 ERC-20 permit \uD1A0\uD070\uC5D0\uC11C\uB9CC \uC9C0\uC6D0\uB3FC\uC694.",
+      externalTitle: "\uC9C0\uAC11 \uC120\uD0DD",
+      externalDescription: "\uC774\uBC88 \uACB0\uC81C\uB97C \uC704\uD55C 1\uD68C\uC131 \uAD8C\uD55C \uC11C\uBA85\uC744 \uC9C4\uD589\uD569\uB2C8\uB2E4.",
+      noWalletsDetected: "\uAC10\uC9C0\uB41C \uC9C0\uAC11\uC774 \uC5C6\uC5B4\uC694. MetaMask \uAC19\uC740 \uC9C0\uAC11\uC744 \uC124\uCE58\uD574\uC8FC\uC138\uC694.",
+      connect: "\uC5F0\uACB0",
+      connecting: "\uC5F0\uACB0 \uC911...",
+      externalConnectFailed: "\uC9C0\uAC11 \uC5F0\uACB0\uC5D0 \uC2E4\uD328\uD588\uC5B4\uC694. \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694."
+    },
     processing: {
       signing: "\uACB0\uC81C \uD655\uC778 \uC911...",
       broadcasting: "\uACB0\uC81C \uC804\uC1A1 \uC911...",
@@ -1016,13 +1072,13 @@ var translations = {
 function getTranslations(locale = "en") {
   return translations[locale] || translations.en;
 }
-var I18nContext = React13.createContext(null);
+var I18nContext = React14.createContext(null);
 function interpolate(text, params) {
   if (!params) return text;
   return text.replace(/\{\{(\w+)\}\}/g, (_, key) => params[key] ?? `{{${key}}}`);
 }
 function useI18n() {
-  const context = React13.useContext(I18nContext);
+  const context = React14.useContext(I18nContext);
   if (!context) {
     return {
       locale: "en",
@@ -1057,9 +1113,9 @@ function detectLocale() {
   return lang.startsWith("ko") ? "ko" : "en";
 }
 function I18nProvider({ children }) {
-  const [locale, setLocale] = React13.useState(detectLocale());
-  const translations2 = React13.useMemo(() => getTranslations(locale), [locale]);
-  const t = React13.useMemo(() => {
+  const [locale, setLocale] = React14.useState(detectLocale());
+  const translations2 = React14.useMemo(() => getTranslations(locale), [locale]);
+  const t = React14.useMemo(() => {
     return (key, params) => {
       const keys = key.split(".");
       let value2 = translations2;
@@ -1076,7 +1132,7 @@ function I18nProvider({ children }) {
       return typeof value2 === "string" ? interpolate(value2, params) : key;
     };
   }, [translations2]);
-  const value = React13.useMemo(
+  const value = React14.useMemo(
     () => ({
       locale,
       translations: translations2,
@@ -1088,9 +1144,9 @@ function I18nProvider({ children }) {
   return /* @__PURE__ */ jsxRuntime.jsx(I18nContext.Provider, { value, children });
 }
 var useTranslation = useI18n;
-var VolrModalContext = React13.createContext(null);
+var VolrModalContext = React14.createContext(null);
 var useVolrModal = () => {
-  const context = React13.useContext(VolrModalContext);
+  const context = React14.useContext(VolrModalContext);
   if (!context) {
     throw new Error("useVolrModal must be used within VolrUIProvider");
   }
@@ -1099,17 +1155,17 @@ var useVolrModal = () => {
 var VolrModalProvider = ({
   children
 }) => {
-  const [isOpen, setIsOpen] = React13.useState(false);
-  const [mode, setMode] = React13.useState("account");
-  const [asset, setAsset] = React13.useState(null);
-  const [paymentOptions, setPaymentOptions] = React13.useState(null);
-  const open = React13.useCallback((options) => {
+  const [isOpen, setIsOpen] = React14.useState(false);
+  const [mode, setMode] = React14.useState("account");
+  const [asset, setAsset] = React14.useState(null);
+  const [paymentOptions, setPaymentOptions] = React14.useState(null);
+  const open = React14.useCallback((options) => {
     setMode(options?.mode ?? "account");
     setAsset(options?.asset ?? null);
     setPaymentOptions(options?.payment ?? null);
     setIsOpen(true);
   }, []);
-  const close = React13.useCallback(() => {
+  const close = React14.useCallback(() => {
     setIsOpen(false);
     setAsset(null);
     setPaymentOptions(null);
@@ -1123,11 +1179,11 @@ function cn(...inputs) {
   return twMerge(clsx.clsx(inputs));
 }
 function useMediaQuery(query) {
-  const [matches, setMatches] = React13.useState(() => {
+  const [matches, setMatches] = React14.useState(() => {
     if (typeof window === "undefined") return false;
     return window.matchMedia(query).matches;
   });
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     const mql = window.matchMedia(query);
     const handler = (event) => setMatches(event.matches);
@@ -1139,14 +1195,14 @@ function useMediaQuery(query) {
 }
 
 // src/generated/volr-sdk-css.ts
-var VOLR_SDK_CSS = '/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--volr-tw-translate-x:0;--volr-tw-translate-y:0;--volr-tw-translate-z:0;--volr-tw-space-y-reverse:0;--volr-tw-border-style:solid;--volr-tw-gradient-position:initial;--volr-tw-gradient-from:#0000;--volr-tw-gradient-via:#0000;--volr-tw-gradient-to:#0000;--volr-tw-gradient-stops:initial;--volr-tw-gradient-via-stops:initial;--volr-tw-gradient-from-position:0%;--volr-tw-gradient-via-position:50%;--volr-tw-gradient-to-position:100%;--volr-tw-leading:initial;--volr-tw-font-weight:initial;--volr-tw-tracking:initial;--volr-tw-shadow:0 0 #0000;--volr-tw-shadow-color:initial;--volr-tw-shadow-alpha:100%;--volr-tw-inset-shadow:0 0 #0000;--volr-tw-inset-shadow-color:initial;--volr-tw-inset-shadow-alpha:100%;--volr-tw-ring-color:initial;--volr-tw-ring-shadow:0 0 #0000;--volr-tw-inset-ring-color:initial;--volr-tw-inset-ring-shadow:0 0 #0000;--volr-tw-ring-inset:initial;--volr-tw-ring-offset-width:0px;--volr-tw-ring-offset-color:#fff;--volr-tw-ring-offset-shadow:0 0 #0000;--volr-tw-blur:initial;--volr-tw-brightness:initial;--volr-tw-contrast:initial;--volr-tw-grayscale:initial;--volr-tw-hue-rotate:initial;--volr-tw-invert:initial;--volr-tw-opacity:initial;--volr-tw-saturate:initial;--volr-tw-sepia:initial;--volr-tw-drop-shadow:initial;--volr-tw-drop-shadow-color:initial;--volr-tw-drop-shadow-alpha:100%;--volr-tw-drop-shadow-size:initial;--volr-tw-duration:initial;--volr-tw-ease:initial}}}@layer theme{:root,:host{--volr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--volr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--volr-color-red-50:oklch(97.1% .013 17.38);--volr-color-red-100:oklch(93.6% .032 17.717);--volr-color-red-200:oklch(88.5% .062 18.334);--volr-color-red-500:oklch(63.7% .237 25.331);--volr-color-red-600:oklch(57.7% .245 27.325);--volr-color-red-700:oklch(50.5% .213 27.518);--volr-color-amber-50:oklch(98.7% .022 95.277);--volr-color-amber-200:oklch(92.4% .12 95.746);--volr-color-amber-700:oklch(55.5% .163 48.998);--volr-color-yellow-100:oklch(97.3% .071 103.193);--volr-color-yellow-700:oklch(55.4% .135 66.442);--volr-color-green-50:oklch(98.2% .018 155.826);--volr-color-green-100:oklch(96.2% .044 156.743);--volr-color-green-600:oklch(62.7% .194 149.214);--volr-color-green-700:oklch(52.7% .154 150.069);--volr-color-emerald-300:oklch(84.5% .143 164.978);--volr-color-emerald-400:oklch(76.5% .177 163.223);--volr-color-emerald-500:oklch(69.6% .17 162.48);--volr-color-emerald-600:oklch(59.6% .145 163.225);--volr-color-teal-400:oklch(77.7% .152 181.912);--volr-color-teal-500:oklch(70.4% .14 182.503);--volr-color-cyan-400:oklch(78.9% .154 211.53);--volr-color-blue-100:oklch(93.2% .032 255.585);--volr-color-blue-700:oklch(48.8% .243 264.376);--volr-color-slate-50:oklch(98.4% .003 247.858);--volr-color-slate-100:oklch(96.8% .007 247.896);--volr-color-slate-200:oklch(92.9% .013 255.508);--volr-color-slate-300:oklch(86.9% .022 252.894);--volr-color-slate-400:oklch(70.4% .04 256.788);--volr-color-slate-500:oklch(55.4% .046 257.417);--volr-color-slate-600:oklch(44.6% .043 257.281);--volr-color-slate-700:oklch(37.2% .044 257.287);--volr-color-slate-900:oklch(20.8% .042 265.755);--volr-color-gray-500:oklch(55.1% .027 264.364);--volr-color-black:#000;--volr-color-white:#fff;--volr-spacing:.25rem;--volr-container-md:28rem;--volr-container-4xl:56rem;--volr-text-xs:.75rem;--volr-text-xs--line-height:calc(1/.75);--volr-text-sm:.875rem;--volr-text-sm--line-height:calc(1.25/.875);--volr-text-base:1rem;--volr-text-base--line-height:calc(1.5/1);--volr-text-lg:1.125rem;--volr-text-lg--line-height:calc(1.75/1.125);--volr-text-xl:1.25rem;--volr-text-xl--line-height:calc(1.75/1.25);--volr-text-2xl:1.5rem;--volr-text-2xl--line-height:calc(2/1.5);--volr-text-8xl:6rem;--volr-text-8xl--line-height:1;--volr-font-weight-medium:500;--volr-font-weight-semibold:600;--volr-font-weight-bold:700;--volr-tracking-wide:.025em;--volr-leading-relaxed:1.625;--volr-radius-md:.375rem;--volr-radius-lg:.5rem;--volr-radius-xl:.75rem;--volr-radius-2xl:1rem;--volr-radius-3xl:1.5rem;--volr-ease-out:cubic-bezier(0,0,.2,1);--volr-animate-spin:spin 1s linear infinite;--volr-animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--volr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--volr-blur-2xl:40px;--volr-default-transition-duration:.15s;--volr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--volr-default-font-family:var(--volr-font-sans);--volr-default-mono-font-family:var(--volr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--volr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--volr-default-font-feature-settings,normal);font-variation-settings:var(--volr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--volr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--volr-default-mono-font-feature-settings,normal);font-variation-settings:var(--volr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:host{--volr-primary-color:var(--volr-accent-color,#303030);--volr-font-family:var(--volr-custom-font,inherit);--volr-bg:#fff;--volr-bg-secondary:#f8fafc;--volr-bg-tertiary:#f1f5f9;--volr-text:#0f172a;--volr-text-secondary:#475569;--volr-text-muted:#94a3b8;--volr-border:#e2e8f0;--volr-border-strong:#cbd5e1;--volr-hover-bg:#f8fafc;--volr-error-bg:#fef2f2;--volr-error-border:#fecaca;--volr-error-text:#991b1b;--volr-hint-bg:#f8fafc;--volr-hint-border:#e2e8f0;--volr-hint-text:#334155}:host([data-theme=dark]){--volr-bg:#1c1c1e;--volr-bg-secondary:#2c2c2e;--volr-bg-tertiary:#3a3a3c;--volr-text:#f5f5f7;--volr-text-secondary:#c7c7cc;--volr-text-muted:#8e8e93;--volr-border:#3a3a3c;--volr-border-strong:#48484a;--volr-hover-bg:#2c2c2e;--volr-error-bg:#3c1f1f;--volr-error-border:#7f1d1d;--volr-error-text:#fca5a5;--volr-hint-bg:#2c2c2e;--volr-hint-border:#3a3a3c;--volr-hint-text:#c7c7cc}*,:before,:after{box-sizing:border-box}*{font-family:var(--volr-font-family);color:var(--volr-text)}button,input,select,textarea{color:var(--volr-text);background-color:#0000}button{cursor:pointer;background-color:#0000}input::placeholder{color:var(--volr-text-muted)}h1,h2,h3{color:var(--volr-text);margin:0;font-weight:700}h1{font-size:1.875rem;line-height:2.25rem}h2{font-size:1.5rem;line-height:2rem}h3{font-size:1.25rem;line-height:1.75rem}p{margin:0}}@layer components{.volr-dialog-overlay{inset:calc(var(--volr-spacing)*0);z-index:40;background-color:var(--volr-color-black);position:fixed}@supports (color:color-mix(in lab, red, red)){.volr-dialog-overlay{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr-dialog-content{z-index:50;border-radius:var(--volr-radius-2xl);border-style:var(--volr-tw-border-style);padding:calc(var(--volr-spacing)*7);--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow);background-color:var(--volr-bg);border-width:1px;border-color:var(--volr-border-strong);width:calc(100% - 2rem);max-width:28rem;max-height:85vh;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@media (max-width:640px){.volr-dialog-content{top:auto;right:calc(var(--volr-spacing)*0);bottom:calc(var(--volr-spacing)*0);left:calc(var(--volr-spacing)*0);border-radius:1.25rem 1.25rem 0 0;width:100%;max-width:100%;margin:0 auto;transform:translateY(0)}}.volr-dialog-close{top:calc(var(--volr-spacing)*4);right:calc(var(--volr-spacing)*4);height:calc(var(--volr-spacing)*8);width:calc(var(--volr-spacing)*8);color:var(--volr-text-muted);cursor:pointer;background-color:#0000;border:none;border-radius:3.40282e38px;justify-content:center;align-items:center;display:inline-flex;position:absolute}.volr-dialog-close:hover{background-color:var(--volr-hover-bg);color:var(--volr-text-secondary)}.volr-dialog-close:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}.volr-dialog-close-icon{height:calc(var(--volr-spacing)*4);width:calc(var(--volr-spacing)*4)}.volr-email-input{border:1px solid var(--volr-border-strong);background-color:var(--volr-bg);width:100%;color:var(--volr-text);border-radius:.5rem;outline:none;padding:.75rem .75rem .75rem 2.75rem;font-size:1rem;line-height:1.5}.volr-email-input::placeholder{color:var(--volr-text-muted)}.volr-email-input:focus{border-color:var(--volr-border-strong);box-shadow:0 0 0 2px var(--volr-border-strong)}.volr-option-button{border:1px solid var(--volr-border);background-color:var(--volr-bg);width:100%;color:var(--volr-text);cursor:pointer;border-radius:.5rem;align-items:center;gap:.75rem;padding:.75rem;transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out;display:flex}.volr-option-button:hover{background-color:var(--volr-hover-bg);border-color:var(--volr-border)}.volr-option-button:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}}@layer utilities{.volr\\:pointer-events-auto{pointer-events:auto}.volr\\:pointer-events-none{pointer-events:none}.volr\\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.volr\\:absolute{position:absolute}.volr\\:fixed{position:fixed}.volr\\:relative{position:relative}.volr\\:inset-0{inset:calc(var(--volr-spacing)*0)}.volr\\:-top-3{top:calc(var(--volr-spacing)*-3)}.volr\\:top-1\\/2{top:50%}.volr\\:-right-3{right:calc(var(--volr-spacing)*-3)}.volr\\:right-0{right:calc(var(--volr-spacing)*0)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:right-3{right:calc(var(--volr-spacing)*3)}.volr\\:bottom-0{bottom:calc(var(--volr-spacing)*0)}.volr\\:left-0{left:calc(var(--volr-spacing)*0)}.volr\\:left-3{left:calc(var(--volr-spacing)*3)}.volr\\:-z-10{z-index:calc(10*-1)}.volr\\:z-10{z-index:10}.volr\\:z-20{z-index:20}.volr\\:z-40{z-index:40}.volr\\:z-50{z-index:50}.volr\\:mx-auto{margin-inline:auto}.volr\\:my-6{margin-block:calc(var(--volr-spacing)*6)}.volr\\:mt-0\\.5{margin-top:calc(var(--volr-spacing)*.5)}.volr\\:mt-1{margin-top:calc(var(--volr-spacing)*1)}.volr\\:mt-2{margin-top:calc(var(--volr-spacing)*2)}.volr\\:mt-3{margin-top:calc(var(--volr-spacing)*3)}.volr\\:mt-4{margin-top:calc(var(--volr-spacing)*4)}.volr\\:mt-6{margin-top:calc(var(--volr-spacing)*6)}.volr\\:mt-8{margin-top:calc(var(--volr-spacing)*8)}.volr\\:mb-0\\.5{margin-bottom:calc(var(--volr-spacing)*.5)}.volr\\:mb-1{margin-bottom:calc(var(--volr-spacing)*1)}.volr\\:mb-2{margin-bottom:calc(var(--volr-spacing)*2)}.volr\\:mb-3{margin-bottom:calc(var(--volr-spacing)*3)}.volr\\:mb-4{margin-bottom:calc(var(--volr-spacing)*4)}.volr\\:mb-5{margin-bottom:calc(var(--volr-spacing)*5)}.volr\\:mb-6{margin-bottom:calc(var(--volr-spacing)*6)}.volr\\:mb-8{margin-bottom:calc(var(--volr-spacing)*8)}.volr\\:-ml-2{margin-left:calc(var(--volr-spacing)*-2)}.volr\\:ml-6{margin-left:calc(var(--volr-spacing)*6)}.volr\\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.volr\\:block{display:block}.volr\\:flex{display:flex}.volr\\:grid{display:grid}.volr\\:inline-block{display:inline-block}.volr\\:inline-flex{display:inline-flex}.volr\\:h-1{height:calc(var(--volr-spacing)*1)}.volr\\:h-1\\.5{height:calc(var(--volr-spacing)*1.5)}.volr\\:h-2{height:calc(var(--volr-spacing)*2)}.volr\\:h-3{height:calc(var(--volr-spacing)*3)}.volr\\:h-4{height:calc(var(--volr-spacing)*4)}.volr\\:h-5{height:calc(var(--volr-spacing)*5)}.volr\\:h-6{height:calc(var(--volr-spacing)*6)}.volr\\:h-7{height:calc(var(--volr-spacing)*7)}.volr\\:h-8{height:calc(var(--volr-spacing)*8)}.volr\\:h-10{height:calc(var(--volr-spacing)*10)}.volr\\:h-12{height:calc(var(--volr-spacing)*12)}.volr\\:h-14{height:calc(var(--volr-spacing)*14)}.volr\\:h-16{height:calc(var(--volr-spacing)*16)}.volr\\:h-20{height:calc(var(--volr-spacing)*20)}.volr\\:h-24{height:calc(var(--volr-spacing)*24)}.volr\\:h-40{height:calc(var(--volr-spacing)*40)}.volr\\:h-44{height:calc(var(--volr-spacing)*44)}.volr\\:h-48{height:calc(var(--volr-spacing)*48)}.volr\\:h-\\[0\\.8em\\]{height:.8em}.volr\\:h-\\[200px\\]{height:200px}.volr\\:h-full{height:100%}.volr\\:h-px{height:1px}.volr\\:max-h-48{max-height:calc(var(--volr-spacing)*48)}.volr\\:max-h-60{max-height:calc(var(--volr-spacing)*60)}.volr\\:max-h-64{max-height:calc(var(--volr-spacing)*64)}.volr\\:max-h-\\[85vh\\]{max-height:85vh}.volr\\:max-h-\\[90vh\\]{max-height:90vh}.volr\\:min-h-\\[100px\\]{min-height:100px}.volr\\:min-h-\\[120px\\]{min-height:120px}.volr\\:min-h-\\[500px\\]{min-height:500px}.volr\\:w-1\\.5{width:calc(var(--volr-spacing)*1.5)}.volr\\:w-2{width:calc(var(--volr-spacing)*2)}.volr\\:w-3{width:calc(var(--volr-spacing)*3)}.volr\\:w-4{width:calc(var(--volr-spacing)*4)}.volr\\:w-5{width:calc(var(--volr-spacing)*5)}.volr\\:w-6{width:calc(var(--volr-spacing)*6)}.volr\\:w-7{width:calc(var(--volr-spacing)*7)}.volr\\:w-8{width:calc(var(--volr-spacing)*8)}.volr\\:w-10{width:calc(var(--volr-spacing)*10)}.volr\\:w-12{width:calc(var(--volr-spacing)*12)}.volr\\:w-14{width:calc(var(--volr-spacing)*14)}.volr\\:w-16{width:calc(var(--volr-spacing)*16)}.volr\\:w-20{width:calc(var(--volr-spacing)*20)}.volr\\:w-24{width:calc(var(--volr-spacing)*24)}.volr\\:w-32{width:calc(var(--volr-spacing)*32)}.volr\\:w-36{width:calc(var(--volr-spacing)*36)}.volr\\:w-40{width:calc(var(--volr-spacing)*40)}.volr\\:w-44{width:calc(var(--volr-spacing)*44)}.volr\\:w-48{width:calc(var(--volr-spacing)*48)}.volr\\:w-\\[200px\\]{width:200px}.volr\\:w-auto{width:auto}.volr\\:w-full{width:100%}.volr\\:max-w-4xl{max-width:var(--volr-container-4xl)}.volr\\:max-w-full{max-width:100%}.volr\\:max-w-md{max-width:var(--volr-container-md)}.volr\\:max-w-none{max-width:none}.volr\\:min-w-0{min-width:calc(var(--volr-spacing)*0)}.volr\\:flex-1{flex:1}.volr\\:flex-shrink-0,.volr\\:shrink-0{flex-shrink:0}.volr\\:-translate-y-1\\/2{--volr-tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--volr-tw-translate-x)var(--volr-tw-translate-y)}.volr\\:rotate-90{rotate:90deg}.volr\\:rotate-180{rotate:180deg}.volr\\:animate-ping{animation:var(--volr-animate-ping)}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:animate-spin{animation:var(--volr-animate-spin)}.volr\\:cursor-not-allowed{cursor:not-allowed}.volr\\:cursor-pointer{cursor:pointer}.volr\\:list-inside{list-style-position:inside}.volr\\:list-decimal{list-style-type:decimal}.volr\\:grid-cols-\\[minmax\\(0\\,1\\.1fr\\)_minmax\\(0\\,1fr\\)\\]{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.volr\\:flex-col{flex-direction:column}.volr\\:items-baseline{align-items:baseline}.volr\\:items-center{align-items:center}.volr\\:items-end{align-items:flex-end}.volr\\:items-start{align-items:flex-start}.volr\\:justify-between{justify-content:space-between}.volr\\:justify-center{justify-content:center}.volr\\:gap-1{gap:calc(var(--volr-spacing)*1)}.volr\\:gap-2{gap:calc(var(--volr-spacing)*2)}.volr\\:gap-3{gap:calc(var(--volr-spacing)*3)}.volr\\:gap-4{gap:calc(var(--volr-spacing)*4)}:where(.volr\\:space-y-1>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*1)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*1)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-2>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*2)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*2)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-3>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*3)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*3)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-4>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*4)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*4)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-6>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*6)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*6)*calc(1 - var(--volr-tw-space-y-reverse)))}.volr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.volr\\:overflow-auto{overflow:auto}.volr\\:overflow-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.volr\\:overflow-x-auto{overflow-x:auto}.volr\\:overflow-y-auto{overflow-y:auto}.volr\\:rounded{border-radius:.25rem}.volr\\:rounded-2xl{border-radius:var(--volr-radius-2xl)}.volr\\:rounded-full{border-radius:3.40282e38px}.volr\\:rounded-lg{border-radius:var(--volr-radius-lg)}.volr\\:rounded-md{border-radius:var(--volr-radius-md)}.volr\\:rounded-xl{border-radius:var(--volr-radius-xl)}.volr\\:rounded-t-2xl{border-top-left-radius:var(--volr-radius-2xl);border-top-right-radius:var(--volr-radius-2xl)}.volr\\:rounded-t-3xl{border-top-left-radius:var(--volr-radius-3xl);border-top-right-radius:var(--volr-radius-3xl)}.volr\\:rounded-t-xl{border-top-left-radius:var(--volr-radius-xl);border-top-right-radius:var(--volr-radius-xl)}.volr\\:rounded-b-xl{border-bottom-right-radius:var(--volr-radius-xl);border-bottom-left-radius:var(--volr-radius-xl)}.volr\\:border{border-style:var(--volr-tw-border-style);border-width:1px}.volr\\:border-2{border-style:var(--volr-tw-border-style);border-width:2px}.volr\\:border-4{border-style:var(--volr-tw-border-style);border-width:4px}.volr\\:border-x{border-inline-style:var(--volr-tw-border-style);border-inline-width:1px}.volr\\:border-y{border-block-style:var(--volr-tw-border-style);border-block-width:1px}.volr\\:border-t{border-top-style:var(--volr-tw-border-style);border-top-width:1px}.volr\\:border-b{border-bottom-style:var(--volr-tw-border-style);border-bottom-width:1px}.volr\\:border-amber-200{border-color:var(--volr-color-amber-200)}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.volr\\:border-red-500{border-color:var(--volr-color-red-500)}.volr\\:border-slate-100{border-color:var(--volr-color-slate-100)}.volr\\:border-slate-200{border-color:var(--volr-color-slate-200)}.volr\\:border-slate-300{border-color:var(--volr-color-slate-300)}.volr\\:border-transparent{border-color:#0000}.volr\\:border-white{border-color:var(--volr-color-white)}.volr\\:border-t-slate-600{border-top-color:var(--volr-color-slate-600)}.volr\\:border-t-slate-900{border-top-color:var(--volr-color-slate-900)}.volr\\:bg-amber-50{background-color:var(--volr-color-amber-50)}.volr\\:bg-black\\/45{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/45{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr\\:bg-blue-100{background-color:var(--volr-color-blue-100)}.volr\\:bg-cyan-400{background-color:var(--volr-color-cyan-400)}.volr\\:bg-emerald-300{background-color:var(--volr-color-emerald-300)}.volr\\:bg-emerald-400{background-color:var(--volr-color-emerald-400)}.volr\\:bg-emerald-500{background-color:var(--volr-color-emerald-500)}.volr\\:bg-green-50{background-color:var(--volr-color-green-50)}.volr\\:bg-green-100{background-color:var(--volr-color-green-100)}.volr\\:bg-red-50{background-color:var(--volr-color-red-50)}.volr\\:bg-red-100{background-color:var(--volr-color-red-100)}.volr\\:bg-slate-50{background-color:var(--volr-color-slate-50)}.volr\\:bg-slate-100{background-color:var(--volr-color-slate-100)}.volr\\:bg-slate-200{background-color:var(--volr-color-slate-200)}.volr\\:bg-slate-900{background-color:var(--volr-color-slate-900)}.volr\\:bg-teal-400{background-color:var(--volr-color-teal-400)}.volr\\:bg-white{background-color:var(--volr-color-white)}.volr\\:bg-yellow-100{background-color:var(--volr-color-yellow-100)}.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right in oklab}}.volr\\:bg-linear-to-br{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-linear-to-r{--volr-tw-gradient-position:to right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-r{--volr-tw-gradient-position:to right in oklab}}.volr\\:bg-linear-to-r{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-gradient-to-br{--volr-tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:from-emerald-400{--volr-tw-gradient-from:var(--volr-color-emerald-400);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:from-slate-50{--volr-tw-gradient-from:var(--volr-color-slate-50);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-slate-100{--volr-tw-gradient-to:var(--volr-color-slate-100);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-teal-500{--volr-tw-gradient-to:var(--volr-color-teal-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:object-cover{object-fit:cover}.volr\\:p-1{padding:calc(var(--volr-spacing)*1)}.volr\\:p-2{padding:calc(var(--volr-spacing)*2)}.volr\\:p-3{padding:calc(var(--volr-spacing)*3)}.volr\\:p-4{padding:calc(var(--volr-spacing)*4)}.volr\\:p-5{padding:calc(var(--volr-spacing)*5)}.volr\\:p-8{padding:calc(var(--volr-spacing)*8)}.volr\\:px-1\\.5{padding-inline:calc(var(--volr-spacing)*1.5)}.volr\\:px-2{padding-inline:calc(var(--volr-spacing)*2)}.volr\\:px-3{padding-inline:calc(var(--volr-spacing)*3)}.volr\\:px-4{padding-inline:calc(var(--volr-spacing)*4)}.volr\\:px-6{padding-inline:calc(var(--volr-spacing)*6)}.volr\\:py-0\\.5{padding-block:calc(var(--volr-spacing)*.5)}.volr\\:py-1{padding-block:calc(var(--volr-spacing)*1)}.volr\\:py-1\\.5{padding-block:calc(var(--volr-spacing)*1.5)}.volr\\:py-2{padding-block:calc(var(--volr-spacing)*2)}.volr\\:py-2\\.5{padding-block:calc(var(--volr-spacing)*2.5)}.volr\\:py-3{padding-block:calc(var(--volr-spacing)*3)}.volr\\:py-4{padding-block:calc(var(--volr-spacing)*4)}.volr\\:py-6{padding-block:calc(var(--volr-spacing)*6)}.volr\\:py-8{padding-block:calc(var(--volr-spacing)*8)}.volr\\:py-12{padding-block:calc(var(--volr-spacing)*12)}.volr\\:pt-2{padding-top:calc(var(--volr-spacing)*2)}.volr\\:pt-3{padding-top:calc(var(--volr-spacing)*3)}.volr\\:pt-4{padding-top:calc(var(--volr-spacing)*4)}.volr\\:pr-3{padding-right:calc(var(--volr-spacing)*3)}.volr\\:pr-16{padding-right:calc(var(--volr-spacing)*16)}.volr\\:pl-11{padding-left:calc(var(--volr-spacing)*11)}.volr\\:text-center{text-align:center}.volr\\:text-left{text-align:left}.volr\\:text-right{text-align:right}.volr\\:align-baseline{vertical-align:baseline}.volr\\:font-mono{font-family:var(--volr-font-mono)}.volr\\:text-2xl{font-size:var(--volr-text-2xl);line-height:var(--volr-tw-leading,var(--volr-text-2xl--line-height))}.volr\\:text-8xl{font-size:var(--volr-text-8xl);line-height:var(--volr-tw-leading,var(--volr-text-8xl--line-height))}.volr\\:text-base{font-size:var(--volr-text-base);line-height:var(--volr-tw-leading,var(--volr-text-base--line-height))}.volr\\:text-lg{font-size:var(--volr-text-lg);line-height:var(--volr-tw-leading,var(--volr-text-lg--line-height))}.volr\\:text-sm{font-size:var(--volr-text-sm);line-height:var(--volr-tw-leading,var(--volr-text-sm--line-height))}.volr\\:text-xl{font-size:var(--volr-text-xl);line-height:var(--volr-tw-leading,var(--volr-text-xl--line-height))}.volr\\:text-xs{font-size:var(--volr-text-xs);line-height:var(--volr-tw-leading,var(--volr-text-xs--line-height))}.volr\\:leading-relaxed{--volr-tw-leading:var(--volr-leading-relaxed);line-height:var(--volr-leading-relaxed)}.volr\\:font-bold{--volr-tw-font-weight:var(--volr-font-weight-bold);font-weight:var(--volr-font-weight-bold)}.volr\\:font-medium{--volr-tw-font-weight:var(--volr-font-weight-medium);font-weight:var(--volr-font-weight-medium)}.volr\\:font-semibold{--volr-tw-font-weight:var(--volr-font-weight-semibold);font-weight:var(--volr-font-weight-semibold)}.volr\\:tracking-wide{--volr-tw-tracking:var(--volr-tracking-wide);letter-spacing:var(--volr-tracking-wide)}.volr\\:break-all{word-break:break-all}.volr\\:text-amber-700{color:var(--volr-color-amber-700)}.volr\\:text-blue-700{color:var(--volr-color-blue-700)}.volr\\:text-emerald-600{color:var(--volr-color-emerald-600)}.volr\\:text-gray-500{color:var(--volr-color-gray-500)}.volr\\:text-green-600{color:var(--volr-color-green-600)}.volr\\:text-green-700{color:var(--volr-color-green-700)}.volr\\:text-red-500{color:var(--volr-color-red-500)}.volr\\:text-red-600{color:var(--volr-color-red-600)}.volr\\:text-red-700{color:var(--volr-color-red-700)}.volr\\:text-slate-300{color:var(--volr-color-slate-300)}.volr\\:text-slate-400{color:var(--volr-color-slate-400)}.volr\\:text-slate-500{color:var(--volr-color-slate-500)}.volr\\:text-slate-600{color:var(--volr-color-slate-600)}.volr\\:text-slate-700{color:var(--volr-color-slate-700)}.volr\\:text-slate-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:text-yellow-700{color:var(--volr-color-yellow-700)}.volr\\:capitalize{text-transform:capitalize}.volr\\:uppercase{text-transform:uppercase}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-25{opacity:.25}.volr\\:opacity-30{opacity:.3}.volr\\:opacity-50{opacity:.5}.volr\\:opacity-70{opacity:.7}.volr\\:opacity-75{opacity:.75}.volr\\:opacity-80{opacity:.8}.volr\\:shadow-2xl{--volr-tw-shadow:0 25px 50px -12px var(--volr-tw-shadow-color,#00000040);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-lg{--volr-tw-shadow:0 10px 15px -3px var(--volr-tw-shadow-color,#0000001a),0 4px 6px -4px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-sm{--volr-tw-shadow:0 1px 3px 0 var(--volr-tw-shadow-color,#0000001a),0 1px 2px -1px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-xl{--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:var(--volr-color-emerald-500)}@supports (color:color-mix(in lab, red, red)){.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--volr-color-emerald-500)50%,transparent)var(--volr-tw-shadow-alpha),transparent)}}.volr\\:blur-2xl{--volr-tw-blur:blur(var(--volr-blur-2xl));filter:var(--volr-tw-blur,)var(--volr-tw-brightness,)var(--volr-tw-contrast,)var(--volr-tw-grayscale,)var(--volr-tw-hue-rotate,)var(--volr-tw-invert,)var(--volr-tw-saturate,)var(--volr-tw-sepia,)var(--volr-tw-drop-shadow,)}.volr\\:transition-all{transition-property:all;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--volr-tw-gradient-from,--volr-tw-gradient-via,--volr-tw-gradient-to;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:duration-300{--volr-tw-duration:.3s;transition-duration:.3s}.volr\\:duration-500{--volr-tw-duration:.5s;transition-duration:.5s}.volr\\:ease-out{--volr-tw-ease:var(--volr-ease-out);transition-timing-function:var(--volr-ease-out)}.volr\\:outline-none{--volr-tw-outline-style:none;outline-style:none}@media (hover:hover){.volr\\:hover\\:border-slate-300:hover{border-color:var(--volr-color-slate-300)}.volr\\:hover\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}.volr\\:hover\\:bg-slate-200:hover{background-color:var(--volr-color-slate-200)}.volr\\:hover\\:text-slate-700:hover{color:var(--volr-color-slate-700)}}.volr\\:focus\\:ring-2:focus{--volr-tw-ring-shadow:var(--volr-tw-ring-inset,)0 0 0 calc(2px + var(--volr-tw-ring-offset-width))var(--volr-tw-ring-color,currentcolor);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:focus\\:ring-slate-300:focus{--volr-tw-ring-color:var(--volr-color-slate-300)}.volr\\:focus\\:outline-none:focus{--volr-tw-outline-style:none;outline-style:none}.volr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.volr\\:disabled\\:bg-slate-100:disabled{background-color:var(--volr-color-slate-100)}.volr\\:disabled\\:text-slate-400:disabled{color:var(--volr-color-slate-400)}.volr\\:disabled\\:opacity-50:disabled{opacity:.5}.volr-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.volr-text-secondary{color:var(--volr-text-secondary)}.volr-text-muted{color:var(--volr-text-muted)}.volr-bg-secondary{background-color:var(--volr-bg-secondary)}.volr-bg-tertiary{background-color:var(--volr-bg-tertiary)}.volr-border{border-color:var(--volr-border)}.volr-border-strong{border-color:var(--volr-border-strong)}.volr-divider-line{background-color:var(--volr-border)}.volr-error{background-color:var(--volr-error-bg);border-color:var(--volr-error-border);color:var(--volr-error-text)}.volr-hint{background-color:var(--volr-hint-bg);border:1px solid var(--volr-hint-border);color:var(--volr-hint-text)}.volr-hover:hover{background-color:var(--volr-hover-bg)}.volr-surface{background-color:var(--volr-bg)}}@property --volr-tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --volr-tw-gradient-position{syntax:"*";inherits:false}@property --volr-tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-via-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --volr-tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --volr-tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --volr-tw-leading{syntax:"*";inherits:false}@property --volr-tw-font-weight{syntax:"*";inherits:false}@property --volr-tw-tracking{syntax:"*";inherits:false}@property --volr-tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-shadow-color{syntax:"*";inherits:false}@property --volr-tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-shadow-color{syntax:"*";inherits:false}@property --volr-tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-ring-color{syntax:"*";inherits:false}@property --volr-tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-ring-color{syntax:"*";inherits:false}@property --volr-tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-ring-inset{syntax:"*";inherits:false}@property --volr-tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --volr-tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --volr-tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-blur{syntax:"*";inherits:false}@property --volr-tw-brightness{syntax:"*";inherits:false}@property --volr-tw-contrast{syntax:"*";inherits:false}@property --volr-tw-grayscale{syntax:"*";inherits:false}@property --volr-tw-hue-rotate{syntax:"*";inherits:false}@property --volr-tw-invert{syntax:"*";inherits:false}@property --volr-tw-opacity{syntax:"*";inherits:false}@property --volr-tw-saturate{syntax:"*";inherits:false}@property --volr-tw-sepia{syntax:"*";inherits:false}@property --volr-tw-drop-shadow{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-color{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-drop-shadow-size{syntax:"*";inherits:false}@property --volr-tw-duration{syntax:"*";inherits:false}@property --volr-tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}';
+var VOLR_SDK_CSS = '/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--volr-tw-translate-x:0;--volr-tw-translate-y:0;--volr-tw-translate-z:0;--volr-tw-space-y-reverse:0;--volr-tw-border-style:solid;--volr-tw-gradient-position:initial;--volr-tw-gradient-from:#0000;--volr-tw-gradient-via:#0000;--volr-tw-gradient-to:#0000;--volr-tw-gradient-stops:initial;--volr-tw-gradient-via-stops:initial;--volr-tw-gradient-from-position:0%;--volr-tw-gradient-via-position:50%;--volr-tw-gradient-to-position:100%;--volr-tw-leading:initial;--volr-tw-font-weight:initial;--volr-tw-tracking:initial;--volr-tw-shadow:0 0 #0000;--volr-tw-shadow-color:initial;--volr-tw-shadow-alpha:100%;--volr-tw-inset-shadow:0 0 #0000;--volr-tw-inset-shadow-color:initial;--volr-tw-inset-shadow-alpha:100%;--volr-tw-ring-color:initial;--volr-tw-ring-shadow:0 0 #0000;--volr-tw-inset-ring-color:initial;--volr-tw-inset-ring-shadow:0 0 #0000;--volr-tw-ring-inset:initial;--volr-tw-ring-offset-width:0px;--volr-tw-ring-offset-color:#fff;--volr-tw-ring-offset-shadow:0 0 #0000;--volr-tw-blur:initial;--volr-tw-brightness:initial;--volr-tw-contrast:initial;--volr-tw-grayscale:initial;--volr-tw-hue-rotate:initial;--volr-tw-invert:initial;--volr-tw-opacity:initial;--volr-tw-saturate:initial;--volr-tw-sepia:initial;--volr-tw-drop-shadow:initial;--volr-tw-drop-shadow-color:initial;--volr-tw-drop-shadow-alpha:100%;--volr-tw-drop-shadow-size:initial;--volr-tw-duration:initial;--volr-tw-ease:initial}}}@layer theme{:root,:host{--volr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--volr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--volr-color-red-50:oklch(97.1% .013 17.38);--volr-color-red-100:oklch(93.6% .032 17.717);--volr-color-red-200:oklch(88.5% .062 18.334);--volr-color-red-500:oklch(63.7% .237 25.331);--volr-color-red-600:oklch(57.7% .245 27.325);--volr-color-red-700:oklch(50.5% .213 27.518);--volr-color-amber-50:oklch(98.7% .022 95.277);--volr-color-amber-200:oklch(92.4% .12 95.746);--volr-color-amber-700:oklch(55.5% .163 48.998);--volr-color-yellow-100:oklch(97.3% .071 103.193);--volr-color-yellow-700:oklch(55.4% .135 66.442);--volr-color-green-50:oklch(98.2% .018 155.826);--volr-color-green-100:oklch(96.2% .044 156.743);--volr-color-green-600:oklch(62.7% .194 149.214);--volr-color-green-700:oklch(52.7% .154 150.069);--volr-color-emerald-300:oklch(84.5% .143 164.978);--volr-color-emerald-400:oklch(76.5% .177 163.223);--volr-color-emerald-500:oklch(69.6% .17 162.48);--volr-color-emerald-600:oklch(59.6% .145 163.225);--volr-color-teal-400:oklch(77.7% .152 181.912);--volr-color-teal-500:oklch(70.4% .14 182.503);--volr-color-cyan-400:oklch(78.9% .154 211.53);--volr-color-blue-100:oklch(93.2% .032 255.585);--volr-color-blue-700:oklch(48.8% .243 264.376);--volr-color-slate-50:oklch(98.4% .003 247.858);--volr-color-slate-100:oklch(96.8% .007 247.896);--volr-color-slate-200:oklch(92.9% .013 255.508);--volr-color-slate-300:oklch(86.9% .022 252.894);--volr-color-slate-400:oklch(70.4% .04 256.788);--volr-color-slate-500:oklch(55.4% .046 257.417);--volr-color-slate-600:oklch(44.6% .043 257.281);--volr-color-slate-700:oklch(37.2% .044 257.287);--volr-color-slate-800:oklch(27.9% .041 260.031);--volr-color-slate-900:oklch(20.8% .042 265.755);--volr-color-gray-500:oklch(55.1% .027 264.364);--volr-color-black:#000;--volr-color-white:#fff;--volr-spacing:.25rem;--volr-container-md:28rem;--volr-container-4xl:56rem;--volr-text-xs:.75rem;--volr-text-xs--line-height:calc(1/.75);--volr-text-sm:.875rem;--volr-text-sm--line-height:calc(1.25/.875);--volr-text-base:1rem;--volr-text-base--line-height:calc(1.5/1);--volr-text-lg:1.125rem;--volr-text-lg--line-height:calc(1.75/1.125);--volr-text-xl:1.25rem;--volr-text-xl--line-height:calc(1.75/1.25);--volr-text-2xl:1.5rem;--volr-text-2xl--line-height:calc(2/1.5);--volr-text-8xl:6rem;--volr-text-8xl--line-height:1;--volr-font-weight-medium:500;--volr-font-weight-semibold:600;--volr-font-weight-bold:700;--volr-tracking-tight:-.025em;--volr-tracking-wide:.025em;--volr-tracking-wider:.05em;--volr-leading-relaxed:1.625;--volr-radius-md:.375rem;--volr-radius-lg:.5rem;--volr-radius-xl:.75rem;--volr-radius-2xl:1rem;--volr-radius-3xl:1.5rem;--volr-ease-out:cubic-bezier(0,0,.2,1);--volr-animate-spin:spin 1s linear infinite;--volr-animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--volr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--volr-blur-2xl:40px;--volr-default-transition-duration:.15s;--volr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--volr-default-font-family:var(--volr-font-sans);--volr-default-mono-font-family:var(--volr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--volr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--volr-default-font-feature-settings,normal);font-variation-settings:var(--volr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--volr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--volr-default-mono-font-feature-settings,normal);font-variation-settings:var(--volr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:host{--volr-primary-color:var(--volr-accent-color,#303030);--volr-font-family:var(--volr-custom-font,inherit);--volr-bg:#fff;--volr-bg-secondary:#f8fafc;--volr-bg-tertiary:#f1f5f9;--volr-text:#0f172a;--volr-text-secondary:#475569;--volr-text-muted:#94a3b8;--volr-border:#e2e8f0;--volr-border-strong:#cbd5e1;--volr-hover-bg:#f8fafc;--volr-error-bg:#fef2f2;--volr-error-border:#fecaca;--volr-error-text:#991b1b;--volr-hint-bg:#f8fafc;--volr-hint-border:#e2e8f0;--volr-hint-text:#334155}:host([data-theme=dark]){--volr-bg:#1c1c1e;--volr-bg-secondary:#2c2c2e;--volr-bg-tertiary:#3a3a3c;--volr-text:#f5f5f7;--volr-text-secondary:#c7c7cc;--volr-text-muted:#8e8e93;--volr-border:#3a3a3c;--volr-border-strong:#48484a;--volr-hover-bg:#2c2c2e;--volr-error-bg:#3c1f1f;--volr-error-border:#7f1d1d;--volr-error-text:#fca5a5;--volr-hint-bg:#2c2c2e;--volr-hint-border:#3a3a3c;--volr-hint-text:#c7c7cc}*,:before,:after{box-sizing:border-box}*{font-family:var(--volr-font-family);color:var(--volr-text)}button,input,select,textarea{color:var(--volr-text);background-color:#0000}button{cursor:pointer;background-color:#0000}input::placeholder{color:var(--volr-text-muted)}h1,h2,h3{color:var(--volr-text);margin:0;font-weight:700}h1{font-size:1.875rem;line-height:2.25rem}h2{font-size:1.5rem;line-height:2rem}h3{font-size:1.25rem;line-height:1.75rem}p{margin:0}}@layer components{.volr-dialog-overlay{inset:calc(var(--volr-spacing)*0);z-index:40;background-color:var(--volr-color-black);position:fixed}@supports (color:color-mix(in lab, red, red)){.volr-dialog-overlay{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr-dialog-content{z-index:50;border-radius:var(--volr-radius-2xl);border-style:var(--volr-tw-border-style);padding:calc(var(--volr-spacing)*7);--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow);background-color:var(--volr-bg);border-width:1px;border-color:var(--volr-border-strong);width:calc(100% - 2rem);max-width:28rem;max-height:85vh;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@media (max-width:640px){.volr-dialog-content{top:auto;right:calc(var(--volr-spacing)*0);bottom:calc(var(--volr-spacing)*0);left:calc(var(--volr-spacing)*0);border-radius:1.25rem 1.25rem 0 0;width:100%;max-width:100%;margin:0 auto;transform:translateY(0)}}.volr-dialog-close{top:calc(var(--volr-spacing)*4);right:calc(var(--volr-spacing)*4);height:calc(var(--volr-spacing)*8);width:calc(var(--volr-spacing)*8);color:var(--volr-text-muted);cursor:pointer;background-color:#0000;border:none;border-radius:3.40282e38px;justify-content:center;align-items:center;display:inline-flex;position:absolute}.volr-dialog-close:hover{background-color:var(--volr-hover-bg);color:var(--volr-text-secondary)}.volr-dialog-close:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}.volr-dialog-close-icon{height:calc(var(--volr-spacing)*4);width:calc(var(--volr-spacing)*4)}.volr-email-input{border:1px solid var(--volr-border-strong);background-color:var(--volr-bg);width:100%;color:var(--volr-text);border-radius:.5rem;outline:none;padding:.75rem .75rem .75rem 2.75rem;font-size:1rem;line-height:1.5}.volr-email-input::placeholder{color:var(--volr-text-muted)}.volr-email-input:focus{border-color:var(--volr-border-strong);box-shadow:0 0 0 2px var(--volr-border-strong)}.volr-option-button{border:1px solid var(--volr-border);background-color:var(--volr-bg);width:100%;color:var(--volr-text);cursor:pointer;border-radius:.5rem;align-items:center;gap:.75rem;padding:.75rem;transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out;display:flex}.volr-option-button:hover{background-color:var(--volr-hover-bg);border-color:var(--volr-border)}.volr-option-button:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}}@layer utilities{.volr\\:pointer-events-auto{pointer-events:auto}.volr\\:pointer-events-none{pointer-events:none}.volr\\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.volr\\:absolute{position:absolute}.volr\\:fixed{position:fixed}.volr\\:relative{position:relative}.volr\\:inset-0{inset:calc(var(--volr-spacing)*0)}.volr\\:-top-3{top:calc(var(--volr-spacing)*-3)}.volr\\:top-1\\/2{top:50%}.volr\\:-right-3{right:calc(var(--volr-spacing)*-3)}.volr\\:right-0{right:calc(var(--volr-spacing)*0)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:right-3{right:calc(var(--volr-spacing)*3)}.volr\\:bottom-0{bottom:calc(var(--volr-spacing)*0)}.volr\\:left-0{left:calc(var(--volr-spacing)*0)}.volr\\:left-3{left:calc(var(--volr-spacing)*3)}.volr\\:-z-10{z-index:calc(10*-1)}.volr\\:z-10{z-index:10}.volr\\:z-20{z-index:20}.volr\\:z-40{z-index:40}.volr\\:z-50{z-index:50}.volr\\:mx-auto{margin-inline:auto}.volr\\:my-6{margin-block:calc(var(--volr-spacing)*6)}.volr\\:mt-0\\.5{margin-top:calc(var(--volr-spacing)*.5)}.volr\\:mt-1{margin-top:calc(var(--volr-spacing)*1)}.volr\\:mt-2{margin-top:calc(var(--volr-spacing)*2)}.volr\\:mt-3{margin-top:calc(var(--volr-spacing)*3)}.volr\\:mt-4{margin-top:calc(var(--volr-spacing)*4)}.volr\\:mt-6{margin-top:calc(var(--volr-spacing)*6)}.volr\\:mt-8{margin-top:calc(var(--volr-spacing)*8)}.volr\\:mb-1{margin-bottom:calc(var(--volr-spacing)*1)}.volr\\:mb-2{margin-bottom:calc(var(--volr-spacing)*2)}.volr\\:mb-3{margin-bottom:calc(var(--volr-spacing)*3)}.volr\\:mb-4{margin-bottom:calc(var(--volr-spacing)*4)}.volr\\:mb-5{margin-bottom:calc(var(--volr-spacing)*5)}.volr\\:mb-6{margin-bottom:calc(var(--volr-spacing)*6)}.volr\\:mb-8{margin-bottom:calc(var(--volr-spacing)*8)}.volr\\:-ml-2{margin-left:calc(var(--volr-spacing)*-2)}.volr\\:ml-6{margin-left:calc(var(--volr-spacing)*6)}.volr\\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.volr\\:block{display:block}.volr\\:flex{display:flex}.volr\\:grid{display:grid}.volr\\:inline-block{display:inline-block}.volr\\:inline-flex{display:inline-flex}.volr\\:h-1{height:calc(var(--volr-spacing)*1)}.volr\\:h-1\\.5{height:calc(var(--volr-spacing)*1.5)}.volr\\:h-2{height:calc(var(--volr-spacing)*2)}.volr\\:h-3{height:calc(var(--volr-spacing)*3)}.volr\\:h-4{height:calc(var(--volr-spacing)*4)}.volr\\:h-5{height:calc(var(--volr-spacing)*5)}.volr\\:h-6{height:calc(var(--volr-spacing)*6)}.volr\\:h-7{height:calc(var(--volr-spacing)*7)}.volr\\:h-8{height:calc(var(--volr-spacing)*8)}.volr\\:h-10{height:calc(var(--volr-spacing)*10)}.volr\\:h-12{height:calc(var(--volr-spacing)*12)}.volr\\:h-14{height:calc(var(--volr-spacing)*14)}.volr\\:h-16{height:calc(var(--volr-spacing)*16)}.volr\\:h-20{height:calc(var(--volr-spacing)*20)}.volr\\:h-24{height:calc(var(--volr-spacing)*24)}.volr\\:h-40{height:calc(var(--volr-spacing)*40)}.volr\\:h-44{height:calc(var(--volr-spacing)*44)}.volr\\:h-48{height:calc(var(--volr-spacing)*48)}.volr\\:h-\\[0\\.8em\\]{height:.8em}.volr\\:h-\\[200px\\]{height:200px}.volr\\:h-full{height:100%}.volr\\:h-px{height:1px}.volr\\:max-h-48{max-height:calc(var(--volr-spacing)*48)}.volr\\:max-h-60{max-height:calc(var(--volr-spacing)*60)}.volr\\:max-h-64{max-height:calc(var(--volr-spacing)*64)}.volr\\:max-h-\\[85vh\\]{max-height:85vh}.volr\\:max-h-\\[90vh\\]{max-height:90vh}.volr\\:min-h-\\[100px\\]{min-height:100px}.volr\\:min-h-\\[120px\\]{min-height:120px}.volr\\:min-h-\\[500px\\]{min-height:500px}.volr\\:w-1\\.5{width:calc(var(--volr-spacing)*1.5)}.volr\\:w-2{width:calc(var(--volr-spacing)*2)}.volr\\:w-3{width:calc(var(--volr-spacing)*3)}.volr\\:w-4{width:calc(var(--volr-spacing)*4)}.volr\\:w-5{width:calc(var(--volr-spacing)*5)}.volr\\:w-6{width:calc(var(--volr-spacing)*6)}.volr\\:w-7{width:calc(var(--volr-spacing)*7)}.volr\\:w-8{width:calc(var(--volr-spacing)*8)}.volr\\:w-10{width:calc(var(--volr-spacing)*10)}.volr\\:w-12{width:calc(var(--volr-spacing)*12)}.volr\\:w-14{width:calc(var(--volr-spacing)*14)}.volr\\:w-16{width:calc(var(--volr-spacing)*16)}.volr\\:w-20{width:calc(var(--volr-spacing)*20)}.volr\\:w-24{width:calc(var(--volr-spacing)*24)}.volr\\:w-32{width:calc(var(--volr-spacing)*32)}.volr\\:w-36{width:calc(var(--volr-spacing)*36)}.volr\\:w-40{width:calc(var(--volr-spacing)*40)}.volr\\:w-44{width:calc(var(--volr-spacing)*44)}.volr\\:w-48{width:calc(var(--volr-spacing)*48)}.volr\\:w-\\[200px\\]{width:200px}.volr\\:w-auto{width:auto}.volr\\:w-full{width:100%}.volr\\:max-w-4xl{max-width:var(--volr-container-4xl)}.volr\\:max-w-full{max-width:100%}.volr\\:max-w-md{max-width:var(--volr-container-md)}.volr\\:max-w-none{max-width:none}.volr\\:min-w-0{min-width:calc(var(--volr-spacing)*0)}.volr\\:flex-1{flex:1}.volr\\:flex-shrink-0,.volr\\:shrink-0{flex-shrink:0}.volr\\:-translate-y-1\\/2{--volr-tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--volr-tw-translate-x)var(--volr-tw-translate-y)}.volr\\:rotate-90{rotate:90deg}.volr\\:rotate-180{rotate:180deg}.volr\\:animate-ping{animation:var(--volr-animate-ping)}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:animate-spin{animation:var(--volr-animate-spin)}.volr\\:cursor-not-allowed{cursor:not-allowed}.volr\\:cursor-pointer{cursor:pointer}.volr\\:list-inside{list-style-position:inside}.volr\\:list-decimal{list-style-type:decimal}.volr\\:grid-cols-\\[minmax\\(0\\,1\\.1fr\\)_minmax\\(0\\,1fr\\)\\]{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.volr\\:flex-col{flex-direction:column}.volr\\:items-baseline{align-items:baseline}.volr\\:items-center{align-items:center}.volr\\:items-end{align-items:flex-end}.volr\\:items-start{align-items:flex-start}.volr\\:justify-between{justify-content:space-between}.volr\\:justify-center{justify-content:center}.volr\\:gap-1{gap:calc(var(--volr-spacing)*1)}.volr\\:gap-2{gap:calc(var(--volr-spacing)*2)}.volr\\:gap-3{gap:calc(var(--volr-spacing)*3)}.volr\\:gap-4{gap:calc(var(--volr-spacing)*4)}:where(.volr\\:space-y-1>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*1)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*1)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-2>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*2)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*2)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-3>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*3)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*3)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-4>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*4)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*4)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-5>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*5)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*5)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-6>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*6)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*6)*calc(1 - var(--volr-tw-space-y-reverse)))}.volr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.volr\\:overflow-auto{overflow:auto}.volr\\:overflow-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.volr\\:overflow-x-auto{overflow-x:auto}.volr\\:overflow-y-auto{overflow-y:auto}.volr\\:rounded{border-radius:.25rem}.volr\\:rounded-2xl{border-radius:var(--volr-radius-2xl)}.volr\\:rounded-full{border-radius:3.40282e38px}.volr\\:rounded-lg{border-radius:var(--volr-radius-lg)}.volr\\:rounded-md{border-radius:var(--volr-radius-md)}.volr\\:rounded-xl{border-radius:var(--volr-radius-xl)}.volr\\:rounded-t-2xl{border-top-left-radius:var(--volr-radius-2xl);border-top-right-radius:var(--volr-radius-2xl)}.volr\\:rounded-t-3xl{border-top-left-radius:var(--volr-radius-3xl);border-top-right-radius:var(--volr-radius-3xl)}.volr\\:border{border-style:var(--volr-tw-border-style);border-width:1px}.volr\\:border-2{border-style:var(--volr-tw-border-style);border-width:2px}.volr\\:border-4{border-style:var(--volr-tw-border-style);border-width:4px}.volr\\:border-y{border-block-style:var(--volr-tw-border-style);border-block-width:1px}.volr\\:border-t{border-top-style:var(--volr-tw-border-style);border-top-width:1px}.volr\\:border-b{border-bottom-style:var(--volr-tw-border-style);border-bottom-width:1px}.volr\\:border-amber-200{border-color:var(--volr-color-amber-200)}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.volr\\:border-red-500{border-color:var(--volr-color-red-500)}.volr\\:border-slate-100{border-color:var(--volr-color-slate-100)}.volr\\:border-slate-200{border-color:var(--volr-color-slate-200)}.volr\\:border-slate-300{border-color:var(--volr-color-slate-300)}.volr\\:border-transparent{border-color:#0000}.volr\\:border-white{border-color:var(--volr-color-white)}.volr\\:border-t-slate-600{border-top-color:var(--volr-color-slate-600)}.volr\\:border-t-slate-900{border-top-color:var(--volr-color-slate-900)}.volr\\:bg-amber-50{background-color:var(--volr-color-amber-50)}.volr\\:bg-black\\/45{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/45{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr\\:bg-blue-100{background-color:var(--volr-color-blue-100)}.volr\\:bg-cyan-400{background-color:var(--volr-color-cyan-400)}.volr\\:bg-emerald-300{background-color:var(--volr-color-emerald-300)}.volr\\:bg-emerald-400{background-color:var(--volr-color-emerald-400)}.volr\\:bg-emerald-500{background-color:var(--volr-color-emerald-500)}.volr\\:bg-green-50{background-color:var(--volr-color-green-50)}.volr\\:bg-green-100{background-color:var(--volr-color-green-100)}.volr\\:bg-red-50{background-color:var(--volr-color-red-50)}.volr\\:bg-red-100{background-color:var(--volr-color-red-100)}.volr\\:bg-slate-50{background-color:var(--volr-color-slate-50)}.volr\\:bg-slate-100{background-color:var(--volr-color-slate-100)}.volr\\:bg-slate-200{background-color:var(--volr-color-slate-200)}.volr\\:bg-slate-900{background-color:var(--volr-color-slate-900)}.volr\\:bg-teal-400{background-color:var(--volr-color-teal-400)}.volr\\:bg-white{background-color:var(--volr-color-white)}.volr\\:bg-yellow-100{background-color:var(--volr-color-yellow-100)}.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right in oklab}}.volr\\:bg-linear-to-br{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-linear-to-r{--volr-tw-gradient-position:to right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-r{--volr-tw-gradient-position:to right in oklab}}.volr\\:bg-linear-to-r{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:from-emerald-400{--volr-tw-gradient-from:var(--volr-color-emerald-400);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-teal-500{--volr-tw-gradient-to:var(--volr-color-teal-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:object-cover{object-fit:cover}.volr\\:p-1{padding:calc(var(--volr-spacing)*1)}.volr\\:p-2{padding:calc(var(--volr-spacing)*2)}.volr\\:p-3{padding:calc(var(--volr-spacing)*3)}.volr\\:p-4{padding:calc(var(--volr-spacing)*4)}.volr\\:p-5{padding:calc(var(--volr-spacing)*5)}.volr\\:p-8{padding:calc(var(--volr-spacing)*8)}.volr\\:px-1\\.5{padding-inline:calc(var(--volr-spacing)*1.5)}.volr\\:px-2{padding-inline:calc(var(--volr-spacing)*2)}.volr\\:px-3{padding-inline:calc(var(--volr-spacing)*3)}.volr\\:px-4{padding-inline:calc(var(--volr-spacing)*4)}.volr\\:px-5{padding-inline:calc(var(--volr-spacing)*5)}.volr\\:px-6{padding-inline:calc(var(--volr-spacing)*6)}.volr\\:py-0\\.5{padding-block:calc(var(--volr-spacing)*.5)}.volr\\:py-1{padding-block:calc(var(--volr-spacing)*1)}.volr\\:py-1\\.5{padding-block:calc(var(--volr-spacing)*1.5)}.volr\\:py-2{padding-block:calc(var(--volr-spacing)*2)}.volr\\:py-2\\.5{padding-block:calc(var(--volr-spacing)*2.5)}.volr\\:py-3{padding-block:calc(var(--volr-spacing)*3)}.volr\\:py-4{padding-block:calc(var(--volr-spacing)*4)}.volr\\:py-6{padding-block:calc(var(--volr-spacing)*6)}.volr\\:py-7{padding-block:calc(var(--volr-spacing)*7)}.volr\\:py-8{padding-block:calc(var(--volr-spacing)*8)}.volr\\:py-12{padding-block:calc(var(--volr-spacing)*12)}.volr\\:pt-1{padding-top:calc(var(--volr-spacing)*1)}.volr\\:pt-2{padding-top:calc(var(--volr-spacing)*2)}.volr\\:pt-3{padding-top:calc(var(--volr-spacing)*3)}.volr\\:pt-4{padding-top:calc(var(--volr-spacing)*4)}.volr\\:pt-5{padding-top:calc(var(--volr-spacing)*5)}.volr\\:pr-3{padding-right:calc(var(--volr-spacing)*3)}.volr\\:pr-16{padding-right:calc(var(--volr-spacing)*16)}.volr\\:pb-6{padding-bottom:calc(var(--volr-spacing)*6)}.volr\\:pl-11{padding-left:calc(var(--volr-spacing)*11)}.volr\\:text-center{text-align:center}.volr\\:text-left{text-align:left}.volr\\:text-right{text-align:right}.volr\\:align-baseline{vertical-align:baseline}.volr\\:font-mono{font-family:var(--volr-font-mono)}.volr\\:text-2xl{font-size:var(--volr-text-2xl);line-height:var(--volr-tw-leading,var(--volr-text-2xl--line-height))}.volr\\:text-8xl{font-size:var(--volr-text-8xl);line-height:var(--volr-tw-leading,var(--volr-text-8xl--line-height))}.volr\\:text-base{font-size:var(--volr-text-base);line-height:var(--volr-tw-leading,var(--volr-text-base--line-height))}.volr\\:text-lg{font-size:var(--volr-text-lg);line-height:var(--volr-tw-leading,var(--volr-text-lg--line-height))}.volr\\:text-sm{font-size:var(--volr-text-sm);line-height:var(--volr-tw-leading,var(--volr-text-sm--line-height))}.volr\\:text-xl{font-size:var(--volr-text-xl);line-height:var(--volr-tw-leading,var(--volr-text-xl--line-height))}.volr\\:text-xs{font-size:var(--volr-text-xs);line-height:var(--volr-tw-leading,var(--volr-text-xs--line-height))}.volr\\:leading-none{--volr-tw-leading:1;line-height:1}.volr\\:leading-relaxed{--volr-tw-leading:var(--volr-leading-relaxed);line-height:var(--volr-leading-relaxed)}.volr\\:font-bold{--volr-tw-font-weight:var(--volr-font-weight-bold);font-weight:var(--volr-font-weight-bold)}.volr\\:font-medium{--volr-tw-font-weight:var(--volr-font-weight-medium);font-weight:var(--volr-font-weight-medium)}.volr\\:font-semibold{--volr-tw-font-weight:var(--volr-font-weight-semibold);font-weight:var(--volr-font-weight-semibold)}.volr\\:tracking-tight{--volr-tw-tracking:var(--volr-tracking-tight);letter-spacing:var(--volr-tracking-tight)}.volr\\:tracking-wide{--volr-tw-tracking:var(--volr-tracking-wide);letter-spacing:var(--volr-tracking-wide)}.volr\\:tracking-wider{--volr-tw-tracking:var(--volr-tracking-wider);letter-spacing:var(--volr-tracking-wider)}.volr\\:break-all{word-break:break-all}.volr\\:text-amber-700{color:var(--volr-color-amber-700)}.volr\\:text-blue-700{color:var(--volr-color-blue-700)}.volr\\:text-emerald-600{color:var(--volr-color-emerald-600)}.volr\\:text-gray-500{color:var(--volr-color-gray-500)}.volr\\:text-green-600{color:var(--volr-color-green-600)}.volr\\:text-green-700{color:var(--volr-color-green-700)}.volr\\:text-red-500{color:var(--volr-color-red-500)}.volr\\:text-red-600{color:var(--volr-color-red-600)}.volr\\:text-red-700{color:var(--volr-color-red-700)}.volr\\:text-slate-300{color:var(--volr-color-slate-300)}.volr\\:text-slate-400{color:var(--volr-color-slate-400)}.volr\\:text-slate-500{color:var(--volr-color-slate-500)}.volr\\:text-slate-600{color:var(--volr-color-slate-600)}.volr\\:text-slate-700{color:var(--volr-color-slate-700)}.volr\\:text-slate-800{color:var(--volr-color-slate-800)}.volr\\:text-slate-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:text-yellow-700{color:var(--volr-color-yellow-700)}.volr\\:capitalize{text-transform:capitalize}.volr\\:uppercase{text-transform:uppercase}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-25{opacity:.25}.volr\\:opacity-30{opacity:.3}.volr\\:opacity-50{opacity:.5}.volr\\:opacity-70{opacity:.7}.volr\\:opacity-75{opacity:.75}.volr\\:opacity-80{opacity:.8}.volr\\:shadow-2xl{--volr-tw-shadow:0 25px 50px -12px var(--volr-tw-shadow-color,#00000040);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-lg{--volr-tw-shadow:0 10px 15px -3px var(--volr-tw-shadow-color,#0000001a),0 4px 6px -4px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-sm{--volr-tw-shadow:0 1px 3px 0 var(--volr-tw-shadow-color,#0000001a),0 1px 2px -1px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-xl{--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:var(--volr-color-emerald-500)}@supports (color:color-mix(in lab, red, red)){.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--volr-color-emerald-500)50%,transparent)var(--volr-tw-shadow-alpha),transparent)}}.volr\\:blur-2xl{--volr-tw-blur:blur(var(--volr-blur-2xl));filter:var(--volr-tw-blur,)var(--volr-tw-brightness,)var(--volr-tw-contrast,)var(--volr-tw-grayscale,)var(--volr-tw-hue-rotate,)var(--volr-tw-invert,)var(--volr-tw-saturate,)var(--volr-tw-sepia,)var(--volr-tw-drop-shadow,)}.volr\\:transition-all{transition-property:all;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--volr-tw-gradient-from,--volr-tw-gradient-via,--volr-tw-gradient-to;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:duration-200{--volr-tw-duration:.2s;transition-duration:.2s}.volr\\:duration-300{--volr-tw-duration:.3s;transition-duration:.3s}.volr\\:duration-500{--volr-tw-duration:.5s;transition-duration:.5s}.volr\\:ease-out{--volr-tw-ease:var(--volr-ease-out);transition-timing-function:var(--volr-ease-out)}.volr\\:outline-none{--volr-tw-outline-style:none;outline-style:none}@media (hover:hover){.volr\\:hover\\:border-slate-300:hover{border-color:var(--volr-color-slate-300)}.volr\\:hover\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}.volr\\:hover\\:bg-slate-200:hover{background-color:var(--volr-color-slate-200)}.volr\\:hover\\:text-slate-700:hover{color:var(--volr-color-slate-700)}}.volr\\:focus\\:ring-2:focus{--volr-tw-ring-shadow:var(--volr-tw-ring-inset,)0 0 0 calc(2px + var(--volr-tw-ring-offset-width))var(--volr-tw-ring-color,currentcolor);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:focus\\:ring-slate-300:focus{--volr-tw-ring-color:var(--volr-color-slate-300)}.volr\\:focus\\:outline-none:focus{--volr-tw-outline-style:none;outline-style:none}.volr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.volr\\:disabled\\:bg-slate-100:disabled{background-color:var(--volr-color-slate-100)}.volr\\:disabled\\:text-slate-400:disabled{color:var(--volr-color-slate-400)}.volr\\:disabled\\:opacity-50:disabled{opacity:.5}.volr-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.volr-text-secondary{color:var(--volr-text-secondary)}.volr-text-muted{color:var(--volr-text-muted)}.volr-bg-secondary{background-color:var(--volr-bg-secondary)}.volr-bg-tertiary{background-color:var(--volr-bg-tertiary)}.volr-border{border-color:var(--volr-border)}.volr-border-strong{border-color:var(--volr-border-strong)}.volr-divider-line{background-color:var(--volr-border)}.volr-error{background-color:var(--volr-error-bg);border-color:var(--volr-error-border);color:var(--volr-error-text)}.volr-hint{background-color:var(--volr-hint-bg);border:1px solid var(--volr-hint-border);color:var(--volr-hint-text)}.volr-hover:hover{background-color:var(--volr-hover-bg)}.volr-surface{background-color:var(--volr-bg)}}@property --volr-tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --volr-tw-gradient-position{syntax:"*";inherits:false}@property --volr-tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-via-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --volr-tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --volr-tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --volr-tw-leading{syntax:"*";inherits:false}@property --volr-tw-font-weight{syntax:"*";inherits:false}@property --volr-tw-tracking{syntax:"*";inherits:false}@property --volr-tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-shadow-color{syntax:"*";inherits:false}@property --volr-tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-shadow-color{syntax:"*";inherits:false}@property --volr-tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-ring-color{syntax:"*";inherits:false}@property --volr-tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-ring-color{syntax:"*";inherits:false}@property --volr-tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-ring-inset{syntax:"*";inherits:false}@property --volr-tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --volr-tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --volr-tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-blur{syntax:"*";inherits:false}@property --volr-tw-brightness{syntax:"*";inherits:false}@property --volr-tw-contrast{syntax:"*";inherits:false}@property --volr-tw-grayscale{syntax:"*";inherits:false}@property --volr-tw-hue-rotate{syntax:"*";inherits:false}@property --volr-tw-invert{syntax:"*";inherits:false}@property --volr-tw-opacity{syntax:"*";inherits:false}@property --volr-tw-saturate{syntax:"*";inherits:false}@property --volr-tw-sepia{syntax:"*";inherits:false}@property --volr-tw-drop-shadow{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-color{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-drop-shadow-size{syntax:"*";inherits:false}@property --volr-tw-duration{syntax:"*";inherits:false}@property --volr-tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}';
 function useResolvedTheme(theme = "light") {
-  const [resolvedTheme, setResolvedTheme] = React13.useState(() => {
+  const [resolvedTheme, setResolvedTheme] = React14.useState(() => {
     if (theme !== "system") return theme;
     if (typeof window === "undefined") return "light";
     return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
   });
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (theme !== "system") {
       setResolvedTheme(theme);
       return;
@@ -1162,10 +1218,10 @@ function useResolvedTheme(theme = "light") {
   return resolvedTheme;
 }
 function ShadowPortal({ children, theme = "light" }) {
-  const [mountNode, setMountNode] = React13.useState(null);
-  const hostRef = React13.useRef(null);
+  const [mountNode, setMountNode] = React14.useState(null);
+  const hostRef = React14.useRef(null);
   const resolvedTheme = useResolvedTheme(theme);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     const host = document.createElement("div");
     host.id = "volr-shadow-portal";
     host.style.position = "fixed";
@@ -1189,7 +1245,7 @@ function ShadowPortal({ children, theme = "light" }) {
       hostRef.current = null;
     };
   }, []);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (hostRef.current) {
       hostRef.current.setAttribute("data-theme", resolvedTheme);
     }
@@ -1198,7 +1254,7 @@ function ShadowPortal({ children, theme = "light" }) {
   return reactDom.createPortal(children, mountNode);
 }
 function useFocusTrap(isActive, containerRef) {
-  const previousActiveElement = React13.useRef(null);
+  const previousActiveElement = React14.useRef(null);
   const focusableSelector = [
     "button:not([disabled])",
     "input:not([disabled])",
@@ -1207,7 +1263,7 @@ function useFocusTrap(isActive, containerRef) {
     "a[href]",
     '[tabindex]:not([tabindex="-1"])'
   ].join(", ");
-  const getFocusableElements = React13.useCallback(() => {
+  const getFocusableElements = React14.useCallback(() => {
     if (!containerRef.current) return [];
     return Array.from(
       containerRef.current.querySelectorAll(focusableSelector)
@@ -1215,7 +1271,7 @@ function useFocusTrap(isActive, containerRef) {
       return el.offsetParent !== null;
     });
   }, [containerRef, focusableSelector]);
-  const handleKeyDown = React13.useCallback(
+  const handleKeyDown = React14.useCallback(
     (event) => {
       if (event.key !== "Tab") return;
       const focusableElements = getFocusableElements();
@@ -1236,7 +1292,7 @@ function useFocusTrap(isActive, containerRef) {
     },
     [getFocusableElements]
   );
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (!isActive) return;
     previousActiveElement.current = document.activeElement;
     const focusableElements = getFocusableElements();
@@ -1267,12 +1323,12 @@ var Modal = ({
 }) => {
   const isMobile2 = useMediaQuery("(max-width: 500px)");
   const variant = explicitVariant ?? (isMobile2 ? "bottom-sheet" : "centered");
-  const dialogRef = React13.useRef(null);
-  const dialogId = React13.useId();
+  const dialogRef = React14.useRef(null);
+  const dialogId = React14.useId();
   const uiContext = useVolrUIOptional();
   const theme = uiContext?.theme ?? "light";
   useFocusTrap(open, dialogRef);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     const handleEscape = (e) => {
       if (e.key === "Escape" && open) {
         if (onEscapeKeyDown) {
@@ -1855,7 +1911,7 @@ var variantMap = {
   ghost: { backgroundColor: "transparent", color: "var(--volr-text-secondary)", border: "none" },
   outline: { backgroundColor: "transparent", color: "var(--volr-text-secondary)", border: "1px solid var(--volr-border)" }
 };
-var Button = React13__default.default.forwardRef(
+var Button = React14__default.default.forwardRef(
   ({ variant = "primary", size = "md", fullWidth, className, style, disabled, children, ...props }, ref) => {
     const { accentColor } = useVolrUI();
     const sizeStyle = sizeMap[size];
@@ -1898,9 +1954,7 @@ function PasskeyEnrollForm({
   biometricMessage,
   errorMessage,
   onEnroll,
-  onLogout,
   buttonText,
-  logoutText,
   hintMessage,
   hintNote
 }) {
@@ -1918,10 +1972,45 @@ function PasskeyEnrollForm({
       /* @__PURE__ */ jsxRuntime.jsx(ErrorIcon, { className: "volr:shrink-0 volr:mt-0.5" }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { children: errorMessage })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", fullWidth: true, onClick: onEnroll, children: buttonText }),
-      /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", fullWidth: true, onClick: onLogout, children: logoutText })
-    ] })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:flex-col volr:gap-3", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", fullWidth: true, onClick: onEnroll, children: buttonText }) })
+  ] });
+}
+function ProgressSteps({
+  totalSteps,
+  currentStep,
+  activeColor = "#1e293b",
+  // slate-900
+  inactiveColor = "#e2e8f0",
+  // slate-200
+  activeWidth = 8,
+  inactiveWidth = 6,
+  gap = 8,
+  // 0.5rem = 8px
+  animate = true
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:items-center volr:justify-center", style: { gap: `${gap}px` }, children: Array.from({ length: totalSteps }).map((_, stepIdx) => {
+      const isActive = stepIdx <= currentStep;
+      const isCurrent = stepIdx === currentStep;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:h-1.5 volr:rounded-full volr:transition-all volr:duration-300",
+          style: {
+            width: `${isActive ? activeWidth : inactiveWidth}px`,
+            backgroundColor: isActive ? activeColor : inactiveColor,
+            ...isCurrent && animate ? { animation: "volrProgressPulse 1.5s ease-in-out infinite" } : void 0
+          }
+        },
+        stepIdx
+      );
+    }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
+        @keyframes volrProgressPulse {
+          0%, 100% { opacity: 1; }
+          50% { opacity: 0.6; }
+        }
+      ` })
   ] });
 }
 function PasskeyEnrollLoading({
@@ -1930,28 +2019,14 @@ function PasskeyEnrollLoading({
   isEnrolling,
   accentColor,
   onRetry,
-  onLogout,
   buttonText,
-  logoutText,
-  progress = 0
+  currentStepIndex = 0
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-8 volr:flex volr:justify-center volr:items-center volr:min-h-[120px]", children: /* @__PURE__ */ jsxRuntime.jsx(BiometricIcon, { type: biometricType, size: 60, animate: isEnrolling }) }),
     /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-base volr:mb-4 volr-text-secondary", children: stepMessage }),
-    isEnrolling && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-full volr:mb-6", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-full volr:h-2 volr:rounded-full volr:overflow-hidden volr-bg-tertiary", children: /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: "volr:h-full volr:rounded-full volr:transition-all volr:duration-500 volr:ease-out",
-        style: {
-          backgroundColor: accentColor,
-          width: `${progress}%`
-        }
-      }
-    ) }) }),
-    !isEnrolling && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-3 volr:mt-6", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", fullWidth: true, onClick: onRetry, children: buttonText }),
-      /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", fullWidth: true, onClick: onLogout, children: logoutText })
-    ] })
+    isEnrolling && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-6", children: /* @__PURE__ */ jsxRuntime.jsx(ProgressSteps, { totalSteps: 2, currentStep: currentStepIndex }) }),
+    !isEnrolling && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:flex-col volr:gap-3 volr:mt-6", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", fullWidth: true, onClick: onRetry, children: buttonText }) })
   ] });
 }
 function WarningIcon({ className }) {
@@ -1990,8 +2065,7 @@ function getActionButtonKey(action) {
   }
 }
 function PasskeyCompatibilityScreen({
-  compatibility,
-  onLogout
+  compatibility
 }) {
   const { t } = useI18n();
   const messageKey = compatibility.messageKey || "passkey.compatibility.unknownBrowser";
@@ -2024,10 +2098,7 @@ function PasskeyCompatibilityScreen({
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:font-medium", children: compatibility.platform })
       ] })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-3", children: [
-      compatibility.action && /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", fullWidth: true, onClick: handleAction, children: t(actionButtonKey) }),
-      /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", fullWidth: true, onClick: onLogout, children: t("passkey.logout") })
-    ] })
+    compatibility.action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:flex-col volr:gap-3", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", fullWidth: true, onClick: handleAction, children: t(actionButtonKey) }) })
   ] });
 }
 var AUTO_CLOSE_DELAY = 2e3;
@@ -2035,18 +2106,17 @@ function PasskeyMigrationView({
   sourcePasskey,
   currentDomain,
   onMigrate,
-  onSkip,
   onError,
   onComplete,
   isOpen = true,
   wrapInModal = true
 }) {
   const { t } = useI18n();
-  const [isMigrating, setIsMigrating] = React13.useState(false);
-  const [isComplete, setIsComplete] = React13.useState(false);
-  const [error, setError] = React13.useState(null);
+  const [isMigrating, setIsMigrating] = React14.useState(false);
+  const [isComplete, setIsComplete] = React14.useState(false);
+  const [error, setError] = React14.useState(null);
   const biometricType = getBiometricType();
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     const handler = (event) => {
       if (event.data?.type === "VOLR_MIGRATION_DONE") {
@@ -2057,18 +2127,16 @@ function PasskeyMigrationView({
     window.addEventListener("message", handler);
     return () => window.removeEventListener("message", handler);
   }, []);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (isComplete) {
       const timer = setTimeout(() => {
         if (onComplete) {
           onComplete();
-        } else if (onSkip) {
-          onSkip();
         }
       }, AUTO_CLOSE_DELAY);
       return () => clearTimeout(timer);
     }
-  }, [isComplete, onComplete, onSkip]);
+  }, [isComplete, onComplete]);
   const handleMigrate = async () => {
     try {
       setIsMigrating(true);
@@ -2083,13 +2151,11 @@ function PasskeyMigrationView({
       }
     }
   };
-  const handleDone = React13.useCallback(() => {
+  const handleDone = React14.useCallback(() => {
     if (onComplete) {
       onComplete();
-    } else if (onSkip) {
-      onSkip();
     }
-  }, [onComplete, onSkip]);
+  }, [onComplete]);
   const successContent = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-4", children: [
     /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-6 volr:text-center", children: t("passkey.migration.successTitle") }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-8 volr:flex volr:justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-16 volr:h-16 volr:rounded-full volr:bg-slate-900 volr:flex volr:items-center volr:justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -2148,44 +2214,31 @@ function PasskeyMigrationView({
       /* @__PURE__ */ jsxRuntime.jsx("span", { children: t("passkey.migration.benefits") })
     ] }) }),
     error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-4 volr:p-3 volr:rounded-lg volr:border volr:text-sm volr:text-left volr-error", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: error }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        Button,
-        {
-          variant: "primary",
-          fullWidth: true,
-          onClick: handleMigrate,
-          disabled: isMigrating,
-          children: t("passkey.migration.cta")
-        }
-      ),
-      onSkip && /* @__PURE__ */ jsxRuntime.jsx(
-        Button,
-        {
-          variant: "ghost",
-          fullWidth: true,
-          onClick: onSkip,
-          disabled: isMigrating,
-          children: t("passkey.migration.later")
-        }
-      )
-    ] })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:flex-col volr:gap-3", children: /* @__PURE__ */ jsxRuntime.jsx(
+      Button,
+      {
+        variant: "primary",
+        fullWidth: true,
+        onClick: handleMigrate,
+        disabled: isMigrating,
+        children: t("passkey.migration.cta")
+      }
+    ) })
   ] });
   const content = isComplete ? successContent : isMigrating ? migratingContent : defaultContent;
   if (!wrapInModal) {
     return content;
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: (open) => !open && !isMigrating && onSkip?.(), children: content });
+  return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: (open) => !open && !isMigrating && onComplete?.(), children: content });
 }
 function PasskeyEnrollView({
   onComplete,
   onError,
-  onLogout,
   onClose,
   isOpen = true,
   wrapInModal = true
 }) {
-  const { user, logout, setUser } = react.useVolrContext();
+  const { user, setUser } = react.useVolrContext();
   const { client } = react.useInternalAuth();
   const { t } = useI18n();
   const { accentColor } = useVolrUI();
@@ -2195,21 +2248,22 @@ function PasskeyEnrollView({
     isEnrolling,
     error: enrollmentError
   } = react.usePasskeyEnrollment();
-  const [hasStarted, setHasStarted] = React13.useState(false);
-  const [errorMessage, setErrorMessage] = React13.useState(null);
-  const [isRefreshing, setIsRefreshing] = React13.useState(false);
+  const [hasStarted, setHasStarted] = React14.useState(false);
+  const [errorMessage, setErrorMessage] = React14.useState(null);
+  const [isRefreshing, setIsRefreshing] = React14.useState(false);
   const biometricType = getBiometricType();
-  const compatibility = React13.useMemo(() => react.checkPrfCompatibility(), []);
-  const platformHint = React13.useMemo(
-    () => react.getPlatformHint(compatibility.platform),
-    [compatibility.platform]
+  const compatibility = React14.useMemo(() => react.checkPrfCompatibility(), []);
+  const [hasPrfError, setHasPrfError] = React14.useState(false);
+  const platformHint = React14.useMemo(
+    () => hasPrfError ? react.getPlatformHint(compatibility.platform) : { hintKey: "", noteKey: "" },
+    [compatibility.platform, hasPrfError]
   );
   const hasPasskey = user?.keyStorageType === "passkey";
-  const currentDomain = React13.useMemo(() => {
+  const currentDomain = React14.useMemo(() => {
     if (typeof window === "undefined") return "localhost";
     return window.location.hostname;
   }, []);
-  const migrationInfo = React13.useMemo(() => {
+  const migrationInfo = React14.useMemo(() => {
     if (!user?.registeredPasskeys || user.registeredPasskeys.length === 0) {
       return { needsMigration: false, sourcePasskey: null };
     }
@@ -2222,7 +2276,7 @@ function PasskeyEnrollView({
     const sourcePasskey = user.registeredPasskeys[0];
     return { needsMigration: true, sourcePasskey };
   }, [user?.registeredPasskeys, currentDomain]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     console.log("[PasskeyEnrollView] User state:", {
       user,
       keyStorageType: user?.keyStorageType,
@@ -2233,7 +2287,7 @@ function PasskeyEnrollView({
       migrationInfo
     });
   }, [user, hasPasskey, currentDomain, migrationInfo]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (hasPasskey && !user?.evmAddress && !isRefreshing) {
       const refreshUserData = async () => {
         try {
@@ -2264,7 +2318,7 @@ function PasskeyEnrollView({
       refreshUserData();
     }
   }, [hasPasskey, user?.evmAddress, isRefreshing, client, setUser, user]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (!user?.id) {
       const error = new Error("User ID is required for passkey enrollment");
       setErrorMessage(getUserFriendlyError(error, t));
@@ -2273,13 +2327,18 @@ function PasskeyEnrollView({
       }
     }
   }, [user, onError, t]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (enrollmentError) {
       const friendlyMessage = getUserFriendlyError(enrollmentError, t);
       setErrorMessage(friendlyMessage);
+      const errorMsg = enrollmentError.message.toLowerCase();
+      const isPrfError = errorMsg.includes("prf extension not supported") || errorMsg.includes("prf output missing") || errorMsg.includes("prf not supported");
+      setHasPrfError(isPrfError);
       if (onError) {
         onError(enrollmentError);
       }
+    } else {
+      setHasPrfError(false);
     }
   }, [enrollmentError, onError, t]);
   const handleEnroll = async () => {
@@ -2288,6 +2347,7 @@ function PasskeyEnrollView({
         "User ID is required for passkey enrollment"
       );
       setErrorMessage(getUserFriendlyError(error, t));
+      setHasPrfError(false);
       if (onError) {
         onError(error);
       }
@@ -2295,25 +2355,15 @@ function PasskeyEnrollView({
     }
     try {
       setErrorMessage(null);
+      setHasPrfError(false);
       await enroll();
       setHasStarted(false);
+      setHasPrfError(false);
       onComplete();
     } catch (error) {
       setHasStarted(false);
     }
   };
-  const handleLogout = async () => {
-    try {
-      await logout();
-      if (onLogout) {
-        onLogout();
-      }
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error : new Error("Logout failed"));
-      }
-    }
-  };
   const getStepMessage = () => {
     switch (step) {
       case "creating":
@@ -2328,16 +2378,16 @@ function PasskeyEnrollView({
         return "";
     }
   };
-  const getProgress = () => {
+  const getCurrentStepIndex = () => {
     switch (step) {
       case "creating":
-        return 25;
+        return 0;
+      // Step 1: Creating passkey
       case "encrypting":
-        return 50;
       case "uploading":
-        return 75;
       case "registering":
-        return 90;
+        return 1;
+      // Step 2: Encrypting/Uploading/Registering
       default:
         return 0;
     }
@@ -2361,14 +2411,13 @@ function PasskeyEnrollView({
     const compatibilityContent = /* @__PURE__ */ jsxRuntime.jsx(
       PasskeyCompatibilityScreen,
       {
-        compatibility,
-        onLogout: handleLogout
+        compatibility
       }
     );
     if (!wrapInModal) {
       return compatibilityContent;
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: (open) => !open && onLogout?.(), children: compatibilityContent });
+    return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: (open) => !open && onClose?.(), children: compatibilityContent });
   }
   if (migrationInfo.needsMigration && migrationInfo.sourcePasskey) {
     const handleMigration = async () => {
@@ -2385,8 +2434,8 @@ function PasskeyEnrollView({
         sourcePasskey: migrationInfo.sourcePasskey,
         currentDomain,
         onMigrate: handleMigration,
-        onSkip: handleLogout,
         onError,
+        onComplete,
         isOpen,
         wrapInModal
       }
@@ -2432,11 +2481,9 @@ function PasskeyEnrollView({
           setHasStarted(true);
           handleEnroll();
         },
-        onLogout: handleLogout,
         buttonText: t("passkey.start"),
-        hintMessage: t(platformHint.hintKey),
-        hintNote: t(platformHint.noteKey),
-        logoutText: t("passkey.logout")
+        hintMessage: hasPrfError && platformHint.hintKey ? t(platformHint.hintKey) : void 0,
+        hintNote: hasPrfError && platformHint.noteKey ? t(platformHint.noteKey) : void 0
       }
     ) : /* @__PURE__ */ jsxRuntime.jsx(
       PasskeyEnrollLoading,
@@ -2445,18 +2492,16 @@ function PasskeyEnrollView({
         stepMessage: getStepMessage(),
         isEnrolling,
         accentColor,
-        progress: getProgress(),
+        currentStepIndex: getCurrentStepIndex(),
         onRetry: handleEnroll,
-        onLogout: handleLogout,
-        buttonText: t("passkey.start"),
-        logoutText: t("passkey.logout")
+        buttonText: t("passkey.start")
       }
     )
   ] });
   if (!wrapInModal) {
     return content;
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: (open) => !open && onLogout?.(), children: content });
+  return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: (open) => !open && onClose?.(), children: content });
 }
 var STEP_PROGRESS = {
   ready: 0,
@@ -2561,7 +2606,7 @@ function MigrationTargetView({
   const biometricType = getBiometricType();
   const isProcessing = step !== "ready" && step !== "error" && step !== "success";
   const progress = STEP_PROGRESS2[step];
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (step === "success" && onAutoClose) {
       const timer = setTimeout(() => {
         onAutoClose();
@@ -2641,8 +2686,8 @@ function MpcConnectView({
     isConnecting,
     error: connectionError
   } = react.useMpcConnection();
-  const [errorMessage, setErrorMessage] = React13.useState(null);
-  React13.useEffect(() => {
+  const [errorMessage, setErrorMessage] = React14.useState(null);
+  React14.useEffect(() => {
     if (connectionError) {
       setErrorMessage(connectionError.message);
       if (onError) {
@@ -2650,7 +2695,7 @@ function MpcConnectView({
       }
     }
   }, [connectionError, onError]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     handleConnect();
   }, []);
   const handleConnect = async () => {
@@ -2881,9 +2926,9 @@ function PoweredBy() {
 }
 function EmailInlineInput({ onSubmit, accentColor }) {
   const { t } = useI18n();
-  const [email, setEmail] = React13.useState("");
-  const [error, setError] = React13.useState(null);
-  const [isLoading, setIsLoading] = React13.useState(false);
+  const [email, setEmail] = React14.useState("");
+  const [error, setError] = React14.useState(null);
+  const [isLoading, setIsLoading] = React14.useState(false);
   const handleSubmit = async (e) => {
     e.preventDefault();
     setError(null);
@@ -3007,14 +3052,14 @@ function SigninSelectScreen({
 function CodeInputScreen({ email, onSubmit, onResend }) {
   const { t } = useI18n();
   const { accentColor } = useVolrUI();
-  const [digits, setDigits] = React13.useState(Array(6).fill(""));
-  const [error, setError] = React13.useState(null);
-  const [isLoading, setIsLoading] = React13.useState(false);
-  const inputRefs = React13.useRef([]);
-  React13.useEffect(() => {
+  const [digits, setDigits] = React14.useState(Array(6).fill(""));
+  const [error, setError] = React14.useState(null);
+  const [isLoading, setIsLoading] = React14.useState(false);
+  const inputRefs = React14.useRef([]);
+  React14.useEffect(() => {
     inputRefs.current[0]?.focus();
   }, []);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     const code = digits.join("");
     if (code.length === 6 && !isLoading) {
       handleSubmit(code);
@@ -3126,7 +3171,7 @@ function CodeInputScreen({ email, onSubmit, onResend }) {
   ] });
 }
 var CopyButton = ({ text, className, onCopy }) => {
-  const [copied, setCopied] = React13.useState(false);
+  const [copied, setCopied] = React14.useState(false);
   const handleCopy = async () => {
     try {
       await navigator.clipboard.writeText(text);
@@ -3205,23 +3250,23 @@ function SiweLoginScreen({
     checkSiweSession,
     getSiweSignUrl
   } = react.useVolrLogin();
-  const [isLoading, setIsLoading] = React13.useState(false);
-  const [loadingWallet, setLoadingWallet] = React13.useState(null);
-  const [error, setError] = React13.useState(null);
-  const [providers, setProviders] = React13.useState([]);
-  const [isDetecting, setIsDetecting] = React13.useState(true);
-  const [hasLegacyWallet, setHasLegacyWallet] = React13.useState(false);
-  const [showOtherWallet, setShowOtherWallet] = React13.useState(false);
-  const [sessionUrl, setSessionUrl] = React13.useState(null);
-  const [isPolling, setIsPolling] = React13.useState(false);
-  const pollingRef = React13.useRef(null);
-  const sessionCreatedRef = React13.useRef(false);
-  React13.useEffect(() => {
+  const [isLoading, setIsLoading] = React14.useState(false);
+  const [loadingWallet, setLoadingWallet] = React14.useState(null);
+  const [error, setError] = React14.useState(null);
+  const [providers, setProviders] = React14.useState([]);
+  const [isDetecting, setIsDetecting] = React14.useState(true);
+  const [hasLegacyWallet, setHasLegacyWallet] = React14.useState(false);
+  const [showOtherWallet, setShowOtherWallet] = React14.useState(false);
+  const [sessionUrl, setSessionUrl] = React14.useState(null);
+  const [isPolling, setIsPolling] = React14.useState(false);
+  const pollingRef = React14.useRef(null);
+  const sessionCreatedRef = React14.useRef(false);
+  React14.useEffect(() => {
     return () => {
       if (pollingRef.current) clearInterval(pollingRef.current);
     };
   }, []);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (typeof window === "undefined") {
       setIsDetecting(false);
       return;
@@ -3247,7 +3292,7 @@ function SiweLoginScreen({
     };
   }, []);
   const hasAnyWallet = providers.length > 0 || hasLegacyWallet;
-  const createSession = React13.useCallback(async () => {
+  const createSession = React14.useCallback(async () => {
     if (sessionCreatedRef.current || sessionUrl) return;
     sessionCreatedRef.current = true;
     try {
@@ -3289,17 +3334,17 @@ function SiweLoginScreen({
       onError(err instanceof Error ? err : new Error("Failed to create session"));
     }
   }, [createSiweSession, getSiweSignUrl, checkSiweSession, onSuccess, onError, t, sessionUrl]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (!isDetecting && !hasAnyWallet && !sessionUrl) {
       createSession();
     }
   }, [isDetecting, hasAnyWallet, sessionUrl, createSession]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (showOtherWallet && !sessionUrl) {
       createSession();
     }
   }, [showOtherWallet, sessionUrl, createSession]);
-  const handleWalletClick = React13.useCallback(async (provider, walletName, walletConnector) => {
+  const handleWalletClick = React14.useCallback(async (provider, walletName, walletConnector) => {
     setError(null);
     setIsLoading(true);
     setLoadingWallet(walletName);
@@ -3323,7 +3368,7 @@ function SiweLoginScreen({
       setLoadingWallet(null);
     }
   }, [signWithWallet, onSuccess, onError]);
-  const handleLegacyWalletClick = React13.useCallback(async () => {
+  const handleLegacyWalletClick = React14.useCallback(async () => {
     if (typeof window === "undefined" || !window.ethereum) return;
     const ethereum = window.ethereum;
     let walletName = "Wallet";
@@ -3332,7 +3377,7 @@ function SiweLoginScreen({
     else if (ethereum.isRabby) walletName = "Rabby";
     await handleWalletClick(ethereum, walletName);
   }, [handleWalletClick]);
-  const cancelOtherWallet = React13.useCallback(() => {
+  const cancelOtherWallet = React14.useCallback(() => {
     if (pollingRef.current) {
       clearInterval(pollingRef.current);
       pollingRef.current = null;
@@ -3479,13 +3524,13 @@ function SigninModal({ isOpen, onClose, onError }) {
   const { client } = react.useInternalAuth();
   const { appName, branding } = useVolrUI();
   const { requestEmailCode, verifyEmailCode, handleSocialLogin } = react.useVolrLogin();
-  const [currentScreen, setCurrentScreen] = React13.useState("method-select");
-  const [email, setEmail] = React13.useState("");
+  const [currentScreen, setCurrentScreen] = React14.useState("method-select");
+  const [email, setEmail] = React14.useState("");
   const hasPasskey = user?.keyStorageType === "passkey";
   const isMobile2 = useMediaQuery("(max-width: 500px)");
   const isWideViewport = useMediaQuery("(min-width: 864px)");
   const shouldUseWideLayout = !isMobile2 && isWideViewport && Boolean(branding) && currentScreen === "method-select";
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (!isOpen) {
       setCurrentScreen("method-select");
       setEmail("");
@@ -3527,7 +3572,7 @@ function SigninModal({ isOpen, onClose, onError }) {
       onClose();
       return;
     }
-    setCurrentScreen("passkey-setup");
+    onClose();
   };
   const handleSiweSuccess = async (data) => {
     if (data.keyStorageType) {
@@ -3549,7 +3594,7 @@ function SigninModal({ isOpen, onClose, onError }) {
       onClose();
       return;
     }
-    setCurrentScreen("passkey-setup");
+    onClose();
   };
   const handlePasskeyComplete = () => {
     onClose();
@@ -3559,18 +3604,6 @@ function SigninModal({ isOpen, onClose, onError }) {
       onError(error);
     }
   };
-  const handleLogout = async () => {
-    try {
-      await logout();
-      setCurrentScreen("method-select");
-      setEmail("");
-      onClose();
-    } catch (error) {
-      if (onError) {
-        onError(error instanceof Error ? error : new Error("Logout failed"));
-      }
-    }
-  };
   const handleBackdropClick = (_e) => {
     if (currentScreen !== "passkey-setup" || hasPasskey) {
       setCurrentScreen("method-select");
@@ -3634,7 +3667,6 @@ function SigninModal({ isOpen, onClose, onError }) {
             wrapInModal: false,
             onComplete: handlePasskeyComplete,
             onError: handlePasskeyError,
-            onLogout: handleLogout,
             onClose
           },
           "passkey-setup"
@@ -3723,7 +3755,7 @@ function AssetSelectView({
     }) })
   ] });
 }
-var TextLinkButton = React13__default.default.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
+var TextLinkButton = React14__default.default.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     {
@@ -3852,23 +3884,23 @@ function WalletTransferView({
   const { config } = react.useVolrContext();
   const { client } = react.useInternalAuth();
   const { isDetecting, getWalletsForDisplay, hasWallet } = react.useEIP6963();
-  const [viewState, setViewState] = React13.useState("select-wallet");
-  const [selectedWallet, setSelectedWallet] = React13.useState(null);
-  const [connectedAddress, setConnectedAddress] = React13.useState(null);
-  const [balance, setBalance] = React13.useState(null);
-  const [amount, setAmount] = React13.useState("");
-  const [isConnecting, setIsConnecting] = React13.useState(false);
-  const [isTransferring, setIsTransferring] = React13.useState(false);
-  const [error, setError] = React13.useState(null);
-  const [chainName, setChainName] = React13.useState(null);
-  const [currentChainId, setCurrentChainId] = React13.useState(null);
+  const [viewState, setViewState] = React14.useState("select-wallet");
+  const [selectedWallet, setSelectedWallet] = React14.useState(null);
+  const [connectedAddress, setConnectedAddress] = React14.useState(null);
+  const [balance, setBalance] = React14.useState(null);
+  const [amount, setAmount] = React14.useState("");
+  const [isConnecting, setIsConnecting] = React14.useState(false);
+  const [isTransferring, setIsTransferring] = React14.useState(false);
+  const [error, setError] = React14.useState(null);
+  const [chainName, setChainName] = React14.useState(null);
+  const [currentChainId, setCurrentChainId] = React14.useState(null);
   const tokenSymbol = asset === "native" ? "ETH" : asset.symbol;
   const decimals = asset === "native" ? 18 : asset.decimals;
-  const getNetworkInfo = React13.useCallback(
+  const getNetworkInfo = React14.useCallback(
     react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
     [client, config.rpcOverrides]
   );
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     let cancelled = false;
     const loadChainName = async () => {
       try {
@@ -3883,7 +3915,7 @@ function WalletTransferView({
       cancelled = true;
     };
   }, [getNetworkInfo, chainId]);
-  const connectWallet = React13.useCallback(async (wallet) => {
+  const connectWallet = React14.useCallback(async (wallet) => {
     setIsConnecting(true);
     setError(null);
     try {
@@ -3907,7 +3939,7 @@ function WalletTransferView({
       setIsConnecting(false);
     }
   }, [chainId, asset]);
-  const fetchBalance = React13.useCallback(async (provider, address, currentChain) => {
+  const fetchBalance = React14.useCallback(async (provider, address, currentChain) => {
     try {
       if (currentChain !== chainId) {
         setBalance(null);
@@ -3932,7 +3964,7 @@ function WalletTransferView({
       setBalance(BigInt(0));
     }
   }, [chainId, asset]);
-  const switchNetwork = React13.useCallback(async () => {
+  const switchNetwork = React14.useCallback(async () => {
     if (!selectedWallet?.provider) return;
     try {
       await selectedWallet.provider.request({
@@ -3950,7 +3982,7 @@ function WalletTransferView({
       setError(err instanceof Error ? err.message : "Failed to switch network");
     }
   }, [selectedWallet, chainId, connectedAddress, fetchBalance]);
-  const executeTransfer = React13.useCallback(async () => {
+  const executeTransfer = React14.useCallback(async () => {
     if (!selectedWallet?.provider || !connectedAddress || !amount) return;
     setIsTransferring(true);
     setError(null);
@@ -3993,7 +4025,7 @@ function WalletTransferView({
       setIsTransferring(false);
     }
   }, [selectedWallet, connectedAddress, amount, decimals, balance, asset, destinationAddress, onSuccess, t]);
-  const setMaxAmount = React13.useCallback(() => {
+  const setMaxAmount = React14.useCallback(() => {
     if (balance !== null) {
       const formatted = formatUnits(balance, decimals);
       setAmount(formatted);
@@ -4359,7 +4391,7 @@ var DepositCompletedToast = ({
   symbol
 }) => {
   const { t } = useI18n();
-  const [expanded, setExpanded] = React13.useState(false);
+  const [expanded, setExpanded] = React14.useState(false);
   const formatAmount = (amount) => {
     const divisor = BigInt(10 ** decimals);
     const whole = amount / divisor;
@@ -4519,11 +4551,11 @@ function DepositQRView(props) {
   const { t } = useI18n();
   const { config } = react.useVolrContext();
   const { client } = react.useInternalAuth();
-  const [chainName, setChainName] = React13.useState(null);
-  const [showOtherTokenModal, setShowOtherTokenModal] = React13.useState(false);
-  const [showToast, setShowToast] = React13.useState(false);
-  const [toastData, setToastData] = React13.useState(null);
-  const [viewMode, setViewMode] = React13.useState("qr");
+  const [chainName, setChainName] = React14.useState(null);
+  const [showOtherTokenModal, setShowOtherTokenModal] = React14.useState(false);
+  const [showToast, setShowToast] = React14.useState(false);
+  const [toastData, setToastData] = React14.useState(null);
+  const [viewMode, setViewMode] = React14.useState("qr");
   const eip681 = `ethereum:${props.address}`;
   const status = react.useDepositListener({
     chainId: props.chainId,
@@ -4536,7 +4568,7 @@ function DepositQRView(props) {
     },
     address: props.address
   });
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (status.state === "detected") {
       setToastData({
         previousBalance: status.previousBalance,
@@ -4546,11 +4578,11 @@ function DepositQRView(props) {
       setShowToast(true);
     }
   }, [status]);
-  const getNetworkInfo = React13.useCallback(
+  const getNetworkInfo = React14.useCallback(
     react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
     [client, config.rpcOverrides]
   );
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     let cancelled = false;
     const loadChainName = async () => {
       try {
@@ -4787,63 +4819,53 @@ function DepositModalBody({
     }
   );
 }
-function ChevronRightIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "svg",
+function DepositIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "volr:w-5 volr:h-5 volr:text-slate-800", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
     {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 20 20",
-      fill: "currentColor",
-      className,
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        "path",
-        {
-          fillRule: "evenodd",
-          d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z",
-          clipRule: "evenodd"
-        }
-      )
+      d: "M12 4V20M12 20L6 14M12 20L18 14",
+      stroke: "currentColor",
+      strokeWidth: "2.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
     }
-  );
-}
-function WalletIcon2({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M21 12a2.25 2.25 0 00-2.25-2.25H15a3 3 0 11-6 0H5.25A2.25 2.25 0 003 12m18 0v6a2.25 2.25 0 01-2.25 2.25H5.25A2.25 2.25 0 013 18v-6m18 0V9M3 12V9m18 0a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 9m18 0V6a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 6v3" }) });
-}
-function ArrowDownIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19.5 13.5L12 21m0 0l-7.5-7.5M12 21V3" }) });
+  ) });
 }
-function ArrowUpIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M4.5 10.5L12 3m0 0l7.5 7.5M12 3v18" }) });
+function WithdrawIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "volr:w-5 volr:h-5 volr:text-slate-800", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      d: "M12 20V4M12 4L6 10M12 4L18 10",
+      stroke: "currentColor",
+      strokeWidth: "2.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) });
 }
-function ClockIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z" }) });
+function WalletIcon2({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M21 12a2.25 2.25 0 00-2.25-2.25H15a3 3 0 11-6 0H5.25A2.25 2.25 0 003 12m18 0v6a2.25 2.25 0 01-2.25 2.25H5.25A2.25 2.25 0 013 18v-6m18 0V9M3 12V9m18 0a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 9m18 0V6a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 6v3" }) });
 }
 function UserIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" }) });
 }
-function MenuItem({ icon, label, description, onClick, isFirst, isLast }) {
+function QuickAction({ icon, label, onClick }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     {
       type: "button",
       onClick,
-      className: `volr:w-full volr:flex volr:items-center volr:gap-3 volr:py-2.5 volr:px-3 volr:bg-white hover:volr:bg-slate-50 volr:transition-colors volr:text-left volr:border-x volr:border-slate-200 ${isFirst ? "volr:border-t volr:rounded-t-xl" : ""} ${isLast ? "volr:border-b volr:rounded-b-xl" : "volr:border-b"}`,
+      className: "volr:flex volr:flex-col volr:items-center volr:gap-3 volr:flex-1 volr:rounded-xl volr:border volr:border-slate-200 volr:bg-white volr:px-3 volr:py-4 volr:text-center hover:volr:border-slate-300 hover:volr:bg-slate-50 hover:volr:shadow-sm active:volr:bg-slate-100 active:volr:scale-[0.98] volr:transition-all volr:duration-200",
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:shrink-0", children: icon }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: label }),
-          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400", children: description })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-300" })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-12 volr:h-12 volr:rounded-full volr:bg-slate-100 volr:border volr:border-slate-200 volr:flex volr:items-center volr:justify-center volr:shadow-sm", children: icon }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-900", children: label })
       ]
     }
   );
 }
 function AccountMainView({
   totalUsd,
-  balances,
   isLoading,
-  paymentEnabled,
   onNavigate,
   onLogout,
   isLoggingOut
@@ -4855,67 +4877,63 @@ function AccountMainView({
     minimumFractionDigits: 2,
     maximumFractionDigits: 2
   });
-  const tokensWithBalance = balances.filter((b) => b.balanceRaw > 0n).length;
-  const assetsDescription = isLoading ? void 0 : tokensWithBalance > 0 ? `${tokensWithBalance} ${tokensWithBalance === 1 ? "token" : "tokens"}` : void 0;
-  const menuItems = [
-    {
-      key: "assets",
-      icon: /* @__PURE__ */ jsxRuntime.jsx(WalletIcon2, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
-      label: t("account.menu.assets"),
-      description: assetsDescription,
-      view: "assets"
-    },
-    {
-      key: "deposit",
-      icon: /* @__PURE__ */ jsxRuntime.jsx(ArrowDownIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
-      label: t("account.menu.deposit"),
-      view: "deposit"
-    },
-    {
-      key: "withdraw",
-      icon: /* @__PURE__ */ jsxRuntime.jsx(ArrowUpIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
-      label: t("account.menu.withdraw"),
-      view: "withdraw"
-    },
-    ...paymentEnabled ? [
-      {
-        key: "payments",
-        icon: /* @__PURE__ */ jsxRuntime.jsx(ClockIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
-        label: t("account.menu.payments"),
-        view: "payments"
-      }
-    ] : [],
-    {
-      key: "account",
-      icon: /* @__PURE__ */ jsxRuntime.jsx(UserIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
-      label: t("account.menu.account"),
-      view: "account"
-    }
-  ];
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:rounded-xl volr:bg-gradient-to-br volr:from-slate-50 volr:to-slate-100 volr:p-4 volr:mb-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-500 volr:mb-0.5", children: t("account.totalBalance") }),
-      isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-8 volr:w-32 volr:bg-slate-200 volr:rounded" }) }) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-2xl volr:font-semibold volr:text-slate-900", children: formattedUsd })
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:px-5 volr:pt-5 volr:pb-6 volr:flex volr:flex-col", style: { gap: "1.5rem" }, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:rounded-2xl volr:border volr:border-slate-200 volr:bg-white volr:py-7 volr:shadow-sm", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:font-medium volr:uppercase volr:tracking-wider volr:text-slate-500 volr:mb-3 volr:text-center", children: t("account.totalBalance") }),
+      isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse volr:text-center volr:w-full", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-16 volr:w-48 volr:bg-slate-200 volr:rounded-lg" }) }) : /* @__PURE__ */ jsxRuntime.jsx(
+        "p",
+        {
+          className: "volr:leading-none volr:font-semibold volr:text-slate-900 volr:tracking-tight volr:text-center",
+          style: {
+            fontSize: "3rem",
+            lineHeight: "1",
+            fontWeight: 600
+          },
+          children: formattedUsd
+        }
+      )
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { children: menuItems.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
-      MenuItem,
-      {
-        icon: item.icon,
-        label: item.label,
-        description: item.description,
-        onClick: () => onNavigate(item.view),
-        isFirst: index === 0,
-        isLast: index === menuItems.length - 1
-      },
-      item.key
-    )) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-4 volr:pt-3", children: /* @__PURE__ */ jsxRuntime.jsx(
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        QuickAction,
+        {
+          icon: /* @__PURE__ */ jsxRuntime.jsx(DepositIcon, {}),
+          label: t("account.menu.deposit"),
+          onClick: () => onNavigate("deposit")
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        QuickAction,
+        {
+          icon: /* @__PURE__ */ jsxRuntime.jsx(WithdrawIcon, {}),
+          label: t("account.menu.withdraw"),
+          onClick: () => onNavigate("withdraw")
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        QuickAction,
+        {
+          icon: /* @__PURE__ */ jsxRuntime.jsx(WalletIcon2, { className: "volr:w-5 volr:h-5 volr:text-slate-800" }),
+          label: t("account.menu.assets"),
+          onClick: () => onNavigate("assets")
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        QuickAction,
+        {
+          icon: /* @__PURE__ */ jsxRuntime.jsx(UserIcon, { className: "volr:w-5 volr:h-5 volr:text-slate-800" }),
+          label: t("account.menu.account"),
+          onClick: () => onNavigate("account")
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:pt-1", children: /* @__PURE__ */ jsxRuntime.jsx(
       "button",
       {
         type: "button",
         onClick: onLogout,
         disabled: isLoggingOut,
-        className: "volr:w-full volr:py-2 volr:text-sm volr:text-slate-400 volr:text-center hover:volr:text-slate-600 volr:transition-colors disabled:volr:opacity-50",
+        className: "volr:w-full volr:rounded-lg volr:py-3 volr:text-sm volr:font-medium volr:text-slate-500 volr:text-center hover:volr:bg-slate-50 hover:volr:text-slate-700 volr:transition-colors volr:duration-200 disabled:volr:opacity-50",
         children: isLoggingOut ? t("common.loading") : t("account.logout")
       }
     ) })
@@ -4972,7 +4990,7 @@ function BalanceDetailView({
     /* @__PURE__ */ jsxRuntime.jsx("div", { children: balances.map((token) => /* @__PURE__ */ jsxRuntime.jsx(TokenRow, { token }, token.id)) })
   ] });
 }
-var Input = React13__default.default.forwardRef(
+var Input = React14__default.default.forwardRef(
   ({ leftIcon, error, className, style, disabled, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
       leftIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:absolute volr:left-3 volr:top-1/2 volr:-translate-y-1/2 volr:pointer-events-none volr-text-muted", children: leftIcon }),
@@ -5003,16 +5021,16 @@ function WithdrawView({
 }) {
   const { t } = useI18n();
   const { withdraw, isWithdrawing, result, error, reset } = react.useWithdraw();
-  const [step, setStep] = React13.useState("select");
-  const [selectedTokenId, setSelectedTokenId] = React13.useState(null);
-  const [toAddress, setToAddress] = React13.useState("");
-  const [amount, setAmount] = React13.useState("");
-  const [useConnectedWallet, setUseConnectedWallet] = React13.useState(false);
-  const selectedToken = React13.useMemo(
+  const [step, setStep] = React14.useState("select");
+  const [selectedTokenId, setSelectedTokenId] = React14.useState(null);
+  const [toAddress, setToAddress] = React14.useState("");
+  const [amount, setAmount] = React14.useState("");
+  const [useConnectedWallet, setUseConnectedWallet] = React14.useState(false);
+  const selectedToken = React14.useMemo(
     () => balances.find((b) => b.id === selectedTokenId),
     [balances, selectedTokenId]
   );
-  const connectedAddress = React13.useMemo(() => {
+  const connectedAddress = React14.useMemo(() => {
     if (!connectedWallet) return null;
     const parts = connectedWallet.split(":");
     return parts.length >= 2 ? parts[1] : null;
@@ -5051,7 +5069,7 @@ function WithdrawView({
     setAmount("");
     setUseConnectedWallet(false);
   };
-  const isAmountValid = React13.useMemo(() => {
+  const isAmountValid = React14.useMemo(() => {
     if (!amount || !selectedToken) return false;
     const num = parseFloat(amount);
     if (isNaN(num) || num <= 0) return false;
@@ -5231,6 +5249,25 @@ function WithdrawView({
   }
   return null;
 }
+function ChevronRightIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 20 20",
+      fill: "currentColor",
+      className,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "path",
+        {
+          fillRule: "evenodd",
+          d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z",
+          clipRule: "evenodd"
+        }
+      )
+    }
+  );
+}
 function PaymentRow({ payment, onClick }) {
   const { t } = useI18n();
   const date = new Date(payment.createdAt);
@@ -5288,10 +5325,10 @@ function PaymentRow({ payment, onClick }) {
 function PaymentHistoryView({ onSelectPayment }) {
   const { t } = useI18n();
   const { getPaymentHistory, isLoading: isApiLoading } = react.useVolrPaymentApi();
-  const [payments, setPayments] = React13.useState([]);
-  const [isLoading, setIsLoading] = React13.useState(true);
-  const [error, setError] = React13.useState(null);
-  React13.useEffect(() => {
+  const [payments, setPayments] = React14.useState([]);
+  const [isLoading, setIsLoading] = React14.useState(true);
+  const [error, setError] = React14.useState(null);
+  React14.useEffect(() => {
     setIsLoading(true);
     setError(null);
     getPaymentHistory({ take: 20 }).then((result) => {
@@ -5440,13 +5477,13 @@ function PaymentDetailView({ payment }) {
   ] });
 }
 function InfoRow({ label, value, copyable, mono }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-3 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400 volr:mb-1", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:gap-2", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:px-5 volr:py-4 volr:border-b volr:border-slate-200 last:volr:border-b-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:font-medium volr:text-slate-500 volr:mb-2", children: label }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between", style: { gap: "0.5rem" }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         "p",
         {
-          className: `volr:text-sm volr:text-slate-900 volr:break-all ${mono ? "volr:font-mono" : ""}`,
+          className: `volr:text-sm volr:font-medium volr:text-slate-900 volr:break-all volr:flex-1 ${mono ? "volr:font-mono" : ""}`,
           children: value
         }
       ),
@@ -5476,36 +5513,49 @@ function AccountInfoView({ user }) {
     return `${address.slice(0, 6)}...${address.slice(-4)}`;
   };
   const externalWallet = user.authWallet ? user.authWallet.split(":")[1] || user.authWallet : null;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.account") }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.info.loginMethod.label"), value: getLoginMethod() }),
-      user.email && !user.email.includes("@wallet.") && /* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.email"), value: user.email }),
-      user.evmAddress && /* @__PURE__ */ jsxRuntime.jsx(
-        InfoRow,
-        {
-          label: t("account.walletAddress"),
-          value: formatAddress(user.evmAddress),
-          copyable: true,
-          mono: true
-        }
-      ),
-      externalWallet && /* @__PURE__ */ jsxRuntime.jsx(
-        InfoRow,
-        {
-          label: t("account.info.connectedWallet"),
-          value: formatAddress(externalWallet),
-          copyable: true,
-          mono: true
-        }
-      ),
-      user.signerType && /* @__PURE__ */ jsxRuntime.jsx(
-        InfoRow,
-        {
-          label: t("account.info.signerType"),
-          value: user.signerType === "passkey" ? "Passkey" : user.signerType
-        }
-      )
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:px-5 volr:pt-5 volr:pb-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:rounded-xl volr:border volr:border-slate-200 volr:bg-white volr:overflow-hidden volr:shadow-sm", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.info.loginMethod.label"), value: getLoginMethod() }),
+    user.email && !user.email.includes("@wallet.") && /* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.email"), value: user.email }),
+    user.evmAddress && /* @__PURE__ */ jsxRuntime.jsx(
+      InfoRow,
+      {
+        label: t("account.walletAddress"),
+        value: formatAddress(user.evmAddress),
+        copyable: true,
+        mono: true
+      }
+    ),
+    externalWallet && /* @__PURE__ */ jsxRuntime.jsx(
+      InfoRow,
+      {
+        label: t("account.info.connectedWallet"),
+        value: formatAddress(externalWallet),
+        copyable: true,
+        mono: true
+      }
+    ),
+    user.signerType && /* @__PURE__ */ jsxRuntime.jsx(
+      InfoRow,
+      {
+        label: t("account.info.signerType"),
+        value: user.signerType === "passkey" ? "Passkey" : user.signerType
+      }
+    )
+  ] }) });
+}
+function AccountSetupView({
+  onCreateAccount,
+  onLogout
+}) {
+  const { t } = useI18n();
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-5", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:text-slate-900", children: t("account.setup.title") }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600 volr:leading-relaxed", children: t("account.setup.description") })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { className: "volr:w-full", onClick: onCreateAccount, children: t("account.setup.cta") }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { className: "volr:w-full", variant: "secondary", onClick: onLogout, children: t("account.setup.logout") })
     ] })
   ] });
 }
@@ -5513,16 +5563,17 @@ function AccountModal({ isOpen, onClose, onError }) {
   const { user, logout } = react.useVolrContext();
   const { balances, totalUsd, isLoading, paymentEnabled, refresh } = react.useUserBalances();
   const { client } = react.useInternalAuth();
-  const [currentView, setCurrentView] = React13.useState("main");
-  const [selectedPayment, setSelectedPayment] = React13.useState(null);
-  const [isLoggingOut, setIsLoggingOut] = React13.useState(false);
-  const prevUserRef = React13.useRef(user ?? null);
-  const [closingAfterLogin, setClosingAfterLogin] = React13.useState(false);
-  const [depositAssets, setDepositAssets] = React13.useState([]);
-  const [depositLoading, setDepositLoading] = React13.useState(false);
-  const [depositError, setDepositError] = React13.useState(null);
-  const [depositSelectedIdx, setDepositSelectedIdx] = React13.useState(-1);
-  React13.useEffect(() => {
+  const [currentView, setCurrentView] = React14.useState("main");
+  const [selectedPayment, setSelectedPayment] = React14.useState(null);
+  const [isLoggingOut, setIsLoggingOut] = React14.useState(false);
+  const prevUserRef = React14.useRef(user ?? null);
+  const [closingAfterLogin, setClosingAfterLogin] = React14.useState(false);
+  const [setupStep, setSetupStep] = React14.useState("prompt");
+  const [depositAssets, setDepositAssets] = React14.useState([]);
+  const [depositLoading, setDepositLoading] = React14.useState(false);
+  const [depositError, setDepositError] = React14.useState(null);
+  const [depositSelectedIdx, setDepositSelectedIdx] = React14.useState(-1);
+  React14.useEffect(() => {
     if (currentView !== "deposit" || !isOpen) return;
     setDepositLoading(true);
     setDepositError(null);
@@ -5539,16 +5590,17 @@ function AccountModal({ isOpen, onClose, onError }) {
       setDepositLoading(false);
     });
   }, [currentView, isOpen, client]);
-  const handleOpenChange = React13.useCallback((open) => {
+  const handleOpenChange = React14.useCallback((open) => {
     if (!open) {
       onClose();
       setTimeout(() => {
         setCurrentView("main");
         setSelectedPayment(null);
+        setSetupStep("prompt");
       }, 200);
     }
   }, [onClose]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (!isOpen) {
       setClosingAfterLogin(false);
       prevUserRef.current = user ?? null;
@@ -5575,32 +5627,44 @@ function AccountModal({ isOpen, onClose, onError }) {
     return /* @__PURE__ */ jsxRuntime.jsx(SigninModal, { isOpen, onClose, onError });
   }
   if (!user.keyStorageType) {
-    const handlePasskeyComplete = () => {
-      onClose();
-    };
-    const handlePasskeyError = (error) => {
-      if (onError) onError(error);
-    };
-    const handleLogoutFromPasskey = async () => {
-      try {
-        await logout();
-        onClose();
-      } catch (error) {
-        if (onError) {
-          onError(error instanceof Error ? error : new Error("Logout failed"));
+    return /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open: isOpen, onOpenChange: handleOpenChange, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ModalHeader,
+        {
+          back: setupStep === "enroll",
+          onBack: setupStep === "enroll" ? () => setSetupStep("prompt") : void 0,
+          onClose
         }
-      }
-    };
-    return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxRuntime.jsx(
-      PasskeyEnrollView,
-      {
-        wrapInModal: false,
-        onComplete: handlePasskeyComplete,
-        onError: handlePasskeyError,
-        onLogout: handleLogoutFromPasskey,
-        onClose
-      }
-    ) });
+      ),
+      setupStep === "prompt" ? /* @__PURE__ */ jsxRuntime.jsx(
+        AccountSetupView,
+        {
+          onCreateAccount: () => setSetupStep("enroll"),
+          onLogout: async () => {
+            try {
+              await logout();
+              onClose();
+            } catch (error) {
+              if (onError) {
+                onError(error instanceof Error ? error : new Error("Logout failed"));
+              }
+            }
+          }
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx(
+        PasskeyEnrollView,
+        {
+          wrapInModal: false,
+          onComplete: () => {
+            setSetupStep("prompt");
+          },
+          onError: (error) => {
+            if (onError) onError(error);
+          },
+          onClose: () => setSetupStep("prompt")
+        }
+      )
+    ] });
   }
   const handleLogout = async () => {
     setIsLoggingOut(true);
@@ -5647,9 +5711,7 @@ function AccountModal({ isOpen, onClose, onError }) {
           AccountMainView,
           {
             totalUsd,
-            balances,
             isLoading,
-            paymentEnabled,
             onNavigate: handleNavigate,
             onLogout: handleLogout,
             isLoggingOut
@@ -5705,11 +5767,11 @@ var DepositModal = ({
 }) => {
   const { user } = react.useVolrContext();
   const { client } = react.useInternalAuth();
-  const [depositAssets, setDepositAssets] = React13.useState([]);
-  const [isLoading, setIsLoading] = React13.useState(true);
-  const [error, setError] = React13.useState(null);
-  const [selectedIdx, setSelectedIdx] = React13.useState(-1);
-  React13.useEffect(() => {
+  const [depositAssets, setDepositAssets] = React14.useState([]);
+  const [isLoading, setIsLoading] = React14.useState(true);
+  const [error, setError] = React14.useState(null);
+  const [selectedIdx, setSelectedIdx] = React14.useState(-1);
+  React14.useEffect(() => {
     if (!open) return;
     setIsLoading(true);
     setError(null);
@@ -5736,12 +5798,12 @@ var DepositModal = ({
     if (depositAssets.length === 1) return 0;
     return -1;
   };
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (open && !isLoading && depositAssets.length > 0) {
       setSelectedIdx(getInitialIndex());
     }
   }, [open, isLoading, depositAssets.length, asset]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (!open) {
       setSelectedIdx(-1);
     }
@@ -5773,6 +5835,7 @@ var DepositModal = ({
 var initialState = {
   step: "info",
   processingStep: "signing",
+  walletStep: "choice",
   isConfigLoading: true,
   isPaying: false,
   payOptions: null,
@@ -5797,6 +5860,20 @@ function paymentModalReducer(state, action) {
         payOptions: action.options,
         isConfigLoading: true
       };
+    case "SHOW_WALLET":
+      return {
+        ...state,
+        step: "wallet",
+        walletStep: action.walletStep,
+        error: void 0
+      };
+    case "BACK_TO_PAYMENT":
+      return {
+        ...state,
+        step: "info",
+        walletStep: "choice",
+        error: void 0
+      };
     case "SET_TOKENS": {
       const balances = /* @__PURE__ */ new Map();
       for (const token of action.tokens) {
@@ -5884,7 +5961,7 @@ function usePaymentModalState(open, onOpenChange) {
   const { evm } = react.useVolr();
   const { paymentOptions } = useVolrModal();
   const { createPayment, updatePaymentToProcessing, pollPaymentStatus, failPendingPayment } = react.useVolrPaymentApi();
-  const [state, dispatch] = React13.useReducer(paymentModalReducer, initialState);
+  const [state, dispatch] = React14.useReducer(paymentModalReducer, initialState);
   const tokensWithBalances = state.tokens.map((token) => {
     const balanceData = state.tokenBalances.get(token.id);
     return {
@@ -5896,7 +5973,7 @@ function usePaymentModalState(open, onOpenChange) {
   });
   const selectedToken = state.selectedTokenId ? tokensWithBalances.find((t) => t.id === state.selectedTokenId) ?? null : null;
   const isBalanceLoading = tokensWithBalances.some((t) => t.isBalanceLoading);
-  const fetchTokenBalance = React13.useCallback(
+  const fetchTokenBalance = React14.useCallback(
     async (token) => {
       if (!user?.evmAddress) {
         dispatch({
@@ -5944,20 +6021,20 @@ function usePaymentModalState(open, onOpenChange) {
     },
     [user, evm]
   );
-  const fetchAllBalances = React13.useCallback(
+  const fetchAllBalances = React14.useCallback(
     async (tokens) => {
       await Promise.all(tokens.map((token) => fetchTokenBalance(token)));
     },
     [fetchTokenBalance]
   );
-  const fetchBranding = React13.useCallback(async () => {
+  const fetchBranding = React14.useCallback(async () => {
     try {
       const response = await client.get("/auth/branding");
       dispatch({ type: "SET_LOGO_URL", logoUrl: response.logoUrl });
     } catch {
     }
   }, [client]);
-  const fetchPaymentConfig = React13.useCallback(async () => {
+  const fetchPaymentConfig = React14.useCallback(async () => {
     dispatch({ type: "SET_CONFIG_LOADING", loading: true });
     try {
       const response = await client.get("/payments/config");
@@ -5974,7 +6051,7 @@ function usePaymentModalState(open, onOpenChange) {
       dispatch({ type: "SET_CONFIG_LOADING", loading: false });
     }
   }, [client, fetchAllBalances]);
-  const selectBestToken = React13.useCallback(() => {
+  const selectBestToken = React14.useCallback(() => {
     if (state.tokens.length === 0) return;
     if (state.selectedTokenId) return;
     let bestTokenId = state.tokens[0].id;
@@ -5988,7 +6065,7 @@ function usePaymentModalState(open, onOpenChange) {
     }
     dispatch({ type: "SELECT_TOKEN", tokenId: bestTokenId });
   }, [state.tokens, state.tokenBalances, state.selectedTokenId]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (open && paymentOptions?.options) {
       if (state.step === "processing" || state.step === "result") {
         return;
@@ -6000,17 +6077,44 @@ function usePaymentModalState(open, onOpenChange) {
       dispatch({ type: "RESET" });
     }
   }, [open, paymentOptions?.options?.amount]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (!isBalanceLoading && state.tokens.length > 0 && !state.selectedTokenId) {
       selectBestToken();
     }
   }, [isBalanceLoading, state.tokens.length, state.selectedTokenId, selectBestToken]);
-  const handleSelectToken = React13.useCallback((tokenId) => {
+  const handleSelectToken = React14.useCallback((tokenId) => {
     dispatch({ type: "SELECT_TOKEN", tokenId });
   }, []);
-  const handlePay = React13.useCallback(async () => {
+  const handleWalletBack = React14.useCallback(() => {
+    if (state.step !== "wallet") {
+      return;
+    }
+    if (state.walletStep === "choice") {
+      dispatch({ type: "BACK_TO_PAYMENT" });
+      return;
+    }
+    dispatch({ type: "SHOW_WALLET", walletStep: "choice" });
+  }, [state.step, state.walletStep]);
+  const handleChooseCreateAccount = React14.useCallback(() => {
+    dispatch({ type: "SHOW_WALLET", walletStep: "create-account" });
+  }, []);
+  const handleChooseExternalWallet = React14.useCallback(() => {
+    dispatch({ type: "SHOW_WALLET", walletStep: "external-wallet" });
+  }, []);
+  const handlePay = React14.useCallback(async () => {
     const { payOptions, receiverAddress, selectedTokenId } = state;
-    if (!payOptions || !user?.evmAddress || !paymentOptions || !receiverAddress || !selectedTokenId) {
+    if (!payOptions || !paymentOptions || !receiverAddress || !selectedTokenId) {
+      return;
+    }
+    if (!user) {
+      dispatch({
+        type: "PAYMENT_ERROR",
+        error: { code: "AUTH_REQUIRED", message: "Please sign in to continue." }
+      });
+      return;
+    }
+    if (!user.evmAddress) {
+      dispatch({ type: "SHOW_WALLET", walletStep: "choice" });
       return;
     }
     const tokenInfo = state.tokens.find((t) => t.id === selectedTokenId);
@@ -6026,6 +6130,15 @@ function usePaymentModalState(open, onOpenChange) {
       });
       createdPaymentId = payment.id;
       dispatch({ type: "SET_CREATED_PAYMENT", payment });
+      if (payment.status !== "PENDING") {
+        const alreadyProcessedError = new Error(
+          payment.status === "CONFIRMED" ? "This payment has already been completed. If you used an idempotencyKey, the original payment was already processed." : `Payment already processed with status: ${payment.status}. If you used an idempotencyKey, the original payment was already processed.`
+        );
+        alreadyProcessedError.code = "PAYMENT_ALREADY_PROCESSED";
+        alreadyProcessedError.paymentStatus = payment.status;
+        alreadyProcessedError.payment = payment;
+        throw alreadyProcessedError;
+      }
       paymentOptions.options.handlers?.onCreated?.({ id: payment.id });
       const evmClient = evm.client(tokenInfo.chainId);
       dispatch({ type: "SET_PROCESSING_STEP", step: "broadcasting" });
@@ -6071,13 +6184,28 @@ function usePaymentModalState(open, onOpenChange) {
       }
     } catch (err) {
       console.error("Payment failed:", err);
-      if (createdPaymentId) {
+      const isAlreadyProcessed = err.code === "PAYMENT_ALREADY_PROCESSED";
+      if (createdPaymentId && !isAlreadyProcessed) {
         try {
           await failPendingPayment(createdPaymentId);
         } catch (failErr) {
           console.error("Failed to mark payment as failed:", failErr);
         }
       }
+      if (isAlreadyProcessed && err.payment) {
+        dispatch({ type: "PAYMENT_SUCCESS", payment: err.payment });
+        if (err.payment.status === "CONFIRMED") {
+          paymentOptions?.onComplete?.(err.payment);
+        } else {
+          const paymentError2 = {
+            code: err.code || "PAYMENT_ALREADY_PROCESSED",
+            message: err.message || "Payment already processed."
+          };
+          dispatch({ type: "PAYMENT_ERROR", error: paymentError2 });
+          paymentOptions?.onError?.(paymentError2);
+        }
+        return;
+      }
       const paymentError = {
         code: err.code || "PAYMENT_FAILED",
         message: err.message || "Payment failed. Please try again."
@@ -6095,10 +6223,144 @@ function usePaymentModalState(open, onOpenChange) {
     pollPaymentStatus,
     failPendingPayment
   ]);
-  const handleDeposit = React13.useCallback(() => {
+  const handleExternalWalletConnected = React14.useCallback(
+    async ({ provider, address }) => {
+      const { payOptions, receiverAddress, selectedTokenId } = state;
+      if (!payOptions || !paymentOptions || !receiverAddress || !selectedTokenId) {
+        return;
+      }
+      const tokenInfo = state.tokens.find((t) => t.id === selectedTokenId);
+      if (!tokenInfo) {
+        return;
+      }
+      if (tokenInfo.address === "native") {
+        dispatch({
+          type: "PAYMENT_ERROR",
+          error: {
+            code: "TOKEN_NOT_SUPPORTED",
+            message: "External wallet payment is not supported for native tokens."
+          }
+        });
+        return;
+      }
+      dispatch({ type: "START_PAYMENT" });
+      let createdPaymentId = null;
+      const toPaymentError = (err) => {
+        const backend = err?.response?.data?.error;
+        if (backend?.code && backend?.message) {
+          return { code: backend.code, message: backend.message };
+        }
+        if (typeof err?.code === "string" && typeof err?.message === "string") {
+          return { code: err.code, message: err.message };
+        }
+        return { code: "PAYMENT_FAILED", message: "Payment failed. Please try again." };
+      };
+      try {
+        const payment = await createPayment({
+          ...payOptions,
+          tokenId: selectedTokenId
+        });
+        createdPaymentId = payment.id;
+        dispatch({ type: "SET_CREATED_PAYMENT", payment });
+        if (payment.status !== "PENDING") {
+          const alreadyProcessedError = new Error(
+            payment.status === "CONFIRMED" ? "This payment has already been completed." : `Payment already processed with status: ${payment.status}.`
+          );
+          alreadyProcessedError.code = "PAYMENT_ALREADY_PROCESSED";
+          alreadyProcessedError.payment = payment;
+          throw alreadyProcessedError;
+        }
+        paymentOptions.options.handlers?.onCreated?.({ id: payment.id });
+        const prepare = await client.post(`/payments/${payment.id}/external/permit/prepare`, {
+          payer: address
+        });
+        const typedData = prepare.quote?.typedData;
+        if (!typedData) {
+          throw new Error("INVALID_TYPED_DATA");
+        }
+        try {
+          const hexChainId = `0x${tokenInfo.chainId.toString(16)}`;
+          await provider.request({
+            method: "wallet_switchEthereumChain",
+            params: [{ chainId: hexChainId }]
+          });
+        } catch {
+        }
+        let signature;
+        try {
+          signature = await provider.request({
+            method: "eth_signTypedData_v4",
+            params: [address, JSON.stringify(typedData)]
+          });
+        } catch {
+          signature = await provider.request({
+            method: "eth_signTypedData",
+            params: [address, typedData]
+          });
+        }
+        dispatch({ type: "SET_PROCESSING_STEP", step: "broadcasting" });
+        const submit = await client.post(`/payments/${payment.id}/external/permit/submit`, {
+          payer: address,
+          signature,
+          quote: prepare.quote,
+          quoteSignature: prepare.quoteSignature
+        });
+        dispatch({ type: "SET_TX_HASH", txHash: submit.txHash ?? "" });
+        dispatch({ type: "SET_PROCESSING_STEP", step: "confirming" });
+        paymentOptions.onProcessing?.({
+          ...submit.payment,
+          txHash: submit.txHash ?? submit.payment.txHash ?? "",
+          status: "PROCESSING"
+        });
+        const confirmedPayment = await pollPaymentStatus(payment.id);
+        dispatch({ type: "PAYMENT_SUCCESS", payment: confirmedPayment });
+        if (confirmedPayment.status === "CONFIRMED") {
+          paymentOptions.onComplete?.(confirmedPayment);
+        } else if (confirmedPayment.status === "FAILED") {
+          const failError = {
+            code: "PAYMENT_FAILED",
+            message: "Transaction failed on-chain"
+          };
+          dispatch({ type: "PAYMENT_ERROR", error: failError });
+          paymentOptions.onError?.(failError);
+        }
+      } catch (err) {
+        const isAlreadyProcessed = err?.code === "PAYMENT_ALREADY_PROCESSED";
+        if (createdPaymentId && !isAlreadyProcessed) {
+          try {
+            await failPendingPayment(createdPaymentId);
+          } catch {
+          }
+        }
+        if (isAlreadyProcessed && err.payment) {
+          dispatch({ type: "PAYMENT_SUCCESS", payment: err.payment });
+          if (err.payment.status === "CONFIRMED") {
+            paymentOptions?.onComplete?.(err.payment);
+          } else {
+            const paymentError2 = toPaymentError(err);
+            dispatch({ type: "PAYMENT_ERROR", error: paymentError2 });
+            paymentOptions?.onError?.(paymentError2);
+          }
+          return;
+        }
+        const paymentError = toPaymentError(err);
+        dispatch({ type: "PAYMENT_ERROR", error: paymentError });
+        paymentOptions?.onError?.(paymentError);
+      }
+    },
+    [
+      state,
+      paymentOptions,
+      client,
+      createPayment,
+      pollPaymentStatus,
+      failPendingPayment
+    ]
+  );
+  const handleDeposit = React14.useCallback(() => {
     dispatch({ type: "SHOW_DEPOSIT" });
   }, []);
-  const handleDepositClose = React13.useCallback(
+  const handleDepositClose = React14.useCallback(
     (depositOpen) => {
       if (!depositOpen) {
         dispatch({ type: "HIDE_DEPOSIT" });
@@ -6109,28 +6371,28 @@ function usePaymentModalState(open, onOpenChange) {
     },
     [state.tokens, fetchAllBalances]
   );
-  const handleDone = React13.useCallback(() => {
+  const handleDone = React14.useCallback(() => {
     if (state.createdPayment?.status === "CONFIRMED") {
       paymentOptions?.onComplete?.(state.createdPayment);
     }
     onOpenChange(false);
   }, [state.createdPayment, paymentOptions, onOpenChange]);
-  const handleRetry = React13.useCallback(() => {
+  const handleRetry = React14.useCallback(() => {
     dispatch({ type: "RETRY" });
     if (state.tokens.length > 0) {
       fetchAllBalances(state.tokens);
     }
   }, [state.tokens, fetchAllBalances]);
-  const handleClose = React13.useCallback(() => {
+  const handleClose = React14.useCallback(() => {
     if (state.step === "processing") {
       return;
     }
-    if (state.step === "info") {
+    if (state.step === "info" || state.step === "wallet") {
       paymentOptions?.onCancel?.();
     }
     onOpenChange(false);
   }, [state.step, paymentOptions, onOpenChange]);
-  const handleReport = React13.useCallback(async () => {
+  const handleReport = React14.useCallback(async () => {
     const { createdPayment, error, step, txHash, selectedTokenId } = state;
     const tokenInfo = state.tokens.find((t) => t.id === selectedTokenId);
     if (!createdPayment || !error) return;
@@ -6169,6 +6431,10 @@ Please contact support with this information.`
     isBalanceLoading,
     handleSelectToken,
     handlePay,
+    handleWalletBack,
+    handleChooseCreateAccount,
+    handleChooseExternalWallet,
+    handleExternalWalletConnected,
     handleDeposit,
     handleDepositClose,
     handleDone,
@@ -6285,10 +6551,10 @@ var TokenSelector = ({
   onSelect,
   disabled = false
 }) => {
-  const [isOpen, setIsOpen] = React13.useState(false);
-  const dropdownRef = React13.useRef(null);
+  const [isOpen, setIsOpen] = React14.useState(false);
+  const dropdownRef = React14.useRef(null);
   const selectedToken = tokens.find((t) => t.id === selectedTokenId);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     const handleClickOutside = (event) => {
       if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
         setIsOpen(false);
@@ -6441,7 +6707,8 @@ var PaymentInfoView = ({
   onPay,
   onDeposit,
   isPaying,
-  isBalanceLoading
+  isBalanceLoading,
+  disableBalanceCheck = false
 }) => {
   const selectedToken = tokens.find((t) => t.id === selectedTokenId);
   const tokenSymbol = selectedToken?.symbol ?? "";
@@ -6452,7 +6719,7 @@ var PaymentInfoView = ({
     maximumFractionDigits: tokenDecimals > 6 ? 6 : tokenDecimals
   });
   const balanceNum = parseFloat(balance.replace(/,/g, "") || "0");
-  const isInsufficient = !isBalanceLoading && selectedToken && balanceNum < amount;
+  const isInsufficient = !disableBalanceCheck && !isBalanceLoading && selectedToken && balanceNum < amount;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-6", children: [
     itemName && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -6485,7 +6752,7 @@ var PaymentInfoView = ({
         }
       )
     ] }),
-    selectedToken && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: isBalanceLoading || selectedToken.isBalanceLoading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:items-center volr:p-3 volr:bg-slate-50 volr:rounded-lg volr:animate-pulse", children: [
+    selectedToken && !disableBalanceCheck && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: isBalanceLoading || selectedToken.isBalanceLoading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:items-center volr:p-3 volr:bg-slate-50 volr:rounded-lg volr:animate-pulse", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:text-slate-400", children: "Loading balance..." }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:bg-slate-200 volr:rounded volr:w-20" })
     ] }) : /* @__PURE__ */ jsxRuntime.jsx(
@@ -6502,7 +6769,7 @@ var PaymentInfoView = ({
         Button,
         {
           onClick: onPay,
-          disabled: isPaying || isBalanceLoading || !!isInsufficient || !selectedToken,
+          disabled: isPaying || !disableBalanceCheck && (isBalanceLoading || !!isInsufficient) || !selectedToken,
           className: "volr:w-full",
           children: isPaying ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:flex volr:items-center volr:justify-center volr:gap-2", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "volr:animate-spin volr:h-4 volr:w-4", viewBox: "0 0 24 24", children: [
@@ -6531,7 +6798,7 @@ var PaymentInfoView = ({
           ] }) : isInsufficient ? "Insufficient Balance" : !selectedToken ? "Select a token" : `Pay ${formattedAmount} ${tokenSymbol}`
         }
       ),
-      isInsufficient && selectedToken && /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "secondary", onClick: onDeposit, className: "volr:w-full", children: [
+      isInsufficient && selectedToken && !disableBalanceCheck && /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "secondary", onClick: onDeposit, className: "volr:w-full", children: [
         "Deposit ",
         tokenSymbol
       ] })
@@ -6606,14 +6873,7 @@ var PaymentProcessingView = ({
       /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-1", children: getStatusMessage() }),
       /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: t("payment.processing.doNotClose") })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:items-center volr:justify-center volr:gap-2", children: [0, 1, 2].map((stepIdx) => /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: `volr:h-1.5 volr:rounded-full volr:transition-all volr:duration-300 ${stepIdx <= currentStep ? "volr:bg-slate-900 volr:w-8" : "volr:bg-slate-200 volr:w-6"}`,
-        style: stepIdx === currentStep ? { animation: "volrProgressPulse 1.5s ease-in-out infinite" } : void 0
-      },
-      stepIdx
-    )) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ProgressSteps, { totalSteps: 3, currentStep }),
     /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
         @keyframes volrSpin {
           from { transform: rotate(0deg); }
@@ -6623,10 +6883,6 @@ var PaymentProcessingView = ({
           0%, 100% { transform: scale(1); opacity: 1; }
           50% { transform: scale(0.95); opacity: 0.85; }
         }
-        @keyframes volrProgressPulse {
-          0%, 100% { opacity: 1; }
-          50% { opacity: 0.6; }
-        }
       ` })
   ] });
 };
@@ -6733,10 +6989,144 @@ var PaymentResultView = ({
     isSuccess && /* @__PURE__ */ jsxRuntime.jsx(PoweredBy, {})
   ] });
 };
+function PaymentWalletChoiceView({
+  isExternalWalletEnabled,
+  externalWalletDisabledReason,
+  onChooseExternalWallet,
+  onChooseCreateAccount
+}) {
+  const { t } = useI18n();
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-5", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:text-slate-900", children: t("payment.walletChoice.title") }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600 volr:leading-relaxed", children: t("payment.walletChoice.description") })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Button,
+        {
+          className: "volr:w-full",
+          variant: "secondary",
+          onClick: onChooseExternalWallet,
+          disabled: !isExternalWalletEnabled,
+          children: t("payment.walletChoice.externalCta")
+        }
+      ),
+      !isExternalWalletEnabled && externalWalletDisabledReason && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-500 volr:leading-relaxed", children: externalWalletDisabledReason }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { className: "volr:w-full", onClick: onChooseCreateAccount, children: t("payment.walletChoice.createAccountCta") })
+    ] })
+  ] });
+}
+var DefaultWalletIcon3 = () => /* @__PURE__ */ jsxRuntime.jsxs(
+  "svg",
+  {
+    className: "volr:w-6 volr:h-6 volr:text-slate-600",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "rect",
+        {
+          x: "2",
+          y: "6",
+          width: "20",
+          height: "14",
+          rx: "2",
+          stroke: "currentColor",
+          strokeWidth: "1.5"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "path",
+        {
+          d: "M17 12.5C17 13.3284 16.3284 14 15.5 14C14.6716 14 14 13.3284 14 12.5C14 11.6716 14.6716 11 15.5 11C16.3284 11 17 11.6716 17 12.5Z",
+          fill: "currentColor"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "path",
+        {
+          d: "M6 6V5C6 3.89543 6.89543 3 8 3H16C17.1046 3 18 3.89543 18 5V6",
+          stroke: "currentColor",
+          strokeWidth: "1.5"
+        }
+      )
+    ]
+  }
+);
+function PaymentExternalWalletView({
+  onConnected,
+  onCancel
+}) {
+  const { t } = useI18n();
+  const { isDetecting, getWalletsForDisplay, hasWallet } = react.useEIP6963();
+  const wallets = React14.useMemo(() => getWalletsForDisplay(), [getWalletsForDisplay]);
+  const [isConnecting, setIsConnecting] = React14.useState(false);
+  const [error, setError] = React14.useState(null);
+  const connect = async (wallet) => {
+    setIsConnecting(true);
+    setError(null);
+    try {
+      const provider = wallet.provider;
+      const accounts = await provider.request({ method: "eth_requestAccounts" });
+      const address = accounts?.[0] || null;
+      if (!address) {
+        throw new Error("NO_ACCOUNTS");
+      }
+      await onConnected({ provider, address });
+    } catch (err) {
+      setError(
+        err instanceof Error ? t("payment.walletChoice.externalConnectFailed") : t("payment.walletChoice.externalConnectFailed")
+      );
+    } finally {
+      setIsConnecting(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:text-slate-900", children: t("payment.walletChoice.externalTitle") }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600", children: t("payment.walletChoice.externalDescription") })
+    ] }),
+    error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:text-red-600 volr:bg-red-50 volr:border volr:border-red-200 volr:rounded-lg volr:p-3", children: error }),
+    isDetecting ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: t("common.loading") }) : !hasWallet || wallets.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600", children: t("payment.walletChoice.noWalletsDetected") }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { className: "volr:w-full", variant: "secondary", onClick: onCancel, children: t("common.back") })
+    ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-2", children: [
+      wallets.map((w) => /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          className: "volr:w-full volr:flex volr:items-center volr:justify-between volr:gap-3 volr:px-4 volr:py-3 volr:rounded-xl volr:border volr:border-slate-200 volr:hover:bg-slate-50",
+          disabled: isConnecting,
+          onClick: () => connect(w),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", children: [
+              w.icon ? /* @__PURE__ */ jsxRuntime.jsx(
+                "img",
+                {
+                  src: w.icon,
+                  alt: w.name,
+                  className: "volr:w-6 volr:h-6 volr:rounded"
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx(DefaultWalletIcon3, {}),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: w.name })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:text-slate-500", children: isConnecting ? t("payment.walletChoice.connecting") : t("payment.walletChoice.connect") })
+          ]
+        },
+        w.id
+      )),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { className: "volr:w-full", variant: "secondary", onClick: onCancel, children: t("common.back") })
+    ] })
+  ] });
+}
 var PaymentModal = ({
   open,
   onOpenChange
 }) => {
+  const { t } = useI18n();
+  const { user } = react.useVolrContext();
   const { paymentOptions } = useVolrModal();
   const {
     state,
@@ -6745,6 +7135,10 @@ var PaymentModal = ({
     isBalanceLoading,
     handleSelectToken,
     handlePay,
+    handleWalletBack,
+    handleChooseCreateAccount,
+    handleChooseExternalWallet,
+    handleExternalWalletConnected,
     handleDeposit,
     handleDepositClose,
     handleDone,
@@ -6765,7 +7159,8 @@ var PaymentModal = ({
     txHash,
     error,
     logoUrl,
-    showDeposit
+    showDeposit,
+    walletStep
   } = state;
   if (showDeposit && selectedToken) {
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -6796,6 +7191,8 @@ var PaymentModal = ({
     /* @__PURE__ */ jsxRuntime.jsx(
       ModalHeader,
       {
+        back: step === "wallet" && walletStep !== "choice",
+        onBack: step === "wallet" && walletStep !== "choice" ? handleWalletBack : void 0,
         onClose: canClose ? handleClose : void 0,
         title: step === "info" ? "Confirm Payment" : void 0
       }
@@ -6814,9 +7211,39 @@ var PaymentModal = ({
         onPay: handlePay,
         onDeposit: handleDeposit,
         isPaying,
-        isBalanceLoading
+        isBalanceLoading,
+        disableBalanceCheck: !user?.evmAddress
       }
     ),
+    step === "wallet" && walletStep === "choice" && selectedToken && /* @__PURE__ */ jsxRuntime.jsx(
+      PaymentWalletChoiceView,
+      {
+        isExternalWalletEnabled: selectedToken.address !== "native",
+        externalWalletDisabledReason: selectedToken.address === "native" ? t("payment.walletChoice.externalDisabledNative") : void 0,
+        onChooseExternalWallet: handleChooseExternalWallet,
+        onChooseCreateAccount: handleChooseCreateAccount
+      }
+    ),
+    step === "wallet" && walletStep === "external-wallet" && /* @__PURE__ */ jsxRuntime.jsx(
+      PaymentExternalWalletView,
+      {
+        onConnected: handleExternalWalletConnected,
+        onCancel: handleWalletBack
+      }
+    ),
+    step === "wallet" && walletStep === "create-account" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:pt-1", children: /* @__PURE__ */ jsxRuntime.jsx(
+      PasskeyEnrollView,
+      {
+        wrapInModal: false,
+        onComplete: () => {
+          Promise.resolve(handlePay()).catch(() => {
+          });
+        },
+        onError: () => {
+        },
+        onClose: handleWalletBack
+      }
+    ) }),
     step === "processing" && /* @__PURE__ */ jsxRuntime.jsx(PaymentProcessingView, { step: processingStep, txHash }),
     step === "result" && createdPayment && /* @__PURE__ */ jsxRuntime.jsx(
       PaymentResultView,
@@ -6830,19 +7257,19 @@ var PaymentModal = ({
     )
   ] });
 };
-var SignRequestContext = React13.createContext(null);
+var SignRequestContext = React14.createContext(null);
 function SignRequestProvider({ children }) {
-  const [pendingRequest, setPendingRequest] = React13.useState(null);
-  const resolveRef = React13.useRef(null);
-  const rejectRef = React13.useRef(null);
-  const requestSign = React13.useCallback((request) => {
+  const [pendingRequest, setPendingRequest] = React14.useState(null);
+  const resolveRef = React14.useRef(null);
+  const rejectRef = React14.useRef(null);
+  const requestSign = React14.useCallback((request) => {
     return new Promise((resolve, reject2) => {
       setPendingRequest(request);
       resolveRef.current = resolve;
       rejectRef.current = reject2;
     });
   }, []);
-  const approve = React13.useCallback(() => {
+  const approve = React14.useCallback(() => {
     if (resolveRef.current) {
       resolveRef.current();
       resolveRef.current = null;
@@ -6850,7 +7277,7 @@ function SignRequestProvider({ children }) {
     }
     setPendingRequest(null);
   }, []);
-  const reject = React13.useCallback(() => {
+  const reject = React14.useCallback(() => {
     if (rejectRef.current) {
       rejectRef.current(new Error("Sign request cancelled by user"));
       resolveRef.current = null;
@@ -6872,7 +7299,7 @@ function SignRequestProvider({ children }) {
   );
 }
 function useSignRequest() {
-  const context = React13.useContext(SignRequestContext);
+  const context = React14.useContext(SignRequestContext);
   if (!context) {
     throw new Error("useSignRequest must be used within SignRequestProvider");
   }
@@ -6881,7 +7308,7 @@ function useSignRequest() {
   };
 }
 function useSignRequestInternal() {
-  const context = React13.useContext(SignRequestContext);
+  const context = React14.useContext(SignRequestContext);
   if (!context) {
     throw new Error("useSignRequestInternal must be used within SignRequestProvider");
   }
@@ -6916,7 +7343,7 @@ function MessageSignView({ message }) {
   ] });
 }
 function TypedDataSignView({ typedData }) {
-  const [showRawData, setShowRawData] = React13.useState(false);
+  const [showRawData, setShowRawData] = React14.useState(false);
   const { domain, message } = typedData;
   const appName = domain.name;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-4", children: [
@@ -7062,7 +7489,143 @@ function SignRequestModal({ open, onOpenChange }) {
     }
   );
 }
-var VolrUIContext = React13__default.default.createContext(null);
+var WalletRequiredContext = React14.createContext(null);
+function WalletRequiredProvider({ children }) {
+  const [pendingRequest, setPendingRequest] = React14.useState(null);
+  const resolveRef = React14.useRef(null);
+  const rejectRef = React14.useRef(null);
+  const requestWallet = React14.useCallback(
+    (request) => {
+      return new Promise((resolve2, reject2) => {
+        setPendingRequest(request);
+        resolveRef.current = resolve2;
+        rejectRef.current = reject2;
+      });
+    },
+    []
+  );
+  const resolve = React14.useCallback((provider) => {
+    if (resolveRef.current) {
+      resolveRef.current(provider);
+      resolveRef.current = null;
+      rejectRef.current = null;
+    }
+    setPendingRequest(null);
+  }, []);
+  const reject = React14.useCallback((error) => {
+    if (rejectRef.current) {
+      rejectRef.current(error);
+      resolveRef.current = null;
+      rejectRef.current = null;
+    }
+    setPendingRequest(null);
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    WalletRequiredContext.Provider,
+    {
+      value: { requestWallet, pendingRequest, resolve, reject },
+      children
+    }
+  );
+}
+function useWalletRequired() {
+  const ctx = React14.useContext(WalletRequiredContext);
+  if (!ctx) {
+    throw new Error("useWalletRequired must be used within WalletRequiredProvider");
+  }
+  return { requestWallet: ctx.requestWallet };
+}
+function useWalletRequiredInternal() {
+  const ctx = React14.useContext(WalletRequiredContext);
+  if (!ctx) {
+    throw new Error(
+      "useWalletRequiredInternal must be used within WalletRequiredProvider"
+    );
+  }
+  return ctx;
+}
+function WalletRequiredModal() {
+  const { t } = useI18n();
+  const { pendingRequest, resolve, reject } = useWalletRequiredInternal();
+  const { user, provider } = react.useVolrContext();
+  const { keyStorageType } = useVolrUI();
+  const [step, setStep] = React14.useState("notice");
+  const providerRef = React14.useRef(provider);
+  React14.useEffect(() => {
+    providerRef.current = provider;
+  }, [provider]);
+  React14.useEffect(() => {
+    if (pendingRequest) {
+      setStep("notice");
+    }
+  }, [pendingRequest]);
+  const title = React14.useMemo(() => {
+    if (!pendingRequest) return "";
+    if (pendingRequest.type === "transaction") return t("walletRequired.titleTx");
+    if (pendingRequest.type === "typedData") return t("walletRequired.titleTypedData");
+    return t("walletRequired.titleMessage");
+  }, [pendingRequest, t]);
+  const handleCancel = () => {
+    resolve(null);
+  };
+  const handleContinue = () => {
+    if (!user?.id) {
+      reject(new Error("AUTH_REQUIRED"));
+      return;
+    }
+    setStep("enroll");
+  };
+  const handleEnrollComplete = async () => {
+    const p = providerRef.current;
+    if (!p) {
+      reject(new Error("PROVIDER_NOT_AVAILABLE"));
+      return;
+    }
+    resolve(p);
+  };
+  const handleEnrollError = (error) => {
+    console.error("[WalletRequiredModal] Enrollment error:", error);
+  };
+  const open = Boolean(pendingRequest);
+  if (!open) return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Modal,
+    {
+      open,
+      onOpenChange: (next) => !next && handleCancel(),
+      onPointerDownOutside: (e) => e.preventDefault(),
+      ariaLabel: t("walletRequired.ariaLabel"),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ModalHeader, { onClose: handleCancel, children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-base volr:font-semibold volr:text-slate-900", children: title }) }),
+        step === "notice" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600 volr:leading-relaxed", children: t("walletRequired.description") }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Button, { className: "volr:w-full", onClick: handleContinue, children: t("walletRequired.cta") }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              Button,
+              {
+                className: "volr:w-full",
+                variant: "secondary",
+                onClick: handleCancel,
+                children: t("walletRequired.notNow")
+              }
+            )
+          ] })
+        ] }),
+        step === "enroll" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:pt-1", children: keyStorageType === "mpc" ? /* @__PURE__ */ jsxRuntime.jsx(MpcConnectView, { onComplete: handleEnrollComplete, onError: handleEnrollError }) : /* @__PURE__ */ jsxRuntime.jsx(
+          PasskeyEnrollView,
+          {
+            wrapInModal: false,
+            onComplete: handleEnrollComplete,
+            onError: handleEnrollError,
+            onClose: () => resolve(null)
+          }
+        ) })
+      ]
+    }
+  );
+}
+var VolrUIContext = React14__default.default.createContext(null);
 function getCurrentRpId() {
   if (typeof window === "undefined") return "localhost";
   return window.location.hostname;
@@ -7075,39 +7638,30 @@ function isPasskeyDomainMismatch(user) {
   return !registered.some((p) => p?.rpId === currentRpId);
 }
 var useVolrUI = () => {
-  const context = React13.useContext(VolrUIContext);
+  const context = React14.useContext(VolrUIContext);
   if (!context) {
     throw new Error("useVolrUI must be used within VolrUIProvider");
   }
   return context;
 };
 var useVolrUIOptional = () => {
-  return React13.useContext(VolrUIContext);
+  return React14.useContext(VolrUIContext);
 };
 function OnboardingFlow({
   keyStorageType,
   onComplete
 }) {
-  const { logout } = react.useVolrContext();
   const handleEnrollComplete = () => {
     onComplete();
   };
   const handleEnrollError = (_err) => {
   };
-  const handleLogout = async () => {
-    try {
-      await logout();
-      onComplete();
-    } catch (error) {
-    }
-  };
   if (keyStorageType === "passkey") {
     return /* @__PURE__ */ jsxRuntime.jsx(
       PasskeyEnrollView,
       {
         onComplete: handleEnrollComplete,
-        onError: handleEnrollError,
-        onLogout: handleLogout
+        onError: handleEnrollError
       }
     );
   }
@@ -7138,10 +7692,10 @@ var VolrUIProvider = ({
   const providerPolicy = config.providerPolicy ?? {
     enforceOnFirstLogin: true
   };
-  const [keyStorageTypeError, setKeyStorageTypeError] = React13.useState(
+  const [keyStorageTypeError, setKeyStorageTypeError] = React14.useState(
     null
   );
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (providerPolicy.enforceOnFirstLogin !== false && !keyStorageType) {
       const errorMessage = "keyStorageType must be specified in VolrUIProvider props. Please set keyStorageType prop in VolrUIProvider.";
       console.error(errorMessage);
@@ -7157,7 +7711,7 @@ var VolrUIProvider = ({
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:mb-6 volr:leading-relaxed volr-text-secondary", children: keyStorageTypeError })
     ] }) });
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(SignRequestProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(SignRequestProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(WalletRequiredProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
     VolrUIProviderInner,
     {
       config,
@@ -7171,7 +7725,7 @@ var VolrUIProvider = ({
       providerPolicy,
       children
     }
-  ) });
+  ) }) });
 };
 function VolrUIProviderInner({
   config,
@@ -7185,11 +7739,20 @@ function VolrUIProviderInner({
   providerPolicy,
   children
 }) {
-  const [showOnboarding, setShowOnboarding] = React13.useState(false);
+  const [showOnboarding, setShowOnboarding] = React14.useState(false);
   const { requestSign } = useSignRequest();
+  const { requestWallet } = useWalletRequired();
   const configWithSignRequest = {
     ...config,
-    onSignRequest: requestSign
+    onSignRequest: requestSign,
+    onWalletRequired: async (request) => {
+      try {
+        const p = await requestWallet(request);
+        return p ?? null;
+      } catch {
+        return null;
+      }
+    }
   };
   return /* @__PURE__ */ jsxRuntime.jsx(react.VolrProvider, { config: configWithSignRequest, children: /* @__PURE__ */ jsxRuntime.jsx(I18nProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
     VolrUIContext.Provider,
@@ -7204,6 +7767,7 @@ function VolrUIProviderInner({
         keyStorageType
       },
       children: /* @__PURE__ */ jsxRuntime.jsxs(VolrModalProvider, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(WalletRequiredModal, {}),
         /* @__PURE__ */ jsxRuntime.jsx(
           MigrationCoordinator,
           {
@@ -7214,6 +7778,7 @@ function VolrUIProviderInner({
         /* @__PURE__ */ jsxRuntime.jsx(
           OAuthCallbackHandler,
           {
+            enforceSelection: providerPolicy.enforceOnFirstLogin ?? true,
             onShowOnboarding: () => setShowOnboarding(true)
           }
         ),
@@ -7267,15 +7832,15 @@ function MigrationCoordinator({
 }) {
   const { user, setUser } = react.useVolrContext();
   const { client } = react.useInternalAuth();
-  const [running, setRunning] = React13.useState(false);
-  const [isSourcePopup, setIsSourcePopup] = React13.useState(false);
-  const [isTargetPopup, setIsTargetPopup] = React13.useState(false);
-  const [sourceStep, setSourceStep] = React13.useState("ready");
-  const [targetStep, setTargetStep] = React13.useState("ready");
-  const [targetDomain, setTargetDomain] = React13.useState("");
-  const [sourceDomain, setSourceDomain] = React13.useState("");
-  const [errorMessage, setErrorMessage] = React13.useState();
-  React13.useEffect(() => {
+  const [running, setRunning] = React14.useState(false);
+  const [isSourcePopup, setIsSourcePopup] = React14.useState(false);
+  const [isTargetPopup, setIsTargetPopup] = React14.useState(false);
+  const [sourceStep, setSourceStep] = React14.useState("ready");
+  const [targetStep, setTargetStep] = React14.useState("ready");
+  const [targetDomain, setTargetDomain] = React14.useState("");
+  const [sourceDomain, setSourceDomain] = React14.useState("");
+  const [errorMessage, setErrorMessage] = React14.useState();
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     const params = new URLSearchParams(window.location.search);
     const migrationToken = params.get("migration_token");
@@ -7299,7 +7864,7 @@ function MigrationCoordinator({
       }
     }
   }, []);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     const handler = (event) => {
       const data = event.data;
@@ -7311,7 +7876,7 @@ function MigrationCoordinator({
     window.addEventListener("message", handler);
     return () => window.removeEventListener("message", handler);
   }, [client, setUser, onHideOnboarding]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     if (running) return;
     const params = new URLSearchParams(window.location.search);
@@ -7456,9 +8021,9 @@ function MigrationCoordinator({
 }
 function AccountModalPortal() {
   const { isOpen, mode, close } = useVolrModal();
-  const [portalRoot, setPortalRoot] = React13.useState(null);
-  const [error, setError] = React13.useState(null);
-  React13.useEffect(() => {
+  const [portalRoot, setPortalRoot] = React14.useState(null);
+  const [error, setError] = React14.useState(null);
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     let root = document.getElementById("volr-modal-root");
     if (!root) {
@@ -7517,9 +8082,9 @@ function AccountModalPortal() {
 function DepositModalPortal() {
   const { isOpen, mode, asset, close } = useVolrModal();
   const { user } = react.useVolrContext();
-  const [portalRoot, setPortalRoot] = React13.useState(null);
-  const [showLogin, setShowLogin] = React13.useState(false);
-  React13.useEffect(() => {
+  const [portalRoot, setPortalRoot] = React14.useState(null);
+  const [showLogin, setShowLogin] = React14.useState(false);
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     let root = document.getElementById("volr-modal-root");
     if (!root) {
@@ -7534,7 +8099,7 @@ function DepositModalPortal() {
       }
     };
   }, []);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (isOpen && mode === "deposit" && !user) {
       setShowLogin(true);
     } else {
@@ -7568,8 +8133,8 @@ function DepositModalPortal() {
 }
 function PaymentModalPortal() {
   const { isOpen, mode, close } = useVolrModal();
-  const [portalRoot, setPortalRoot] = React13.useState(null);
-  React13.useEffect(() => {
+  const [portalRoot, setPortalRoot] = React14.useState(null);
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     let root = document.getElementById("volr-modal-root");
     if (!root) {
@@ -7598,8 +8163,8 @@ function PaymentModalPortal() {
 }
 function SignRequestModalPortal() {
   const { pendingRequest } = useSignRequestInternal();
-  const [portalRoot, setPortalRoot] = React13.useState(null);
-  React13.useEffect(() => {
+  const [portalRoot, setPortalRoot] = React14.useState(null);
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     let root = document.getElementById("volr-modal-root");
     if (!root) {
@@ -7628,10 +8193,11 @@ function SignRequestModalPortal() {
   );
 }
 function OAuthCallbackHandler({
+  enforceSelection,
   onShowOnboarding
 }) {
-  const [hasCode, setHasCode] = React13.useState(false);
-  React13.useEffect(() => {
+  const [hasCode, setHasCode] = React14.useState(false);
+  React14.useEffect(() => {
     if (typeof window === "undefined") return;
     const params = new URLSearchParams(window.location.search);
     const code = params.get("code");
@@ -7646,12 +8212,13 @@ function OAuthCallbackHandler({
       const passkeys = resultUser.registeredPasskeys ?? [];
       const hasCurrent = passkeys.some((p) => p.rpId === currentRpId);
       const needsMigration = passkeys.length > 0 && !hasCurrent;
-      if (!resultUser.keyStorageType) {
+      if (resultUser.keyStorageType === "passkey" && needsMigration) {
         onShowOnboarding();
         return;
       }
-      if (resultUser.keyStorageType === "passkey" && needsMigration) {
+      if (!resultUser.keyStorageType && enforceSelection) {
         onShowOnboarding();
+        return;
       }
     },
     onError: (err) => {
@@ -7679,14 +8246,14 @@ function OnboardingChecker({
 }) {
   const { user, provider, isLoading } = react.useVolrContext();
   const { isOpen: isModalOpen } = useVolrModal();
-  const modalWasOpened = React13__default.default.useRef(false);
-  const pendingMismatchOnboarding = React13__default.default.useRef(false);
-  React13.useEffect(() => {
+  const modalWasOpened = React14__default.default.useRef(false);
+  const pendingMismatchOnboarding = React14__default.default.useRef(false);
+  React14.useEffect(() => {
     if (isModalOpen) {
       modalWasOpened.current = true;
     }
   }, [isModalOpen]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     if (isLoading) {
       return;
     }
@@ -7721,15 +8288,11 @@ function OnboardingChecker({
       onShowOnboarding();
       return;
     }
-    if (user && enforceSelection) {
-      if (!keyStorageType) {
-        console.error(
-          "keyStorageType must be specified in VolrUIProvider props."
-        );
-        return;
-      }
-      onShowOnboarding();
+    if (!enforceSelection) {
+      onHideOnboarding();
+      return;
     }
+    onHideOnboarding();
   }, [
     user,
     provider,
@@ -7744,7 +8307,7 @@ function OnboardingChecker({
 }
 function useSwitchNetwork() {
   const { client } = react.useInternalAuth();
-  return React13.useCallback(
+  return React14.useCallback(
     async (chainId) => {
       if (typeof window === "undefined" || !window.ethereum) {
         throw new Error("No wallet found");
@@ -7808,8 +8371,8 @@ var paymentPromiseResolver = null;
 function useVolrPay() {
   const { open: openModal, close: closeModal } = useVolrModal();
   const { checkPayment, getPaymentHistory } = react.useVolrPaymentApi();
-  const isInProgressRef = React13.useRef(false);
-  const pay = React13.useCallback(
+  const isInProgressRef = React14.useRef(false);
+  const pay = React14.useCallback(
     (options) => {
       isInProgressRef.current = true;
       const waitPromise = new Promise((resolve, reject) => {