npm - @volr/react-ui - Versions diffs - 0.2.8 → 0.3.0 - Mend

@volr/react-ui 0.2.8 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/index.cjs CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var React15 = require('react');
+var React16 = 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 React15__default = /*#__PURE__*/_interopDefault(React15);
+var React16__default = /*#__PURE__*/_interopDefault(React16);
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __esm = (fn, res) => function __init() {
@@ -1107,13 +1107,13 @@ var translations = {
 function getTranslations(locale = "en") {
   return translations[locale] || translations.en;
 }
-var I18nContext = React15.createContext(null);
+var I18nContext = React16.createContext(null);
 function interpolate(text, params) {
   if (!params) return text;
   return text.replace(/\{\{(\w+)\}\}/g, (_, key) => params[key] ?? `{{${key}}}`);
 }
 function useI18n() {
-  const context = React15.useContext(I18nContext);
+  const context = React16.useContext(I18nContext);
   if (!context) {
     return {
       locale: "en",
@@ -1157,25 +1157,25 @@ function detectLocale(allowedLocales) {
   return resolveLocale(detected, allowedLocales);
 }
 function I18nProvider({ children, allowedLocales }) {
-  const [locale, setLocaleState] = React15.useState(() => detectLocale(allowedLocales));
-  const resolveAllowedLocale = React15.useCallback(
+  const [locale, setLocaleState] = React16.useState(() => detectLocale(allowedLocales));
+  const resolveAllowedLocale = React16.useCallback(
     (next) => resolveLocale(next, allowedLocales),
     [allowedLocales]
   );
-  const setLocale = React15.useCallback(
+  const setLocale = React16.useCallback(
     (next) => {
       setLocaleState(resolveAllowedLocale(next));
     },
     [resolveAllowedLocale]
   );
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     setLocaleState((current) => {
       const resolved = resolveAllowedLocale(current);
       return current === resolved ? current : resolved;
     });
   }, [resolveAllowedLocale]);
-  const translations2 = React15.useMemo(() => getTranslations(locale), [locale]);
-  const t = React15.useMemo(() => {
+  const translations2 = React16.useMemo(() => getTranslations(locale), [locale]);
+  const t = React16.useMemo(() => {
     return (key, params) => {
       const keys = key.split(".");
       let value2 = translations2;
@@ -1192,7 +1192,7 @@ function I18nProvider({ children, allowedLocales }) {
       return typeof value2 === "string" ? interpolate(value2, params) : key;
     };
   }, [translations2]);
-  const value = React15.useMemo(
+  const value = React16.useMemo(
     () => ({
       locale,
       translations: translations2,
@@ -1204,9 +1204,9 @@ function I18nProvider({ children, allowedLocales }) {
   return /* @__PURE__ */ jsxRuntime.jsx(I18nContext.Provider, { value, children });
 }
 var useTranslation = useI18n;
-var VolrModalContext = React15.createContext(null);
+var VolrModalContext = React16.createContext(null);
 var useVolrModal = () => {
-  const context = React15.useContext(VolrModalContext);
+  const context = React16.useContext(VolrModalContext);
   if (!context) {
     throw new Error("useVolrModal must be used within VolrUIProvider");
   }
@@ -1215,17 +1215,17 @@ var useVolrModal = () => {
 var VolrModalProvider = ({
   children
 }) => {
-  const [isOpen, setIsOpen] = React15.useState(false);
-  const [mode, setMode] = React15.useState("account");
-  const [asset, setAsset] = React15.useState(null);
-  const [paymentOptions, setPaymentOptions] = React15.useState(null);
-  const open = React15.useCallback((options) => {
+  const [isOpen, setIsOpen] = React16.useState(false);
+  const [mode, setMode] = React16.useState("account");
+  const [asset, setAsset] = React16.useState(null);
+  const [paymentOptions, setPaymentOptions] = React16.useState(null);
+  const open = React16.useCallback((options) => {
     setMode(options?.mode ?? "account");
     setAsset(options?.asset ?? null);
     setPaymentOptions(options?.payment ?? null);
     setIsOpen(true);
   }, []);
-  const close = React15.useCallback(() => {
+  const close = React16.useCallback(() => {
     setIsOpen(false);
     setAsset(null);
     setPaymentOptions(null);
@@ -1239,11 +1239,11 @@ function cn(...inputs) {
   return twMerge(clsx.clsx(inputs));
 }
 function useMediaQuery(query) {
-  const [matches, setMatches] = React15.useState(() => {
+  const [matches, setMatches] = React16.useState(() => {
     if (typeof window === "undefined") return false;
     return window.matchMedia(query).matches;
   });
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     const mql = window.matchMedia(query);
     const handler = (event) => setMatches(event.matches);
@@ -1257,12 +1257,12 @@ 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-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-3\\.5{height:calc(var(--volr-spacing)*3.5)}.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-3\\.5{width:calc(var(--volr-spacing)*3.5)}.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\\: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-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\\:underline-offset-4{text-underline-offset:4px}.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] = React15.useState(() => {
+  const [resolvedTheme, setResolvedTheme] = React16.useState(() => {
     if (theme !== "system") return theme;
     if (typeof window === "undefined") return "light";
     return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
   });
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (theme !== "system") {
       setResolvedTheme(theme);
       return;
@@ -1278,10 +1278,10 @@ function useResolvedTheme(theme = "light") {
   return resolvedTheme;
 }
 function ShadowPortal({ children, theme = "light" }) {
-  const [mountNode, setMountNode] = React15.useState(null);
-  const hostRef = React15.useRef(null);
+  const [mountNode, setMountNode] = React16.useState(null);
+  const hostRef = React16.useRef(null);
   const resolvedTheme = useResolvedTheme(theme);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     const host = document.createElement("div");
     host.id = "volr-shadow-portal";
     host.style.position = "fixed";
@@ -1305,7 +1305,7 @@ function ShadowPortal({ children, theme = "light" }) {
       hostRef.current = null;
     };
   }, []);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (hostRef.current) {
       hostRef.current.setAttribute("data-theme", resolvedTheme);
     }
@@ -1314,7 +1314,7 @@ function ShadowPortal({ children, theme = "light" }) {
   return reactDom.createPortal(children, mountNode);
 }
 function useFocusTrap(isActive, containerRef) {
-  const previousActiveElement = React15.useRef(null);
+  const previousActiveElement = React16.useRef(null);
   const focusableSelector = [
     "button:not([disabled])",
     "input:not([disabled])",
@@ -1323,7 +1323,7 @@ function useFocusTrap(isActive, containerRef) {
     "a[href]",
     '[tabindex]:not([tabindex="-1"])'
   ].join(", ");
-  const getFocusableElements = React15.useCallback(() => {
+  const getFocusableElements = React16.useCallback(() => {
     if (!containerRef.current) return [];
     return Array.from(
       containerRef.current.querySelectorAll(focusableSelector)
@@ -1331,7 +1331,7 @@ function useFocusTrap(isActive, containerRef) {
       return el.offsetParent !== null;
     });
   }, [containerRef, focusableSelector]);
-  const handleKeyDown = React15.useCallback(
+  const handleKeyDown = React16.useCallback(
     (event) => {
       if (event.key !== "Tab") return;
       const focusableElements = getFocusableElements();
@@ -1352,7 +1352,7 @@ function useFocusTrap(isActive, containerRef) {
     },
     [getFocusableElements]
   );
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!isActive) return;
     previousActiveElement.current = document.activeElement;
     const focusableElements = getFocusableElements();
@@ -1383,12 +1383,12 @@ var Modal = ({
 }) => {
   const isMobile2 = useMediaQuery("(max-width: 500px)");
   const variant = explicitVariant ?? (isMobile2 ? "bottom-sheet" : "centered");
-  const dialogRef = React15.useRef(null);
-  const dialogId = React15.useId();
+  const dialogRef = React16.useRef(null);
+  const dialogId = React16.useId();
   const uiContext = useVolrUIOptional();
   const theme = uiContext?.theme ?? "light";
   useFocusTrap(open, dialogRef);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     const handleEscape = (e) => {
       if (e.key === "Escape" && open) {
         if (onEscapeKeyDown) {
@@ -1971,7 +1971,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 = React15__default.default.forwardRef(
+var Button = React16__default.default.forwardRef(
   ({ variant = "primary", size = "md", fullWidth, className, style, disabled, children, ...props }, ref) => {
     const { accentColor } = useVolrUI();
     const sizeStyle = sizeMap[size];
@@ -2172,11 +2172,11 @@ function PasskeyMigrationView({
   wrapInModal = true
 }) {
   const { t } = useI18n();
-  const [isMigrating, setIsMigrating] = React15.useState(false);
-  const [isComplete, setIsComplete] = React15.useState(false);
-  const [error, setError] = React15.useState(null);
+  const [isMigrating, setIsMigrating] = React16.useState(false);
+  const [isComplete, setIsComplete] = React16.useState(false);
+  const [error, setError] = React16.useState(null);
   const biometricType = getBiometricType();
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     const handler = (event) => {
       if (event.data?.type === "VOLR_MIGRATION_DONE") {
@@ -2187,7 +2187,7 @@ function PasskeyMigrationView({
     window.addEventListener("message", handler);
     return () => window.removeEventListener("message", handler);
   }, []);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (isComplete) {
       const timer = setTimeout(() => {
         if (onComplete) {
@@ -2211,7 +2211,7 @@ function PasskeyMigrationView({
       }
     }
   };
-  const handleDone = React15.useCallback(() => {
+  const handleDone = React16.useCallback(() => {
     if (onComplete) {
       onComplete();
     }
@@ -2308,22 +2308,22 @@ function PasskeyEnrollView({
     isEnrolling,
     error: enrollmentError
   } = react.usePasskeyEnrollment();
-  const [hasStarted, setHasStarted] = React15.useState(false);
-  const [errorMessage, setErrorMessage] = React15.useState(null);
-  const [isRefreshing, setIsRefreshing] = React15.useState(false);
+  const [hasStarted, setHasStarted] = React16.useState(false);
+  const [errorMessage, setErrorMessage] = React16.useState(null);
+  const [isRefreshing, setIsRefreshing] = React16.useState(false);
   const biometricType = getBiometricType();
-  const compatibility = React15.useMemo(() => react.checkPrfCompatibility(), []);
-  const [hasPrfError, setHasPrfError] = React15.useState(false);
-  const platformHint = React15.useMemo(
+  const compatibility = React16.useMemo(() => react.checkPrfCompatibility(), []);
+  const [hasPrfError, setHasPrfError] = React16.useState(false);
+  const platformHint = React16.useMemo(
     () => hasPrfError ? react.getPlatformHint(compatibility.platform) : { hintKey: "", noteKey: "" },
     [compatibility.platform, hasPrfError]
   );
   const hasPasskey = user?.keyStorageType === "passkey";
-  const currentDomain = React15.useMemo(() => {
+  const currentDomain = React16.useMemo(() => {
     if (typeof window === "undefined") return "localhost";
     return window.location.hostname;
   }, []);
-  const migrationInfo = React15.useMemo(() => {
+  const migrationInfo = React16.useMemo(() => {
     if (!user?.registeredPasskeys || user.registeredPasskeys.length === 0) {
       return { needsMigration: false, sourcePasskey: null };
     }
@@ -2336,7 +2336,7 @@ function PasskeyEnrollView({
     const sourcePasskey = user.registeredPasskeys[0];
     return { needsMigration: true, sourcePasskey };
   }, [user?.registeredPasskeys, currentDomain]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     console.log("[PasskeyEnrollView] User state:", {
       user,
       keyStorageType: user?.keyStorageType,
@@ -2347,7 +2347,7 @@ function PasskeyEnrollView({
       migrationInfo
     });
   }, [user, hasPasskey, currentDomain, migrationInfo]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (hasPasskey && !user?.evmAddress && !isRefreshing) {
       const refreshUserData = async () => {
         try {
@@ -2378,7 +2378,7 @@ function PasskeyEnrollView({
       refreshUserData();
     }
   }, [hasPasskey, user?.evmAddress, isRefreshing, client, setUser, user]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!user?.id) {
       const error = new Error("User ID is required for passkey enrollment");
       setErrorMessage(getUserFriendlyError(error, t));
@@ -2387,7 +2387,7 @@ function PasskeyEnrollView({
       }
     }
   }, [user, onError, t]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (enrollmentError) {
       const friendlyMessage = getUserFriendlyError(enrollmentError, t);
       setErrorMessage(friendlyMessage);
@@ -2666,7 +2666,7 @@ function MigrationTargetView({
   const biometricType = getBiometricType();
   const isProcessing = step !== "ready" && step !== "error" && step !== "success";
   const progress = STEP_PROGRESS2[step];
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (step === "success" && onAutoClose) {
       const timer = setTimeout(() => {
         onAutoClose();
@@ -2746,8 +2746,8 @@ function MpcConnectView({
     isConnecting,
     error: connectionError
   } = react.useMpcConnection();
-  const [errorMessage, setErrorMessage] = React15.useState(null);
-  React15.useEffect(() => {
+  const [errorMessage, setErrorMessage] = React16.useState(null);
+  React16.useEffect(() => {
     if (connectionError) {
       setErrorMessage(connectionError.message);
       if (onError) {
@@ -2755,7 +2755,7 @@ function MpcConnectView({
       }
     }
   }, [connectionError, onError]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     handleConnect();
   }, []);
   const handleConnect = async () => {
@@ -2986,9 +2986,9 @@ function PoweredBy() {
 }
 function EmailInlineInput({ onSubmit, accentColor }) {
   const { t } = useI18n();
-  const [email, setEmail] = React15.useState("");
-  const [error, setError] = React15.useState(null);
-  const [isLoading, setIsLoading] = React15.useState(false);
+  const [email, setEmail] = React16.useState("");
+  const [error, setError] = React16.useState(null);
+  const [isLoading, setIsLoading] = React16.useState(false);
   const handleSubmit = async (e) => {
     e.preventDefault();
     setError(null);
@@ -3112,14 +3112,14 @@ function SigninSelectScreen({
 function CodeInputScreen({ email, onSubmit, onResend }) {
   const { t } = useI18n();
   const { accentColor } = useVolrUI();
-  const [digits, setDigits] = React15.useState(Array(6).fill(""));
-  const [error, setError] = React15.useState(null);
-  const [isLoading, setIsLoading] = React15.useState(false);
-  const inputRefs = React15.useRef([]);
-  React15.useEffect(() => {
+  const [digits, setDigits] = React16.useState(Array(6).fill(""));
+  const [error, setError] = React16.useState(null);
+  const [isLoading, setIsLoading] = React16.useState(false);
+  const inputRefs = React16.useRef([]);
+  React16.useEffect(() => {
     inputRefs.current[0]?.focus();
   }, []);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     const code = digits.join("");
     if (code.length === 6 && !isLoading) {
       handleSubmit(code);
@@ -3231,7 +3231,7 @@ function CodeInputScreen({ email, onSubmit, onResend }) {
   ] });
 }
 var CopyButton = ({ text, className, onCopy }) => {
-  const [copied, setCopied] = React15.useState(false);
+  const [copied, setCopied] = React16.useState(false);
   const handleCopy = async () => {
     try {
       await navigator.clipboard.writeText(text);
@@ -3310,23 +3310,23 @@ function SiweLoginScreen({
     checkSiweSession,
     getSiweSignUrl
   } = react.useVolrLogin();
-  const [isLoading, setIsLoading] = React15.useState(false);
-  const [loadingWallet, setLoadingWallet] = React15.useState(null);
-  const [error, setError] = React15.useState(null);
-  const [providers, setProviders] = React15.useState([]);
-  const [isDetecting, setIsDetecting] = React15.useState(true);
-  const [hasLegacyWallet, setHasLegacyWallet] = React15.useState(false);
-  const [showOtherWallet, setShowOtherWallet] = React15.useState(false);
-  const [sessionUrl, setSessionUrl] = React15.useState(null);
-  const [isPolling, setIsPolling] = React15.useState(false);
-  const pollingRef = React15.useRef(null);
-  const sessionCreatedRef = React15.useRef(false);
-  React15.useEffect(() => {
+  const [isLoading, setIsLoading] = React16.useState(false);
+  const [loadingWallet, setLoadingWallet] = React16.useState(null);
+  const [error, setError] = React16.useState(null);
+  const [providers, setProviders] = React16.useState([]);
+  const [isDetecting, setIsDetecting] = React16.useState(true);
+  const [hasLegacyWallet, setHasLegacyWallet] = React16.useState(false);
+  const [showOtherWallet, setShowOtherWallet] = React16.useState(false);
+  const [sessionUrl, setSessionUrl] = React16.useState(null);
+  const [isPolling, setIsPolling] = React16.useState(false);
+  const pollingRef = React16.useRef(null);
+  const sessionCreatedRef = React16.useRef(false);
+  React16.useEffect(() => {
     return () => {
       if (pollingRef.current) clearInterval(pollingRef.current);
     };
   }, []);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (typeof window === "undefined") {
       setIsDetecting(false);
       return;
@@ -3352,7 +3352,7 @@ function SiweLoginScreen({
     };
   }, []);
   const hasAnyWallet = providers.length > 0 || hasLegacyWallet;
-  const createSession = React15.useCallback(async () => {
+  const createSession = React16.useCallback(async () => {
     if (sessionCreatedRef.current || sessionUrl) return;
     sessionCreatedRef.current = true;
     try {
@@ -3394,17 +3394,17 @@ function SiweLoginScreen({
       onError(err instanceof Error ? err : new Error("Failed to create session"));
     }
   }, [createSiweSession, getSiweSignUrl, checkSiweSession, onSuccess, onError, t, sessionUrl]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!isDetecting && !hasAnyWallet && !sessionUrl) {
       createSession();
     }
   }, [isDetecting, hasAnyWallet, sessionUrl, createSession]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (showOtherWallet && !sessionUrl) {
       createSession();
     }
   }, [showOtherWallet, sessionUrl, createSession]);
-  const handleWalletClick = React15.useCallback(async (provider, walletName, walletConnector) => {
+  const handleWalletClick = React16.useCallback(async (provider, walletName, walletConnector) => {
     setError(null);
     setIsLoading(true);
     setLoadingWallet(walletName);
@@ -3428,7 +3428,7 @@ function SiweLoginScreen({
       setLoadingWallet(null);
     }
   }, [signWithWallet, onSuccess, onError]);
-  const handleLegacyWalletClick = React15.useCallback(async () => {
+  const handleLegacyWalletClick = React16.useCallback(async () => {
     if (typeof window === "undefined" || !window.ethereum) return;
     const ethereum = window.ethereum;
     let walletName = "Wallet";
@@ -3437,7 +3437,7 @@ function SiweLoginScreen({
     else if (ethereum.isRabby) walletName = "Rabby";
     await handleWalletClick(ethereum, walletName);
   }, [handleWalletClick]);
-  const cancelOtherWallet = React15.useCallback(() => {
+  const cancelOtherWallet = React16.useCallback(() => {
     if (pollingRef.current) {
       clearInterval(pollingRef.current);
       pollingRef.current = null;
@@ -3584,13 +3584,13 @@ function SigninModal({ isOpen, onClose, onError }) {
   const { client } = react.useInternalAuth();
   const { appName, branding } = useVolrUI();
   const { requestEmailCode, verifyEmailCode, handleSocialLogin } = react.useVolrLogin();
-  const [currentScreen, setCurrentScreen] = React15.useState("method-select");
-  const [email, setEmail] = React15.useState("");
+  const [currentScreen, setCurrentScreen] = React16.useState("method-select");
+  const [email, setEmail] = React16.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";
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!isOpen) {
       setCurrentScreen("method-select");
       setEmail("");
@@ -3815,7 +3815,7 @@ function AssetSelectView({
     }) })
   ] });
 }
-var TextLinkButton = React15__default.default.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
+var TextLinkButton = React16__default.default.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     {
@@ -3944,23 +3944,23 @@ function WalletTransferView({
   const { config } = react.useVolrContext();
   const { client } = react.useInternalAuth();
   const { isDetecting, getWalletsForDisplay, hasWallet } = react.useEIP6963();
-  const [viewState, setViewState] = React15.useState("select-wallet");
-  const [selectedWallet, setSelectedWallet] = React15.useState(null);
-  const [connectedAddress, setConnectedAddress] = React15.useState(null);
-  const [balance, setBalance] = React15.useState(null);
-  const [amount, setAmount] = React15.useState("");
-  const [isConnecting, setIsConnecting] = React15.useState(false);
-  const [isTransferring, setIsTransferring] = React15.useState(false);
-  const [error, setError] = React15.useState(null);
-  const [chainName, setChainName] = React15.useState(null);
-  const [currentChainId, setCurrentChainId] = React15.useState(null);
+  const [viewState, setViewState] = React16.useState("select-wallet");
+  const [selectedWallet, setSelectedWallet] = React16.useState(null);
+  const [connectedAddress, setConnectedAddress] = React16.useState(null);
+  const [balance, setBalance] = React16.useState(null);
+  const [amount, setAmount] = React16.useState("");
+  const [isConnecting, setIsConnecting] = React16.useState(false);
+  const [isTransferring, setIsTransferring] = React16.useState(false);
+  const [error, setError] = React16.useState(null);
+  const [chainName, setChainName] = React16.useState(null);
+  const [currentChainId, setCurrentChainId] = React16.useState(null);
   const tokenSymbol = asset === "native" ? "ETH" : asset.symbol;
   const decimals = asset === "native" ? 18 : asset.decimals;
-  const getNetworkInfo = React15.useCallback(
+  const getNetworkInfo = React16.useCallback(
     react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
     [client, config.rpcOverrides]
   );
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     let cancelled = false;
     const loadChainName = async () => {
       try {
@@ -3975,7 +3975,7 @@ function WalletTransferView({
       cancelled = true;
     };
   }, [getNetworkInfo, chainId]);
-  const connectWallet = React15.useCallback(async (wallet) => {
+  const connectWallet = React16.useCallback(async (wallet) => {
     setIsConnecting(true);
     setError(null);
     try {
@@ -3999,7 +3999,7 @@ function WalletTransferView({
       setIsConnecting(false);
     }
   }, [chainId, asset]);
-  const fetchBalance = React15.useCallback(async (provider, address, currentChain) => {
+  const fetchBalance = React16.useCallback(async (provider, address, currentChain) => {
     try {
       if (currentChain !== chainId) {
         setBalance(null);
@@ -4024,7 +4024,7 @@ function WalletTransferView({
       setBalance(BigInt(0));
     }
   }, [chainId, asset]);
-  const switchNetwork = React15.useCallback(async () => {
+  const switchNetwork = React16.useCallback(async () => {
     if (!selectedWallet?.provider) return;
     try {
       await selectedWallet.provider.request({
@@ -4042,7 +4042,7 @@ function WalletTransferView({
       setError(err instanceof Error ? err.message : "Failed to switch network");
     }
   }, [selectedWallet, chainId, connectedAddress, fetchBalance]);
-  const executeTransfer = React15.useCallback(async () => {
+  const executeTransfer = React16.useCallback(async () => {
     if (!selectedWallet?.provider || !connectedAddress || !amount) return;
     setIsTransferring(true);
     setError(null);
@@ -4085,7 +4085,7 @@ function WalletTransferView({
       setIsTransferring(false);
     }
   }, [selectedWallet, connectedAddress, amount, decimals, balance, asset, destinationAddress, onSuccess, t]);
-  const setMaxAmount = React15.useCallback(() => {
+  const setMaxAmount = React16.useCallback(() => {
     if (balance !== null) {
       const formatted = formatUnits(balance, decimals);
       setAmount(formatted);
@@ -4451,7 +4451,7 @@ var DepositCompletedToast = ({
   symbol
 }) => {
   const { t } = useI18n();
-  const [expanded, setExpanded] = React15.useState(false);
+  const [expanded, setExpanded] = React16.useState(false);
   const formatAmount = (amount) => {
     const divisor = BigInt(10 ** decimals);
     const whole = amount / divisor;
@@ -4611,11 +4611,11 @@ function DepositQRView(props) {
   const { t } = useI18n();
   const { config } = react.useVolrContext();
   const { client } = react.useInternalAuth();
-  const [chainName, setChainName] = React15.useState(null);
-  const [showOtherTokenModal, setShowOtherTokenModal] = React15.useState(false);
-  const [showToast, setShowToast] = React15.useState(false);
-  const [toastData, setToastData] = React15.useState(null);
-  const [viewMode, setViewMode] = React15.useState("qr");
+  const [chainName, setChainName] = React16.useState(null);
+  const [showOtherTokenModal, setShowOtherTokenModal] = React16.useState(false);
+  const [showToast, setShowToast] = React16.useState(false);
+  const [toastData, setToastData] = React16.useState(null);
+  const [viewMode, setViewMode] = React16.useState("qr");
   const eip681 = `ethereum:${props.address}`;
   const status = react.useDepositListener({
     chainId: props.chainId,
@@ -4628,7 +4628,7 @@ function DepositQRView(props) {
     },
     address: props.address
   });
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (status.state === "detected") {
       setToastData({
         previousBalance: status.previousBalance,
@@ -4639,11 +4639,11 @@ function DepositQRView(props) {
       props.onDepositDetected?.();
     }
   }, [status, props.onDepositDetected]);
-  const getNetworkInfo = React15.useCallback(
+  const getNetworkInfo = React16.useCallback(
     react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
     [client, config.rpcOverrides]
   );
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     let cancelled = false;
     const loadChainName = async () => {
       try {
@@ -4883,6 +4883,111 @@ function DepositModalBody({
     }
   );
 }
+var STORAGE_KEY = "volr:preferred-currency";
+var PreferredCurrencyContext = React16.createContext(null);
+function PreferredCurrencyProvider({
+  children,
+  apiUrl,
+  defaultCurrency
+}) {
+  const [currency, setCurrencyState] = React16.useState(() => {
+    if (typeof window !== "undefined") {
+      const stored = localStorage.getItem(STORAGE_KEY);
+      if (stored) return stored;
+    }
+    return defaultCurrency || react.detectPreferredCurrency();
+  });
+  const [supportedCurrencies, setSupportedCurrencies] = React16.useState([]);
+  const [isLoading, setIsLoading] = React16.useState(true);
+  React16.useEffect(() => {
+    const fetchCurrencies = async () => {
+      if (!apiUrl) {
+        setSupportedCurrencies([
+          { code: "USD", symbol: "$", name: "US Dollar", decimalPlaces: 2 },
+          { code: "KRW", symbol: "\u20A9", name: "Korean Won", decimalPlaces: 0 },
+          { code: "EUR", symbol: "\u20AC", name: "Euro", decimalPlaces: 2 }
+        ]);
+        setIsLoading(false);
+        return;
+      }
+      try {
+        const response = await fetch(`${apiUrl}/public/fiat-currencies`);
+        if (!response.ok) throw new Error("Failed to fetch currencies");
+        const data = await response.json();
+        if (data.ok && Array.isArray(data.data)) {
+          setSupportedCurrencies(data.data);
+          const currentSupported = data.data.some(
+            (c) => c.code === currency
+          );
+          if (!currentSupported && data.data.length > 0) {
+            const detected = react.detectPreferredCurrency();
+            const detectedSupported = data.data.find(
+              (c) => c.code === detected
+            );
+            setCurrencyState(detectedSupported?.code || data.data[0].code);
+          }
+        }
+      } catch (error) {
+        console.warn("[PreferredCurrencyProvider] Failed to fetch currencies:", error);
+        setSupportedCurrencies([
+          { code: "USD", symbol: "$", name: "US Dollar", decimalPlaces: 2 },
+          { code: "KRW", symbol: "\u20A9", name: "Korean Won", decimalPlaces: 0 },
+          { code: "EUR", symbol: "\u20AC", name: "Euro", decimalPlaces: 2 }
+        ]);
+      } finally {
+        setIsLoading(false);
+      }
+    };
+    fetchCurrencies();
+  }, [apiUrl, currency]);
+  const setCurrency = React16.useCallback((code) => {
+    const normalizedCode = code.toUpperCase();
+    setCurrencyState(normalizedCode);
+    if (typeof window !== "undefined") {
+      localStorage.setItem(STORAGE_KEY, normalizedCode);
+    }
+  }, []);
+  const formatAmount = React16.useCallback(
+    (amount) => {
+      return react.formatCurrency(amount, currency);
+    },
+    [currency]
+  );
+  const formatInCurrency = React16.useCallback((amount, currencyCode) => {
+    return react.formatCurrency(amount, currencyCode);
+  }, []);
+  const getCurrencyInfo = React16.useCallback(
+    (code) => {
+      return supportedCurrencies.find((c) => c.code === code.toUpperCase());
+    },
+    [supportedCurrencies]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    PreferredCurrencyContext.Provider,
+    {
+      value: {
+        currency,
+        setCurrency,
+        supportedCurrencies,
+        isLoading,
+        formatAmount,
+        formatInCurrency,
+        getCurrencyInfo
+      },
+      children
+    }
+  );
+}
+function usePreferredCurrency() {
+  const context = React16.useContext(PreferredCurrencyContext);
+  if (!context) {
+    throw new Error("usePreferredCurrency must be used within PreferredCurrencyProvider");
+  }
+  return context;
+}
+function usePreferredCurrencyOptional() {
+  return React16.useContext(PreferredCurrencyContext);
+}
 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",
@@ -4938,12 +5043,8 @@ function AccountMainView({
   isRefreshing
 }) {
   const { t } = useI18n();
-  const formattedUsd = isLoading ? "\u2014" : totalUsd.toLocaleString("en-US", {
-    style: "currency",
-    currency: "USD",
-    minimumFractionDigits: 2,
-    maximumFractionDigits: 2
-  });
+  const currencyCtx = usePreferredCurrencyOptional();
+  const formattedUsd = isLoading ? "\u2014" : currencyCtx ? currencyCtx.formatAmount(totalUsd) : react.formatCurrency(totalUsd, "USD");
   const lastUpdatedLabel = lastUpdatedAt ? lastUpdatedAt.toLocaleTimeString(void 0, {
     hour: "2-digit",
     minute: "2-digit"
@@ -5036,6 +5137,8 @@ function AccountMainView({
   ] });
 }
 function TokenRow({ token }) {
+  const currencyCtx = usePreferredCurrencyOptional();
+  const formattedBalanceUsd = token.balanceUsd !== void 0 && token.balanceUsd > 0 ? currencyCtx ? currencyCtx.formatAmount(token.balanceUsd) : react.formatCurrency(token.balanceUsd, "USD") : null;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:py-3 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", 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:overflow-hidden volr:shrink-0", children: token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -5056,10 +5159,7 @@ function TokenRow({ token }) {
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-right", children: token.isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" }) }) : token.error ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-red-500", children: "Error" }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.balance }),
-      token.balanceUsd !== void 0 && token.balanceUsd > 0 && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
-        "$",
-        token.balanceUsd.toFixed(2)
-      ] })
+      formattedBalanceUsd && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400", children: formattedBalanceUsd })
     ] }) })
   ] });
 }
@@ -5086,7 +5186,7 @@ function BalanceDetailView({
     /* @__PURE__ */ jsxRuntime.jsx("div", { children: balances.map((token) => /* @__PURE__ */ jsxRuntime.jsx(TokenRow, { token }, token.id)) })
   ] });
 }
-var Input = React15__default.default.forwardRef(
+var Input = React16__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 }),
@@ -5118,23 +5218,23 @@ function WithdrawView({
   const { t } = useI18n();
   const { withdraw, isWithdrawing, result, error, reset } = react.useWithdraw();
   const { client } = react.useInternalAuth();
-  const [step, setStep] = React15.useState("select");
-  const [selectedTokenId, setSelectedTokenId] = React15.useState(null);
-  const [toAddress, setToAddress] = React15.useState("");
-  const [amount, setAmount] = React15.useState("");
-  const [useConnectedWallet, setUseConnectedWallet] = React15.useState(false);
-  const [blockExplorerUrl, setBlockExplorerUrl] = React15.useState(null);
-  const selectedToken = React15.useMemo(
+  const [step, setStep] = React16.useState("select");
+  const [selectedTokenId, setSelectedTokenId] = React16.useState(null);
+  const [toAddress, setToAddress] = React16.useState("");
+  const [amount, setAmount] = React16.useState("");
+  const [useConnectedWallet, setUseConnectedWallet] = React16.useState(false);
+  const [blockExplorerUrl, setBlockExplorerUrl] = React16.useState(null);
+  const selectedToken = React16.useMemo(
     () => balances.find((b) => b.id === selectedTokenId),
     [balances, selectedTokenId]
   );
   const selectedChainId = selectedToken?.chainId ?? null;
-  const connectedAddress = React15.useMemo(() => {
+  const connectedAddress = React16.useMemo(() => {
     if (!connectedWallet) return null;
     const parts = connectedWallet.split(":");
     return parts.length >= 2 ? parts[1] : null;
   }, [connectedWallet]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!selectedChainId) {
       setBlockExplorerUrl(null);
       return;
@@ -5155,7 +5255,7 @@ function WithdrawView({
       cancelled = true;
     };
   }, [client, selectedChainId]);
-  const explorerTxUrl = React15.useMemo(() => {
+  const explorerTxUrl = React16.useMemo(() => {
     if (!blockExplorerUrl || !result?.txHash) return null;
     const trimmedBase = blockExplorerUrl.replace(/\/$/, "");
     return `${trimmedBase}/tx/${result.txHash}`;
@@ -5194,7 +5294,7 @@ function WithdrawView({
     setAmount("");
     setUseConnectedWallet(false);
   };
-  const isAmountValid = React15.useMemo(() => {
+  const isAmountValid = React16.useMemo(() => {
     if (!amount || !selectedToken) return false;
     const num = parseFloat(amount);
     if (isNaN(num) || num <= 0) return false;
@@ -5474,6 +5574,7 @@ function ChevronRightIcon({ className }) {
 }
 function PaymentRow({ payment, onClick }) {
   const { t } = useI18n();
+  const currencyCtx = usePreferredCurrencyOptional();
   const date = new Date(payment.createdAt);
   const formattedDate = date.toLocaleDateString(void 0, {
     month: "short",
@@ -5488,6 +5589,7 @@ function PaymentRow({ payment, onClick }) {
     CANCELLED: "volr:bg-slate-100 volr:text-slate-500",
     EXPIRED: "volr:bg-slate-100 volr:text-slate-500"
   };
+  const formattedUsd = payment.totalUsd ? currencyCtx ? currencyCtx.formatAmount(parseFloat(payment.totalUsd)) : react.formatCurrency(parseFloat(payment.totalUsd), "USD") : null;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     {
@@ -5515,10 +5617,7 @@ function PaymentRow({ payment, onClick }) {
               " ",
               payment.token.symbol
             ] }),
-            payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
-              "$",
-              parseFloat(payment.totalUsd).toFixed(2)
-            ] })
+            formattedUsd && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400", children: formattedUsd })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-300" })
         ] })
@@ -5529,10 +5628,10 @@ function PaymentRow({ payment, onClick }) {
 function PaymentHistoryView({ onSelectPayment }) {
   const { t } = useI18n();
   const { getPaymentHistory, isLoading: isApiLoading } = react.useVolrPaymentApi();
-  const [payments, setPayments] = React15.useState([]);
-  const [isLoading, setIsLoading] = React15.useState(true);
-  const [error, setError] = React15.useState(null);
-  React15.useEffect(() => {
+  const [payments, setPayments] = React16.useState([]);
+  const [isLoading, setIsLoading] = React16.useState(true);
+  const [error, setError] = React16.useState(null);
+  React16.useEffect(() => {
     setIsLoading(true);
     setError(null);
     getPaymentHistory({ take: 20 }).then((result) => {
@@ -5588,6 +5687,8 @@ function DetailRow({ label, value, copyable, mono, copyText }) {
 }
 function PaymentDetailView({ payment }) {
   const { t } = useI18n();
+  const currencyCtx = usePreferredCurrencyOptional();
+  const formattedUsd = payment.totalUsd ? currencyCtx ? currencyCtx.formatAmount(parseFloat(payment.totalUsd)) : react.formatCurrency(parseFloat(payment.totalUsd), "USD") : null;
   const createdDate = new Date(payment.createdAt);
   const formattedCreatedAt = createdDate.toLocaleString(void 0, {
     year: "numeric",
@@ -5636,10 +5737,9 @@ function PaymentDetailView({ payment }) {
         " ",
         payment.token.symbol
       ] }),
-      payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500", children: [
-        "\u2248 $",
-        parseFloat(payment.totalUsd).toFixed(2),
-        " USD"
+      formattedUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500", children: [
+        "\u2248 ",
+        formattedUsd
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-1", children: [
@@ -5772,21 +5872,21 @@ 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] = React15.useState("main");
-  const [selectedPayment, setSelectedPayment] = React15.useState(null);
-  const [isLoggingOut, setIsLoggingOut] = React15.useState(false);
-  const [lastUpdatedAt, setLastUpdatedAt] = React15.useState(null);
-  const [isRefreshing, setIsRefreshing] = React15.useState(false);
-  const prevUserRef = React15.useRef(user ?? null);
-  const refreshInFlightRef = React15.useRef(false);
-  const lastRefreshRef = React15.useRef(0);
-  const [closingAfterLogin, setClosingAfterLogin] = React15.useState(false);
-  const [setupStep, setSetupStep] = React15.useState("prompt");
-  const [depositAssets, setDepositAssets] = React15.useState([]);
-  const [depositLoading, setDepositLoading] = React15.useState(false);
-  const [depositError, setDepositError] = React15.useState(null);
-  const [depositSelectedIdx, setDepositSelectedIdx] = React15.useState(-1);
-  const refreshBalances = React15.useCallback(async () => {
+  const [currentView, setCurrentView] = React16.useState("main");
+  const [selectedPayment, setSelectedPayment] = React16.useState(null);
+  const [isLoggingOut, setIsLoggingOut] = React16.useState(false);
+  const [lastUpdatedAt, setLastUpdatedAt] = React16.useState(null);
+  const [isRefreshing, setIsRefreshing] = React16.useState(false);
+  const prevUserRef = React16.useRef(user ?? null);
+  const refreshInFlightRef = React16.useRef(false);
+  const lastRefreshRef = React16.useRef(0);
+  const [closingAfterLogin, setClosingAfterLogin] = React16.useState(false);
+  const [setupStep, setSetupStep] = React16.useState("prompt");
+  const [depositAssets, setDepositAssets] = React16.useState([]);
+  const [depositLoading, setDepositLoading] = React16.useState(false);
+  const [depositError, setDepositError] = React16.useState(null);
+  const [depositSelectedIdx, setDepositSelectedIdx] = React16.useState(-1);
+  const refreshBalances = React16.useCallback(async () => {
     if (!isOpen) return;
     const now = Date.now();
     if (refreshInFlightRef.current) return;
@@ -5806,10 +5906,10 @@ function AccountModal({ isOpen, onClose, onError }) {
       setIsRefreshing(false);
     }
   }, [isOpen, refresh]);
-  const handleManualRefresh = React15.useCallback(() => {
+  const handleManualRefresh = React16.useCallback(() => {
     void refreshBalances();
   }, [refreshBalances]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (currentView !== "deposit" || !isOpen) return;
     setDepositLoading(true);
     setDepositError(null);
@@ -5826,11 +5926,11 @@ function AccountModal({ isOpen, onClose, onError }) {
       setDepositLoading(false);
     });
   }, [currentView, isOpen, client]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!isOpen) return;
     void refreshBalances();
   }, [isOpen, currentView, refreshBalances]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!isOpen || typeof document === "undefined") return;
     const handleFocus = () => {
       if (document.visibilityState === "visible") {
@@ -5844,7 +5944,7 @@ function AccountModal({ isOpen, onClose, onError }) {
       document.removeEventListener("visibilitychange", handleFocus);
     };
   }, [isOpen, refreshBalances]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!isOpen) return;
     const intervalId = window.setInterval(() => {
       void refreshBalances();
@@ -5853,7 +5953,7 @@ function AccountModal({ isOpen, onClose, onError }) {
       clearInterval(intervalId);
     };
   }, [isOpen, refreshBalances]);
-  const handleOpenChange = React15.useCallback((open) => {
+  const handleOpenChange = React16.useCallback((open) => {
     if (!open) {
       onClose();
       setTimeout(() => {
@@ -5863,7 +5963,7 @@ function AccountModal({ isOpen, onClose, onError }) {
       }, 200);
     }
   }, [onClose]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!isOpen) {
       setClosingAfterLogin(false);
       prevUserRef.current = user ?? null;
@@ -6034,11 +6134,11 @@ var DepositModal = ({
 }) => {
   const { user } = react.useVolrContext();
   const { client } = react.useInternalAuth();
-  const [depositAssets, setDepositAssets] = React15.useState([]);
-  const [isLoading, setIsLoading] = React15.useState(true);
-  const [error, setError] = React15.useState(null);
-  const [selectedIdx, setSelectedIdx] = React15.useState(-1);
-  React15.useEffect(() => {
+  const [depositAssets, setDepositAssets] = React16.useState([]);
+  const [isLoading, setIsLoading] = React16.useState(true);
+  const [error, setError] = React16.useState(null);
+  const [selectedIdx, setSelectedIdx] = React16.useState(-1);
+  React16.useEffect(() => {
     if (!open) return;
     setIsLoading(true);
     setError(null);
@@ -6065,12 +6165,12 @@ var DepositModal = ({
     if (depositAssets.length === 1) return 0;
     return -1;
   };
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (open && !isLoading && depositAssets.length > 0) {
       setSelectedIdx(getInitialIndex());
     }
   }, [open, isLoading, depositAssets.length, asset]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!open) {
       setSelectedIdx(-1);
     }
@@ -6228,7 +6328,7 @@ function usePaymentModalState(open, onOpenChange) {
   const { evm } = react.useVolr();
   const { paymentOptions } = useVolrModal();
   const { createPayment, updatePaymentToProcessing, pollPaymentStatus, failPendingPayment } = react.useVolrPaymentApi();
-  const [state, dispatch] = React15.useReducer(paymentModalReducer, initialState);
+  const [state, dispatch] = React16.useReducer(paymentModalReducer, initialState);
   const tokensWithBalances = state.tokens.map((token) => {
     const balanceData = state.tokenBalances.get(token.id);
     return {
@@ -6240,7 +6340,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 = React15.useCallback(
+  const fetchTokenBalance = React16.useCallback(
     async (token) => {
       if (!user?.evmAddress) {
         dispatch({
@@ -6288,20 +6388,20 @@ function usePaymentModalState(open, onOpenChange) {
     },
     [user, evm]
   );
-  const fetchAllBalances = React15.useCallback(
+  const fetchAllBalances = React16.useCallback(
     async (tokens) => {
       await Promise.all(tokens.map((token) => fetchTokenBalance(token)));
     },
     [fetchTokenBalance]
   );
-  const fetchBranding = React15.useCallback(async () => {
+  const fetchBranding = React16.useCallback(async () => {
     try {
       const response = await client.get("/auth/branding");
       dispatch({ type: "SET_LOGO_URL", logoUrl: response.logoUrl });
     } catch {
     }
   }, [client]);
-  const fetchPaymentConfig = React15.useCallback(async () => {
+  const fetchPaymentConfig = React16.useCallback(async () => {
     dispatch({ type: "SET_CONFIG_LOADING", loading: true });
     try {
       const response = await client.get("/payments/config");
@@ -6318,7 +6418,7 @@ function usePaymentModalState(open, onOpenChange) {
       dispatch({ type: "SET_CONFIG_LOADING", loading: false });
     }
   }, [client, fetchAllBalances]);
-  const selectBestToken = React15.useCallback(() => {
+  const selectBestToken = React16.useCallback(() => {
     if (state.tokens.length === 0) return;
     if (state.selectedTokenId) return;
     let bestTokenId = state.tokens[0].id;
@@ -6332,7 +6432,7 @@ function usePaymentModalState(open, onOpenChange) {
     }
     dispatch({ type: "SELECT_TOKEN", tokenId: bestTokenId });
   }, [state.tokens, state.tokenBalances, state.selectedTokenId]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (open && paymentOptions?.options) {
       if (state.step === "processing" || state.step === "result") {
         return;
@@ -6344,15 +6444,15 @@ function usePaymentModalState(open, onOpenChange) {
       dispatch({ type: "RESET" });
     }
   }, [open, paymentOptions?.options?.amount]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!isBalanceLoading && state.tokens.length > 0 && !state.selectedTokenId) {
       selectBestToken();
     }
   }, [isBalanceLoading, state.tokens.length, state.selectedTokenId, selectBestToken]);
-  const handleSelectToken = React15.useCallback((tokenId) => {
+  const handleSelectToken = React16.useCallback((tokenId) => {
     dispatch({ type: "SELECT_TOKEN", tokenId });
   }, []);
-  const handleWalletBack = React15.useCallback(() => {
+  const handleWalletBack = React16.useCallback(() => {
     if (state.step !== "wallet") {
       return;
     }
@@ -6362,10 +6462,10 @@ function usePaymentModalState(open, onOpenChange) {
     }
     dispatch({ type: "SHOW_WALLET", walletStep: "choice" });
   }, [state.step, state.walletStep]);
-  const handleChooseCreateAccount = React15.useCallback(() => {
+  const handleChooseCreateAccount = React16.useCallback(() => {
     dispatch({ type: "SHOW_WALLET", walletStep: "create-account" });
   }, []);
-  const saveExternalWalletPreference = React15.useCallback(async () => {
+  const saveExternalWalletPreference = React16.useCallback(async () => {
     if (!user?.id) return;
     if (user.externalWalletPreferred) return;
     try {
@@ -6380,11 +6480,11 @@ function usePaymentModalState(open, onOpenChange) {
       setUser({ ...user, externalWalletPreferred: true });
     }
   }, [client, user, setUser]);
-  const handleChooseExternalWallet = React15.useCallback(() => {
+  const handleChooseExternalWallet = React16.useCallback(() => {
     void saveExternalWalletPreference();
     dispatch({ type: "SHOW_WALLET", walletStep: "external-wallet" });
   }, [saveExternalWalletPreference]);
-  const handlePay = React15.useCallback(async () => {
+  const handlePay = React16.useCallback(async () => {
     const { payOptions, receiverAddress, selectedTokenId } = state;
     if (!payOptions || !paymentOptions || !receiverAddress || !selectedTokenId) {
       return;
@@ -6506,7 +6606,7 @@ function usePaymentModalState(open, onOpenChange) {
     pollPaymentStatus,
     failPendingPayment
   ]);
-  const handleExternalWalletConnected = React15.useCallback(
+  const handleExternalWalletConnected = React16.useCallback(
     async ({ provider, address }) => {
       const { payOptions, receiverAddress, selectedTokenId } = state;
       if (!payOptions || !paymentOptions || !receiverAddress || !selectedTokenId) {
@@ -6651,10 +6751,10 @@ function usePaymentModalState(open, onOpenChange) {
       failPendingPayment
     ]
   );
-  const handleDeposit = React15.useCallback(() => {
+  const handleDeposit = React16.useCallback(() => {
     dispatch({ type: "SHOW_DEPOSIT" });
   }, []);
-  const handleDepositClose = React15.useCallback(
+  const handleDepositClose = React16.useCallback(
     (depositOpen) => {
       if (!depositOpen) {
         dispatch({ type: "HIDE_DEPOSIT" });
@@ -6665,19 +6765,19 @@ function usePaymentModalState(open, onOpenChange) {
     },
     [state.tokens, fetchAllBalances]
   );
-  const handleDone = React15.useCallback(() => {
+  const handleDone = React16.useCallback(() => {
     if (state.createdPayment?.status === "CONFIRMED") {
       paymentOptions?.onComplete?.(state.createdPayment);
     }
     onOpenChange(false);
   }, [state.createdPayment, paymentOptions, onOpenChange]);
-  const handleRetry = React15.useCallback(() => {
+  const handleRetry = React16.useCallback(() => {
     dispatch({ type: "RETRY" });
     if (state.tokens.length > 0) {
       fetchAllBalances(state.tokens);
     }
   }, [state.tokens, fetchAllBalances]);
-  const handleClose = React15.useCallback(() => {
+  const handleClose = React16.useCallback(() => {
     if (state.step === "processing") {
       return;
     }
@@ -6686,7 +6786,7 @@ function usePaymentModalState(open, onOpenChange) {
     }
     onOpenChange(false);
   }, [state.step, paymentOptions, onOpenChange]);
-  const handleReport = React15.useCallback(async () => {
+  const handleReport = React16.useCallback(async () => {
     const { createdPayment, error, step, txHash, selectedTokenId } = state;
     const tokenInfo = state.tokens.find((t) => t.id === selectedTokenId);
     if (!createdPayment || !error) return;
@@ -6845,10 +6945,10 @@ var TokenSelector = ({
   onSelect,
   disabled = false
 }) => {
-  const [isOpen, setIsOpen] = React15.useState(false);
-  const dropdownRef = React15.useRef(null);
+  const [isOpen, setIsOpen] = React16.useState(false);
+  const dropdownRef = React16.useRef(null);
   const selectedToken = tokens.find((t) => t.id === selectedTokenId);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     const handleClickOutside = (event) => {
       if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
         setIsOpen(false);
@@ -7215,9 +7315,11 @@ var PaymentResultView = ({
   onReport
 }) => {
   const { t } = useI18n();
+  const currencyCtx = usePreferredCurrencyOptional();
   const isSuccess = payment.status === "CONFIRMED";
   payment.status === "FAILED" || !!error;
   const isInAppBrowserError = error?.code === "INAPP_BROWSER_NOT_SUPPORTED";
+  const formattedUsd = payment.totalUsd ? currencyCtx ? currencyCtx.formatAmount(parseFloat(payment.totalUsd)) : react.formatCurrency(parseFloat(payment.totalUsd), "USD") : null;
   const handleOpenExternalBrowser = () => {
     if (typeof window === "undefined") return;
     window.open(window.location.href, "_system");
@@ -7271,12 +7373,9 @@ var PaymentResultView = ({
           payment.token.symbol
         ] })
       ] }),
-      payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-sm", children: [
+      formattedUsd && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-sm", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("payment.result.usdValueLabel") }),
-        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-slate-600", children: [
-          "$",
-          parseFloat(payment.totalUsd).toFixed(2)
-        ] })
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-600", children: formattedUsd })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-sm", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("payment.result.transactionLabel") }),
@@ -7385,9 +7484,9 @@ function PaymentExternalWalletView({
 }) {
   const { t } = useI18n();
   const { isDetecting, getWalletsForDisplay, hasWallet } = react.useEIP6963();
-  const wallets = React15.useMemo(() => getWalletsForDisplay(), [getWalletsForDisplay]);
-  const [isConnecting, setIsConnecting] = React15.useState(false);
-  const [error, setError] = React15.useState(null);
+  const wallets = React16.useMemo(() => getWalletsForDisplay(), [getWalletsForDisplay]);
+  const [isConnecting, setIsConnecting] = React16.useState(false);
+  const [error, setError] = React16.useState(null);
   const connect = async (wallet) => {
     setIsConnecting(true);
     setError(null);
@@ -7493,8 +7592,8 @@ var PaymentModal = ({
   const resolvedPermitType = selectedToken?.permitType ?? (selectedToken?.permitSupported ? "EIP2612" : "NONE");
   const externalWalletTokenSupported = selectedToken && selectedToken.address !== "native" && resolvedPermitType === "EIP2612";
   const showExternalWalletOption = externalWalletAllowed && externalWalletTokenSupported;
-  const permit2WarnedRef = React15__default.default.useRef(false);
-  React15__default.default.useEffect(() => {
+  const permit2WarnedRef = React16__default.default.useRef(false);
+  React16__default.default.useEffect(() => {
     if (!permit2WarnedRef.current && externalWalletAllowed && resolvedPermitType === "PERMIT2" && !selectedToken?.permit2Address) {
       console.warn(
         `[volr/react-ui] External wallet payment hidden: permit2Address is not configured for chain ${selectedToken?.chainId}.`
@@ -7608,19 +7707,19 @@ var PaymentModal = ({
     )
   ] });
 };
-var SignRequestContext = React15.createContext(null);
+var SignRequestContext = React16.createContext(null);
 function SignRequestProvider({ children }) {
-  const [pendingRequest, setPendingRequest] = React15.useState(null);
-  const resolveRef = React15.useRef(null);
-  const rejectRef = React15.useRef(null);
-  const requestSign = React15.useCallback((request) => {
+  const [pendingRequest, setPendingRequest] = React16.useState(null);
+  const resolveRef = React16.useRef(null);
+  const rejectRef = React16.useRef(null);
+  const requestSign = React16.useCallback((request) => {
     return new Promise((resolve, reject2) => {
       setPendingRequest(request);
       resolveRef.current = resolve;
       rejectRef.current = reject2;
     });
   }, []);
-  const approve = React15.useCallback(() => {
+  const approve = React16.useCallback(() => {
     if (resolveRef.current) {
       resolveRef.current();
       resolveRef.current = null;
@@ -7628,7 +7727,7 @@ function SignRequestProvider({ children }) {
     }
     setPendingRequest(null);
   }, []);
-  const reject = React15.useCallback(() => {
+  const reject = React16.useCallback(() => {
     if (rejectRef.current) {
       rejectRef.current(new Error("Sign request cancelled by user"));
       resolveRef.current = null;
@@ -7650,7 +7749,7 @@ function SignRequestProvider({ children }) {
   );
 }
 function useSignRequest() {
-  const context = React15.useContext(SignRequestContext);
+  const context = React16.useContext(SignRequestContext);
   if (!context) {
     throw new Error("useSignRequest must be used within SignRequestProvider");
   }
@@ -7659,7 +7758,7 @@ function useSignRequest() {
   };
 }
 function useSignRequestInternal() {
-  const context = React15.useContext(SignRequestContext);
+  const context = React16.useContext(SignRequestContext);
   if (!context) {
     throw new Error("useSignRequestInternal must be used within SignRequestProvider");
   }
@@ -7694,7 +7793,7 @@ function MessageSignView({ message }) {
   ] });
 }
 function TypedDataSignView({ typedData }) {
-  const [showRawData, setShowRawData] = React15.useState(false);
+  const [showRawData, setShowRawData] = React16.useState(false);
   const { domain, message } = typedData;
   const appName = domain.name;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-4", children: [
@@ -7840,12 +7939,12 @@ function SignRequestModal({ open, onOpenChange }) {
     }
   );
 }
-var WalletRequiredContext = React15.createContext(null);
+var WalletRequiredContext = React16.createContext(null);
 function WalletRequiredProvider({ children }) {
-  const [pendingRequest, setPendingRequest] = React15.useState(null);
-  const resolveRef = React15.useRef(null);
-  const rejectRef = React15.useRef(null);
-  const requestWallet = React15.useCallback(
+  const [pendingRequest, setPendingRequest] = React16.useState(null);
+  const resolveRef = React16.useRef(null);
+  const rejectRef = React16.useRef(null);
+  const requestWallet = React16.useCallback(
     (request) => {
       return new Promise((resolve2, reject2) => {
         setPendingRequest(request);
@@ -7855,7 +7954,7 @@ function WalletRequiredProvider({ children }) {
     },
     []
   );
-  const resolve = React15.useCallback((provider) => {
+  const resolve = React16.useCallback((provider) => {
     if (resolveRef.current) {
       resolveRef.current(provider);
       resolveRef.current = null;
@@ -7863,7 +7962,7 @@ function WalletRequiredProvider({ children }) {
     }
     setPendingRequest(null);
   }, []);
-  const reject = React15.useCallback((error) => {
+  const reject = React16.useCallback((error) => {
     if (rejectRef.current) {
       rejectRef.current(error);
       resolveRef.current = null;
@@ -7880,14 +7979,14 @@ function WalletRequiredProvider({ children }) {
   );
 }
 function useWalletRequired() {
-  const ctx = React15.useContext(WalletRequiredContext);
+  const ctx = React16.useContext(WalletRequiredContext);
   if (!ctx) {
     throw new Error("useWalletRequired must be used within WalletRequiredProvider");
   }
   return { requestWallet: ctx.requestWallet };
 }
 function useWalletRequiredInternal() {
-  const ctx = React15.useContext(WalletRequiredContext);
+  const ctx = React16.useContext(WalletRequiredContext);
   if (!ctx) {
     throw new Error(
       "useWalletRequiredInternal must be used within WalletRequiredProvider"
@@ -7900,17 +7999,17 @@ function WalletRequiredModal() {
   const { pendingRequest, resolve, reject } = useWalletRequiredInternal();
   const { user, provider } = react.useVolrContext();
   const { keyStorageType } = useVolrUI();
-  const [step, setStep] = React15.useState("notice");
-  const providerRef = React15.useRef(provider);
-  React15.useEffect(() => {
+  const [step, setStep] = React16.useState("notice");
+  const providerRef = React16.useRef(provider);
+  React16.useEffect(() => {
     providerRef.current = provider;
   }, [provider]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (pendingRequest) {
       setStep("notice");
     }
   }, [pendingRequest]);
-  const title = React15.useMemo(() => {
+  const title = React16.useMemo(() => {
     if (!pendingRequest) return "";
     if (pendingRequest.type === "transaction") return t("walletRequired.titleTx");
     if (pendingRequest.type === "typedData") return t("walletRequired.titleTypedData");
@@ -7976,7 +8075,7 @@ function WalletRequiredModal() {
     }
   );
 }
-var VolrUIContext = React15__default.default.createContext(null);
+var VolrUIContext = React16__default.default.createContext(null);
 function getCurrentRpId() {
   if (typeof window === "undefined") return "localhost";
   return window.location.hostname;
@@ -7989,14 +8088,14 @@ function isPasskeyDomainMismatch(user) {
   return !registered.some((p) => p?.rpId === currentRpId);
 }
 var useVolrUI = () => {
-  const context = React15.useContext(VolrUIContext);
+  const context = React16.useContext(VolrUIContext);
   if (!context) {
     throw new Error("useVolrUI must be used within VolrUIProvider");
   }
   return context;
 };
 var useVolrUIOptional = () => {
-  return React15.useContext(VolrUIContext);
+  return React16.useContext(VolrUIContext);
 };
 function OnboardingFlow({
   keyStorageType,
@@ -8045,10 +8144,10 @@ var VolrUIProvider = ({
   const walletPolicy = config.walletPolicy ?? {
     requireVolrWalletOnLogin: true
   };
-  const [keyStorageTypeError, setKeyStorageTypeError] = React15.useState(
+  const [keyStorageTypeError, setKeyStorageTypeError] = React16.useState(
     null
   );
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (walletPolicy.requireVolrWalletOnLogin !== false && !keyStorageType) {
       const errorMessage = "keyStorageType must be specified in VolrUIProvider props. Please set keyStorageType prop in VolrUIProvider.";
       console.error(errorMessage);
@@ -8096,7 +8195,7 @@ function VolrUIProviderInner({
   allowExternalWalletPayment,
   children
 }) {
-  const [showOnboarding, setShowOnboarding] = React15.useState(false);
+  const [showOnboarding, setShowOnboarding] = React16.useState(false);
   const { requestSign } = useSignRequest();
   const { requestWallet } = useWalletRequired();
   const configWithSignRequest = {
@@ -8190,15 +8289,15 @@ function MigrationCoordinator({
 }) {
   const { user, setUser } = react.useVolrContext();
   const { client } = react.useInternalAuth();
-  const [running, setRunning] = React15.useState(false);
-  const [isSourcePopup, setIsSourcePopup] = React15.useState(false);
-  const [isTargetPopup, setIsTargetPopup] = React15.useState(false);
-  const [sourceStep, setSourceStep] = React15.useState("ready");
-  const [targetStep, setTargetStep] = React15.useState("ready");
-  const [targetDomain, setTargetDomain] = React15.useState("");
-  const [sourceDomain, setSourceDomain] = React15.useState("");
-  const [errorMessage, setErrorMessage] = React15.useState();
-  React15.useEffect(() => {
+  const [running, setRunning] = React16.useState(false);
+  const [isSourcePopup, setIsSourcePopup] = React16.useState(false);
+  const [isTargetPopup, setIsTargetPopup] = React16.useState(false);
+  const [sourceStep, setSourceStep] = React16.useState("ready");
+  const [targetStep, setTargetStep] = React16.useState("ready");
+  const [targetDomain, setTargetDomain] = React16.useState("");
+  const [sourceDomain, setSourceDomain] = React16.useState("");
+  const [errorMessage, setErrorMessage] = React16.useState();
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     const params = new URLSearchParams(window.location.search);
     const migrationToken = params.get("migration_token");
@@ -8222,7 +8321,7 @@ function MigrationCoordinator({
       }
     }
   }, []);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     const handler = (event) => {
       const data = event.data;
@@ -8234,7 +8333,7 @@ function MigrationCoordinator({
     window.addEventListener("message", handler);
     return () => window.removeEventListener("message", handler);
   }, [client, setUser, onHideOnboarding]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     if (running) return;
     const params = new URLSearchParams(window.location.search);
@@ -8379,9 +8478,9 @@ function MigrationCoordinator({
 }
 function AccountModalPortal() {
   const { isOpen, mode, close } = useVolrModal();
-  const [portalRoot, setPortalRoot] = React15.useState(null);
-  const [error, setError] = React15.useState(null);
-  React15.useEffect(() => {
+  const [portalRoot, setPortalRoot] = React16.useState(null);
+  const [error, setError] = React16.useState(null);
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     let root = document.getElementById("volr-modal-root");
     if (!root) {
@@ -8440,9 +8539,9 @@ function AccountModalPortal() {
 function DepositModalPortal() {
   const { isOpen, mode, asset, close } = useVolrModal();
   const { user } = react.useVolrContext();
-  const [portalRoot, setPortalRoot] = React15.useState(null);
-  const [showLogin, setShowLogin] = React15.useState(false);
-  React15.useEffect(() => {
+  const [portalRoot, setPortalRoot] = React16.useState(null);
+  const [showLogin, setShowLogin] = React16.useState(false);
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     let root = document.getElementById("volr-modal-root");
     if (!root) {
@@ -8457,7 +8556,7 @@ function DepositModalPortal() {
       }
     };
   }, []);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (isOpen && mode === "deposit" && !user) {
       setShowLogin(true);
     } else {
@@ -8491,8 +8590,8 @@ function DepositModalPortal() {
 }
 function PaymentModalPortal() {
   const { isOpen, mode, close } = useVolrModal();
-  const [portalRoot, setPortalRoot] = React15.useState(null);
-  React15.useEffect(() => {
+  const [portalRoot, setPortalRoot] = React16.useState(null);
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     let root = document.getElementById("volr-modal-root");
     if (!root) {
@@ -8521,8 +8620,8 @@ function PaymentModalPortal() {
 }
 function SignRequestModalPortal() {
   const { pendingRequest } = useSignRequestInternal();
-  const [portalRoot, setPortalRoot] = React15.useState(null);
-  React15.useEffect(() => {
+  const [portalRoot, setPortalRoot] = React16.useState(null);
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     let root = document.getElementById("volr-modal-root");
     if (!root) {
@@ -8554,8 +8653,8 @@ function OAuthCallbackHandler({
   enforceSelection,
   onShowOnboarding
 }) {
-  const [hasCode, setHasCode] = React15.useState(false);
-  React15.useEffect(() => {
+  const [hasCode, setHasCode] = React16.useState(false);
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     const params = new URLSearchParams(window.location.search);
     const code = params.get("code");
@@ -8604,14 +8703,14 @@ function OnboardingChecker({
 }) {
   const { user, provider, isLoading } = react.useVolrContext();
   const { isOpen: isModalOpen } = useVolrModal();
-  const modalWasOpened = React15__default.default.useRef(false);
-  const pendingMismatchOnboarding = React15__default.default.useRef(false);
-  React15.useEffect(() => {
+  const modalWasOpened = React16__default.default.useRef(false);
+  const pendingMismatchOnboarding = React16__default.default.useRef(false);
+  React16.useEffect(() => {
     if (isModalOpen) {
       modalWasOpened.current = true;
     }
   }, [isModalOpen]);
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (isLoading) {
       return;
     }
@@ -8665,7 +8764,7 @@ function OnboardingChecker({
 }
 function useSwitchNetwork() {
   const { client } = react.useInternalAuth();
-  return React15.useCallback(
+  return React16.useCallback(
     async (chainId) => {
       if (typeof window === "undefined" || !window.ethereum) {
         throw new Error("No wallet found");
@@ -8729,8 +8828,8 @@ var paymentPromiseResolver = null;
 function useVolrPay() {
   const { open: openModal, close: closeModal } = useVolrModal();
   const { checkPayment, getPaymentHistory } = react.useVolrPaymentApi();
-  const isInProgressRef = React15.useRef(false);
-  const pay = React15.useCallback(
+  const isInProgressRef = React16.useRef(false);
+  const pay = React16.useCallback(
     (options) => {
       isInProgressRef.current = true;
       const waitPromise = new Promise((resolve, reject) => {
@@ -8831,9 +8930,12 @@ exports.I18nContext = I18nContext;
 exports.I18nProvider = I18nProvider;
 exports.MpcConnectView = MpcConnectView;
 exports.PasskeyEnrollView = PasskeyEnrollView;
+exports.PreferredCurrencyProvider = PreferredCurrencyProvider;
 exports.VolrUIProvider = VolrUIProvider;
 exports.getCurrentChainId = getCurrentChainId;
 exports.useI18n = useI18n;
+exports.usePreferredCurrency = usePreferredCurrency;
+exports.usePreferredCurrencyOptional = usePreferredCurrencyOptional;
 exports.useSwitchNetwork = useSwitchNetwork;
 exports.useTranslation = useTranslation;
 exports.useVolrModal = useVolrModal;