npm - @moon-x/react-sdk - Versions diffs - 0.9.0 → 0.10.0 - Mend

@moon-x/react-sdk 0.9.0 → 0.10.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 (16) hide show

package/README.md +18 -16
package/dist/{chunk-7XFCJAFG.mjs → chunk-ACYQG7VT.mjs} +4 -4
package/dist/{chunk-VBAVYDWQ.js → chunk-IPTLHXJ4.js} +4 -4
package/dist/{chunk-OAG4S5VJ.mjs → chunk-MURLJWUN.mjs} +3 -3
package/dist/{chunk-F345C4FX.js → chunk-RRFMI4ZL.js} +3 -3
package/dist/index.css +43 -43
package/dist/index.d.mts +13 -13
package/dist/index.d.ts +13 -13
package/dist/index.js +732 -688
package/dist/index.mjs +730 -685
package/dist/style.css +43 -43
package/dist/wallets/ethereum.js +15 -15
package/dist/wallets/ethereum.mjs +1 -1
package/dist/wallets/solana.js +11 -11
package/dist/wallets/solana.mjs +1 -1
package/package.json +2 -2

package/dist/index.mjs CHANGED Viewed

@@ -389,8 +389,8 @@ function _ts_generator(thisArg, body) {
         };
     }
 }
-import { ethereum_exports } from "./chunk-7XFCJAFG.mjs";
-import { solana_exports } from "./chunk-OAG4S5VJ.mjs";
+import { ethereum_exports } from "./chunk-ACYQG7VT.mjs";
+import { solana_exports } from "./chunk-MURLJWUN.mjs";
 import { AuthContext, useAuthSDK } from "./chunk-PCEN5CH6.mjs";
 // src/index.ts
 import { useAddPasskey, useEphemeralSigner, useLoginWithEmail, usePasskeyStatus, useRegisterPasskey, useRemovePasskey, useUser } from "@moon-x/core/react";
@@ -822,7 +822,7 @@ function useLoginWithOAuth() {
     };
 }
 // src/hooks/use-moonkey.ts
-var useMoonKey = function useMoonKey() {
+var useMoonX = function useMoonX() {
     var coreSDK = useAuthSDK();
     return {
         ready: coreSDK.ready,
@@ -1883,7 +1883,7 @@ var getSDKMethods = function getSDKMethods(publishableKey, isMounted, getIsReady
         publishableKey: publishableKey,
         // window is defined in the browser context where this hook runs.
         // SSR rendering never reaches the factory because the SDK is gated
-        // on the MoonKeyProvider's `useEffect`-mounted lifecycle.
+        // on the MoonXProvider's `useEffect`-mounted lifecycle.
         relyingPartyOrigin: typeof window !== "undefined" ? window.location.origin : "",
         setIsAuthenticated: setIsAuthenticated,
         setUser: setUser
@@ -2789,7 +2789,7 @@ import { useEffect as useEffect5, useState as useState5 } from "react";
 import { PostMessageClient, PostMessageMethod as PostMessageMethod9, PostMessageType as PostMessageType10, getIframeOrigin, getIframeUrl } from "@moon-x/core";
 import { createIframeTransport as createIframeTransport6 } from "@moon-x/core/web";
 var getIframeClient = function getIframeClient(publishableKey) {
-    var iframeId = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "moonkey-auth-iframe";
+    var iframeId = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "moonx-auth-iframe";
     var iframe = document.getElementById(iframeId);
     if (!(iframe === null || iframe === void 0 ? void 0 : iframe.contentWindow)) {
         return void 0;
@@ -2799,7 +2799,7 @@ var getIframeClient = function getIframeClient(publishableKey) {
     return new PostMessageClient(iframe.contentWindow, iframeOrigin);
 };
 var getIframeTransport = function getIframeTransport() {
-    var iframeId = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "moonkey-auth-iframe";
+    var iframeId = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "moonx-auth-iframe";
     return createIframeTransport6({
         getContentWindow: function getContentWindow() {
             var _ref;
@@ -3004,38 +3004,38 @@ var darkTheme = {
 function themeToCSS(theme) {
     return {
         // Accent colors
-        "--moonkey-color-accent": theme.colors.accent,
-        "--moonkey-color-accent-foreground": theme.colors.accentForeground,
-        "--moonkey-color-accent-dark": theme.colors.accentDark,
-        "--moonkey-color-accent-darkest": theme.colors.accentDarkest,
-        "--moonkey-color-accent-light": theme.colors.accentLight,
-        "--moonkey-color-accent-lightest": theme.colors.accentLightest,
+        "--moonx-color-accent": theme.colors.accent,
+        "--moonx-color-accent-foreground": theme.colors.accentForeground,
+        "--moonx-color-accent-dark": theme.colors.accentDark,
+        "--moonx-color-accent-darkest": theme.colors.accentDarkest,
+        "--moonx-color-accent-light": theme.colors.accentLight,
+        "--moonx-color-accent-lightest": theme.colors.accentLightest,
         // Background colors
-        "--moonkey-color-background": theme.colors.background,
-        "--moonkey-color-background-2": theme.colors.background2,
-        "--moonkey-color-background-3": theme.colors.background3,
+        "--moonx-color-background": theme.colors.background,
+        "--moonx-color-background-2": theme.colors.background2,
+        "--moonx-color-background-3": theme.colors.background3,
         // Foreground colors
-        "--moonkey-color-foreground": theme.colors.foreground,
-        "--moonkey-color-foreground-2": theme.colors.foreground2,
-        "--moonkey-color-foreground-3": theme.colors.foreground3,
-        "--moonkey-color-foreground-4": theme.colors.foreground4,
-        "--moonkey-color-foreground-accent": theme.colors.foregroundAccent,
+        "--moonx-color-foreground": theme.colors.foreground,
+        "--moonx-color-foreground-2": theme.colors.foreground2,
+        "--moonx-color-foreground-3": theme.colors.foreground3,
+        "--moonx-color-foreground-4": theme.colors.foreground4,
+        "--moonx-color-foreground-accent": theme.colors.foregroundAccent,
         // Success colors
-        "--moonkey-color-success": theme.colors.success,
-        "--moonkey-color-success-foreground": theme.colors.successForeground,
+        "--moonx-color-success": theme.colors.success,
+        "--moonx-color-success-foreground": theme.colors.successForeground,
         // Error colors
-        "--moonkey-color-error": theme.colors.error,
-        "--moonkey-color-error-foreground": theme.colors.errorForeground,
-        "--moonkey-color-error-light": theme.colors.errorLight,
+        "--moonx-color-error": theme.colors.error,
+        "--moonx-color-error-foreground": theme.colors.errorForeground,
+        "--moonx-color-error-light": theme.colors.errorLight,
         // Border
-        "--moonkey-color-border": theme.colors.border,
+        "--moonx-color-border": theme.colors.border,
         // Border radius
-        "--moonkey-border-radius-sm": theme.borderRadius.sm,
-        "--moonkey-border-radius-md": theme.borderRadius.md,
-        "--moonkey-border-radius-lg": theme.borderRadius.lg,
-        "--moonkey-border-radius-full": theme.borderRadius.full,
+        "--moonx-border-radius-sm": theme.borderRadius.sm,
+        "--moonx-border-radius-md": theme.borderRadius.md,
+        "--moonx-border-radius-lg": theme.borderRadius.lg,
+        "--moonx-border-radius-full": theme.borderRadius.full,
         // Font family
-        "--moonkey-font-family": theme.fontFamily
+        "--moonx-font-family": theme.fontFamily
     };
 }
 function isColorDark(color) {
@@ -3126,12 +3126,12 @@ var Button = React2.forwardRef(function(_0, _1) {
     ]), _rest1 = _sliced_to_array(_rest, 1), ref = _rest1[0];
     return /* @__PURE__ */ jsxs("button", _object_spread_props(_object_spread({
         ref: ref,
-        className: cx("moonkey-btn", "moonkey-btn--".concat(variant), size !== "default" && "moonkey-btn--".concat(size), full && "moonkey-btn--full", state && "moonkey-state--".concat(state), className),
+        className: cx("moonx-btn", "moonx-btn--".concat(variant), size !== "default" && "moonx-btn--".concat(size), full && "moonx-btn--full", state && "moonx-state--".concat(state), className),
         disabled: disabled || state === "loading"
     }, props), {
         children: [
             state === "loading" && /* @__PURE__ */ jsx2("span", {
-                className: "moonkey-spinner moonkey-spinner--md"
+                className: "moonx-spinner moonx-spinner--md"
             }),
             children
         ]
@@ -3151,7 +3151,7 @@ var Input = React3.forwardRef(function(_0, _1) {
     ]), _rest1 = _sliced_to_array(_rest, 1), ref = _rest1[0];
     return /* @__PURE__ */ jsx3("input", _object_spread({
         ref: ref,
-        className: cx("moonkey-input", error && "moonkey-input--error", className)
+        className: cx("moonx-input", error && "moonx-input--error", className)
     }, props));
 });
 Input.displayName = "Input";
@@ -3168,7 +3168,7 @@ var Label = React4.forwardRef(function(_0, _1) {
     ]), _rest1 = _sliced_to_array(_rest, 1), ref = _rest1[0];
     return /* @__PURE__ */ jsx4("label", _object_spread({
         ref: ref,
-        className: cx("moonkey-label", tone !== "default" && "moonkey-label--".concat(tone), className)
+        className: cx("moonx-label", tone !== "default" && "moonx-label--".concat(tone), className)
     }, props));
 });
 Label.displayName = "Label";
@@ -3527,7 +3527,7 @@ function appearanceToCssVars(appearance, isDark) {
     return _object_spread({}, themeToCSS(merged), appearanceToMoonxVars(appearance, isDark), appearanceToComponentVars(appearance));
 }
 // src/styles/sdk-stylesheet.ts
-var SDK_STYLES = '\n/* === Reset === */\n.moonkey-sdk-root * { box-sizing: border-box; }\n.moonkey-sdk-root *:focus-visible { outline: 2px solid var(--moonx-color-ring, var(--moonkey-color-accent)); outline-offset: 2px; }\n.moonkey-sdk-root input::placeholder { color: var(--moonkey-color-foreground-3); opacity: 1; }\n\n/* === Animations === */\n@keyframes moonkey-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }\n@keyframes moonkey-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }\n\n/* === Button === */\n.moonkey-sdk-root .moonkey-btn {\n  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;\n  font-weight: var(--moonx-font-weight-medium, 500); font-size: 0.875rem; border: none; cursor: pointer;\n  user-select: none; -webkit-user-select: none; white-space: nowrap;\n  transition: background-color 0.2s, color 0.2s, border-color 0.2s, opacity 0.2s;\n  font-family: inherit; text-decoration: none;\n}\n.moonkey-sdk-root .moonkey-btn:disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }\n\n/* Sizes */\n.moonkey-sdk-root .moonkey-btn--sm  { height: 2.25rem; padding: 0 0.75rem; border-radius: var(--moonx-radius-button, var(--moonkey-border-radius-md)); }\n.moonkey-sdk-root .moonkey-btn--md, .moonkey-sdk-root .moonkey-btn--default { height: 2.75rem; padding: 0 1rem; border-radius: var(--moonx-radius-button, var(--moonkey-border-radius-md)); }\n.moonkey-sdk-root .moonkey-btn--lg  { height: 3rem; padding: 0 2rem; font-size: 1rem; border-radius: var(--moonx-radius-button, var(--moonkey-border-radius-md)); }\n.moonkey-sdk-root .moonkey-btn--icon { width: 2rem; height: 2rem; padding: 0; border-radius: var(--moonx-radius-button, var(--moonkey-border-radius-md)); }\n.moonkey-sdk-root .moonkey-btn--full { width: 100%; justify-content: center; }\n\n/* Variants */\n.moonkey-sdk-root .moonkey-btn--primary, .moonkey-sdk-root .moonkey-btn--default {\n  background-color: var(--moonx-button-bg, var(--moonkey-color-accent)); color: var(--moonx-button-fg, var(--moonkey-color-accent-foreground));\n  border: var(--moonx-button-border-width, 0px) solid var(--moonx-button-border-color, transparent);\n}\n.moonkey-sdk-root .moonkey-btn--primary:hover:not(:disabled), .moonkey-sdk-root .moonkey-btn--default:hover:not(:disabled) {\n  background-color: var(--moonkey-color-accent-dark);\n}\n.moonkey-sdk-root .moonkey-btn--primary.moonkey-state--success { background-color: var(--moonkey-color-success); color: var(--moonkey-color-success-foreground); }\n.moonkey-sdk-root .moonkey-btn--primary.moonkey-state--error   { background-color: var(--moonkey-color-error);   color: var(--moonkey-color-error-foreground); }\n\n.moonkey-sdk-root .moonkey-btn--outline {\n  background-color: transparent; border: 1px solid var(--moonkey-color-border); color: var(--moonkey-color-foreground);\n}\n.moonkey-sdk-root .moonkey-btn--outline:hover:not(:disabled) { background-color: var(--moonkey-color-background-2); border-color: var(--moonkey-color-accent); }\n\n.moonkey-sdk-root .moonkey-btn--ghost  { background-color: transparent; color: var(--moonkey-color-foreground); }\n.moonkey-sdk-root .moonkey-btn--ghost:hover:not(:disabled)  { background-color: var(--moonkey-color-background-2); }\n\n.moonkey-sdk-root .moonkey-btn--secondary { background-color: var(--moonkey-color-background-2); color: var(--moonkey-color-foreground); }\n.moonkey-sdk-root .moonkey-btn--secondary:hover:not(:disabled) { background-color: var(--moonkey-color-background-3); }\n\n.moonkey-sdk-root .moonkey-btn--destructive { background-color: var(--moonkey-color-error); color: var(--moonkey-color-error-foreground); }\n.moonkey-sdk-root .moonkey-btn--destructive:hover:not(:disabled) { opacity: 0.9; }\n\n.moonkey-sdk-root .moonkey-btn--link { background: transparent; color: var(--moonx-color-link, var(--moonkey-color-accent)); text-decoration: underline; text-underline-offset: 4px; height: auto; padding: 0; }\n\n/* === Input === */\n.moonkey-sdk-root .moonkey-input {\n  display: flex; width: 100%; height: 2.75rem; padding: 0 0.75rem;\n  font-size: 0.875rem; font-family: inherit; color: var(--moonx-input-fg, var(--moonkey-color-foreground));\n  background-color: var(--moonx-input-bg, transparent); border: var(--moonx-input-border-width, 1px) solid var(--moonx-input-border-color, var(--moonkey-color-border));\n  border-radius: var(--moonx-radius-input, var(--moonkey-border-radius-md)); outline: none;\n  transition: border-color 0.2s, box-shadow 0.2s; box-sizing: border-box;\n}\n.moonkey-sdk-root .moonkey-input:focus { border-color: var(--moonx-color-ring, var(--moonkey-color-accent)); box-shadow: 0 0 0 1px var(--moonx-color-ring, var(--moonkey-color-accent)); }\n.moonkey-sdk-root .moonkey-input:disabled { opacity: 0.5; cursor: not-allowed; }\n.moonkey-sdk-root .moonkey-input--error { border-color: var(--moonkey-color-error); }\n\n/* === Label === */\n.moonkey-sdk-root .moonkey-label { display: block; font-size: 0.875rem; font-weight: var(--moonx-font-weight-medium, 500); color: var(--moonkey-color-foreground); line-height: 1; }\n.moonkey-sdk-root .moonkey-label--secondary { color: var(--moonkey-color-foreground-3); }\n.moonkey-sdk-root .moonkey-label--tertiary  { color: var(--moonkey-color-foreground-4); font-size: 0.75rem; }\n.moonkey-sdk-root .moonkey-label--error     { color: var(--moonkey-color-error); }\n.moonkey-sdk-root .moonkey-label--success   { color: var(--moonkey-color-success); }\n\n/* === Detail Row === */\n.moonkey-sdk-root .moonkey-detail-row { display: flex; justify-content: space-between; align-items: center; padding: 0.25rem 0; }\n.moonkey-sdk-root .moonkey-detail-row__label { font-size: 0.875rem; color: var(--moonkey-color-foreground-3); }\n.moonkey-sdk-root .moonkey-detail-row__value { font-size: 0.875rem; font-weight: 500; color: var(--moonkey-color-foreground); text-align: right; }\n\n/* === Divider === */\n.moonkey-sdk-root .moonkey-divider { border-top: 1px solid var(--moonkey-color-border); margin: 1rem 0; }\n\n/* === Boxes === */\n.moonkey-sdk-root .moonkey-box { padding: 0.75rem; border-radius: var(--moonkey-border-radius-lg); }\n.moonkey-sdk-root .moonkey-box--surface  { background-color: var(--moonkey-color-background-2); }\n.moonkey-sdk-root .moonkey-box--error    { background-color: var(--moonkey-color-background-2); border: 1px solid var(--moonkey-color-error); }\n.moonkey-sdk-root .moonkey-box--success  { background-color: var(--moonkey-color-background-2); border: 1px solid var(--moonkey-color-success); }\n.moonkey-sdk-root .moonkey-box--info     { background-color: var(--moonkey-color-background-2); border: 1px solid var(--moonx-color-info, var(--moonkey-color-border)); }\n.moonkey-sdk-root .moonkey-box--warning  { background-color: var(--moonkey-color-background-2); border: 1px solid var(--moonx-color-warning, var(--moonkey-color-error)); display: flex; align-items: flex-start; gap: 0.5rem; }\n.moonkey-sdk-root .moonkey-box--scrollable { overflow-y: auto; font-size: 0.875rem; white-space: pre-wrap; word-break: break-word; }\n\n/* === Address Pill === */\n.moonkey-sdk-root .moonkey-address-pill {\n  display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.25rem 0.75rem;\n  background-color: var(--moonkey-color-background-3); color: var(--moonkey-color-foreground);\n  border: 1px solid var(--moonkey-color-border); border-radius: var(--moonkey-border-radius-md);\n  font-size: 0.875rem; font-family: monospace; cursor: pointer;\n  transition: background-color 0.2s, border-color 0.2s;\n}\n.moonkey-sdk-root .moonkey-address-pill:hover { background-color: var(--moonkey-color-background-2); }\n.moonkey-sdk-root .moonkey-address-pill--copied { border-color: var(--moonkey-color-success); }\n\n/* === Mono Text === */\n.moonkey-sdk-root .moonkey-mono { font-family: monospace; font-size: 0.875rem; color: var(--moonkey-color-foreground); }\n\n/* === Spinner === */\n.moonkey-sdk-root .moonkey-spinner {\n  display: inline-block; flex-shrink: 0;\n  border: 2px solid currentColor; border-top-color: transparent;\n  border-radius: 9999px; animation: moonkey-spin 1s linear infinite;\n}\n.moonkey-sdk-root .moonkey-spinner--sm { width: 0.875rem; height: 0.875rem; }\n.moonkey-sdk-root .moonkey-spinner--md { width: 1rem; height: 1rem; }\n.moonkey-sdk-root .moonkey-spinner--lg { width: 1.5rem; height: 1.5rem; }\n.moonkey-sdk-root .moonkey-spinner--xl { width: 2rem; height: 2rem; }\n\n/* === Pulse skeleton === */\n.moonkey-sdk-root .moonkey-skeleton { background-color: var(--moonkey-color-background-2); border-radius: 0.25rem; animation: moonkey-pulse 2s cubic-bezier(0.4,0,0.6,1) infinite; }\n\n/* === Flow layout === */\n.moonkey-sdk-root .moonkey-flow-close { position: absolute; top: 1rem; right: 1.5rem; display: flex; align-items: center; flex-shrink: 0; z-index: 1; }\n.moonkey-sdk-root .moonkey-flow-header { display: flex; flex-direction: column; text-align: center; padding: 0 0.5rem 0.25rem; gap: 0.5rem; }\n.moonkey-sdk-root .moonkey-flow-content { display: flex; flex-direction: column; flex: 1; margin-top: 1rem; padding: 0 0.5rem; }\n.moonkey-sdk-root .moonkey-flow-footer {\n  position: absolute; bottom: 0; left: 0; right: 0;\n  background-color: var(--moonkey-color-background); padding: 1rem 2rem 3rem;\n  margin: 0 0.125rem 0.125rem;\n  border-bottom-left-radius: var(--moonkey-border-radius-lg);\n  border-bottom-right-radius: var(--moonkey-border-radius-lg);\n}\n.moonkey-sdk-root .moonkey-flow-footer__actions { display: flex; gap: 0.75rem; }\n/* Buttons inside footer actions auto-stretch to fill space */\n.moonkey-sdk-root .moonkey-flow-footer__actions > .moonkey-btn { flex: 1; height: 3rem; font-size: 1rem; }\n\n/* === Flow text utilities === */\n.moonkey-sdk-root .moonkey-text--heading { font-weight: var(--moonx-font-weight-heading, var(--moonx-font-weight-medium, 500)); font-family: var(--moonx-font-family-heading, inherit); letter-spacing: var(--moonx-letter-spacing-heading, inherit); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--moonx-color-heading, var(--moonkey-color-foreground)); }\n.moonkey-sdk-root .moonkey-text--title { font-size: var(--moonx-font-size-heading, var(--moonx-font-size-lg, 1rem)); font-weight: var(--moonx-font-weight-heading, var(--moonx-font-weight-bold, 600)); font-family: var(--moonx-font-family-heading, inherit); letter-spacing: var(--moonx-letter-spacing-heading, inherit); color: var(--moonx-color-heading, var(--moonkey-color-foreground)); }\n.moonkey-sdk-root .moonkey-text--secondary { font-size: var(--moonx-font-size-sm, 0.875rem); color: var(--moonkey-color-foreground-3); }\n.moonkey-sdk-root .moonkey-text--error { font-size: 0.875rem; color: var(--moonkey-color-error); }\n.moonkey-sdk-root .moonkey-text--success { font-size: 0.875rem; color: var(--moonkey-color-success); }\n.moonkey-sdk-root .moonkey-flow-logo { display: flex; align-items: center; justify-content: center; }\n\n/* === Terms link row (accept-terms) === */\n.moonkey-sdk-root .moonkey-terms-link {\n  display: flex; flex-direction: row; align-items: center; justify-content: space-between;\n  border-radius: var(--moonkey-border-radius-lg); padding: 0.75rem;\n  margin-left: 0.75rem; margin-right: 0.75rem;\n  border: 1px solid var(--moonkey-color-border); cursor: pointer;\n  transition: background-color 0.2s ease;\n}\n.moonkey-sdk-root .moonkey-terms-link:hover { background-color: var(--moonkey-color-background-2); }\n\n/* === Wallet item === */\n.moonkey-sdk-root .moonkey-wallet-item {\n  display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 1rem;\n  border: 1px solid var(--moonkey-color-border); border-radius: var(--moonx-radius-button, var(--moonkey-border-radius-lg));\n  background-color: var(--moonkey-color-background); cursor: pointer;\n  transition: border-color 0.2s, background-color 0.2s;\n}\n.moonkey-sdk-root .moonkey-wallet-item:hover { border-color: var(--moonkey-color-accent); background-color: var(--moonkey-color-background-2); }\n.moonkey-sdk-root .moonkey-wallet-item--selected { border-color: var(--moonkey-color-accent); background-color: var(--moonkey-color-background-2); }\n\n/* === Flow overlay (z-index stack wrapper) === */\n.moonkey-sdk-root .moonkey-flow-overlay { position: relative; z-index: 100; }\n\n/* === Wallet connection state container === */\n.moonkey-sdk-root .moonkey-connect-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 3rem; padding-bottom: 3rem; }\n\n/* === Large wallet icon spinner === */\n.moonkey-sdk-root .moonkey-wallet-spinner { position: relative; width: 5rem; height: 5rem; display: flex; align-items: center; justify-content: center; }\n.moonkey-sdk-root .moonkey-wallet-spinner__ring { position: absolute; inset: 0; width: 5rem; height: 5rem; border-radius: 50%; border: 4px solid var(--moonkey-color-border); }\n.moonkey-sdk-root .moonkey-wallet-spinner__ring--error { border-color: var(--moonkey-color-error); }\n.moonkey-sdk-root .moonkey-wallet-spinner__spin { position: absolute; inset: 0; width: 5rem; height: 5rem; border-radius: 50%; border: 4px solid transparent; border-top-color: var(--moonkey-color-accent); animation: moonkey-spin 1s linear infinite; }\n.moonkey-sdk-root .moonkey-wallet-spinner__center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }\n\n/* === Data preview box (sign typed-data / transactions) === */\n.moonkey-sdk-root .moonkey-data-preview { margin-top: 0.25rem; padding: 0.75rem; background-color: var(--moonkey-color-background-2); border-radius: var(--moonkey-border-radius-md); font-size: 0.875rem; font-family: monospace; word-break: break-all; white-space: pre-line; user-select: none; -webkit-user-select: none; }\n\n/* === Scrollable data container (signing flows) === */\n.moonkey-sdk-root .moonkey-data-scroll { display: flex; flex-direction: column; max-height: 390px; overflow-y: auto; padding-bottom: 5rem; position: relative; }\n\n/* === Expand/collapse trigger === */\n.moonkey-sdk-root .moonkey-expand-toggle { display: inline-flex; align-items: center; cursor: pointer; user-select: none; -webkit-user-select: none; }\n\n/* === Scrollable bordered list (transaction detail panels) === */\n.moonkey-sdk-root .moonkey-scrollable-list { display: flex; flex-direction: column; overflow-y: auto; border: 1px solid var(--moonkey-color-border); border-radius: var(--moonkey-border-radius-md); scrollbar-width: none; }\n.moonkey-sdk-root .moonkey-scrollable-list::-webkit-scrollbar { display: none; }\n\n/* === Modal content column (passkey-enroll, add-passkey) === */\n.moonkey-sdk-root .moonkey-modal-content { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 1rem 1.5rem; gap: 1rem; }\n\n/* === Back nav button (absolute top-left) === */\n.moonkey-sdk-root .moonkey-back-btn { position: absolute; top: 1rem; left: 0.5rem; width: 2.5rem; height: 2.5rem; display: flex; align-items: center; justify-content: center; border-radius: var(--moonkey-border-radius-full); }\n\n/* === Centered inline row (resend, action links) === */\n.moonkey-sdk-root .moonkey-center-row { display: flex; justify-content: center; align-items: center; gap: 0.25rem; }\n\n/* === Stacked button column (modal CTAs) === */\n.moonkey-sdk-root .moonkey-btn-stack { display: flex; flex-direction: column; gap: 0.5rem; width: 100%; padding-top: 0.5rem; }\n\n/* === Legal footer text (terms & privacy) === */\n.moonkey-sdk-root .moonkey-legal-text { font-size: 0.75rem; color: var(--moonkey-color-foreground-3); text-align: center; line-height: 1.5; margin-top: 1rem; }\n.moonkey-sdk-root .moonkey-legal-text a { color: var(--moonx-color-link, var(--moonkey-color-accent)); cursor: pointer; }\n/* Inline-checkbox variant: same typography, but flex layout aligned left so the checkbox sits beside the link text. */\n.moonkey-sdk-root .moonkey-legal-checkbox { display: flex; align-items: flex-start; justify-content: flex-start; text-align: left; gap: 0.5rem; }\n.moonkey-sdk-root .moonkey-legal-checkbox input[type="checkbox"] { margin-top: 0.15rem; cursor: pointer; }\n\n/* === Login gating (require_users_accept_terms) === */\n/* Wraps the email/social/wallet buttons so they can be visually disabled until the terms checkbox is ticked. The default state is unaffected. */\n.moonkey-sdk-root .moonkey-login-gateable { transition: opacity 0.15s ease-out; }\n.moonkey-sdk-root .moonkey-login-gated { opacity: 0.5; pointer-events: none; }\n\n/* === Shared entry animations === */\n@keyframes moonkey-slide-in { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); } }\n@keyframes moonkey-success-bounce { from { opacity: 0; transform: translateY(-50px) rotate(-60deg); } to { opacity: 1; transform: translateY(20px) rotate(0deg); } }\n@keyframes moonkey-error-bounce { from { opacity: 0; transform: translateY(-50px) rotate(-60deg); } to { opacity: 1; transform: translateY(20px) rotate(0deg); } }\n@keyframes moonkey-error-shake { 0%, 100% { transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { transform: translateX(-10px); } 20%, 40%, 60%, 80% { transform: translateX(10px); } }\n@keyframes moonkey-mail-slide-in { from { opacity: 0; transform: translateX(-50px) rotate(-15deg); } to { opacity: 1; transform: translateX(0) rotate(0deg); } }\n@keyframes moonkey-verified-slide-in { from { opacity: 0; transform: translateX(100px); } to { opacity: 1; transform: translateX(0); } }\n\n/* === Icon size utilities === */\n.moonkey-sdk-root .moonkey-icon--xs  { width: 0.75rem; height: 0.75rem; }\n.moonkey-sdk-root .moonkey-icon--sm  { width: 1rem;    height: 1rem;    }\n.moonkey-sdk-root .moonkey-icon--md  { width: 1.5rem;  height: 1.5rem;  }\n.moonkey-sdk-root .moonkey-icon--lg  { width: 2rem;    height: 2rem;    }\n.moonkey-sdk-root .moonkey-icon--xl  { width: 2.5rem;  height: 2.5rem;  }\n.moonkey-sdk-root .moonkey-icon--2xl { width: 3rem;    height: 3rem;    }\n.moonkey-sdk-root .moonkey-icon--mr-xs { margin-right: 0.25rem; }\n.moonkey-sdk-root .moonkey-icon--mr-sm { margin-right: 0.5rem; }\n.moonkey-sdk-root .moonkey-icon--accent  { color: var(--moonkey-color-accent); }\n.moonkey-sdk-root .moonkey-icon--success { color: var(--moonkey-color-success, #16a34a); }\n.moonkey-sdk-root .moonkey-icon--error   { color: var(--moonkey-color-error); }\n.moonkey-sdk-root .moonkey-icon--muted   { color: var(--moonkey-color-foreground-3); }\n.moonkey-sdk-root .moonkey-icon--fg      { color: var(--moonkey-color-foreground); }\n\n/* === Layout utilities === */\n.moonkey-sdk-root .moonkey-flex-center     { display: flex; align-items: center; justify-content: center; }\n.moonkey-sdk-root .moonkey-flex-between    { display: flex; align-items: center; justify-content: space-between; }\n.moonkey-sdk-root .moonkey-flex-col        { display: flex; flex-direction: column; }\n.moonkey-sdk-root .moonkey-flex-col-center { display: flex; flex-direction: column; align-items: center; }\n\n/* === Text modifiers === */\n.moonkey-sdk-root .moonkey-text--semibold { font-weight: var(--moonx-font-weight-medium, 500); }\n.moonkey-sdk-root .moonkey-text--bold     { font-weight: var(--moonx-font-weight-bold, 600); }\n.moonkey-sdk-root .moonkey-text--center   { text-align: center; }\n.moonkey-sdk-root .moonkey-text--sm       { font-size: var(--moonx-font-size-sm, 0.875rem); }\n.moonkey-sdk-root .moonkey-text--lg       { font-size: var(--moonx-font-size-lg, 1.125rem); }\n.moonkey-sdk-root .moonkey-text--xl       { font-size: var(--moonx-font-size-xl, 1.25rem); }\n\n/* === Transaction detail card (success receipt) === */\n.moonkey-sdk-root .moonkey-detail-card { display: flex; flex-direction: column; border: 1px solid var(--moonkey-color-border); border-radius: var(--moonkey-border-radius-lg); padding: 1rem 0.5rem; margin: 2rem 0.5rem 0; }\n.moonkey-sdk-root .moonkey-detail-card__rows { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; }\n\n/* === Failed-transaction error scroll box === */\n.moonkey-sdk-root .moonkey-error-scroll { display: flex; flex-direction: column; background-color: var(--moonkey-color-background-2); border: 1px solid var(--moonkey-color-border); border-radius: var(--moonkey-border-radius-lg); padding: 1rem 0.5rem; margin: 0.5rem; height: 150px; overflow: auto; }\n\n/* === Network logo badge (ethereum/solana pair) === */\n.moonkey-sdk-root .moonkey-network-badge { width: 32px; height: 32px; border-radius: 16px; border: 1px solid var(--moonkey-color-border); background-color: var(--moonkey-color-background-2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }\n.moonkey-sdk-root .moonkey-network-badge--overlap { margin-left: -8px; }\n\n/* === Positioned icons inside inputs === */\n.moonkey-sdk-root .moonkey-search-icon { position: absolute; left: 0.75rem; top: 0.875rem; color: var(--moonkey-color-foreground-3); }\n.moonkey-sdk-root .moonkey-input-icon--left { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); color: var(--moonkey-color-foreground-3); pointer-events: none; }\n\n/* === Step indicator (N of M) === */\n.moonkey-sdk-root .moonkey-step-label { font-size: 0.75rem; font-weight: 600; color: var(--moonkey-color-accent); letter-spacing: 0.05em; text-transform: uppercase; }\n\n/* === Feature bullet item (passkey enroll) === */\n.moonkey-sdk-root .moonkey-feature-item { display: flex; align-items: flex-start; gap: 0.75rem; text-align: left; font-size: 0.875rem; color: var(--moonkey-color-foreground); }\n\n/* === Monospace textarea (import wallet) === */\n.moonkey-sdk-root .moonkey-mono-textarea { width: 100%; min-height: 100px; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; background-color: var(--moonkey-color-background-2); color: var(--moonkey-color-foreground); border: 1px solid var(--moonkey-color-border); border-radius: var(--moonx-radius-input, var(--moonkey-border-radius-md)); outline: none; resize: vertical; }\n\n/* === Sign-flow inner section and row === */\n.moonkey-sdk-root .moonkey-sign-section { padding: 0.5rem; }\n.moonkey-sdk-root .moonkey-sign-row { display: flex; align-items: center; justify-content: space-between; }\n\n/* === External wallet connect button (login flow) === */\n.moonkey-sdk-root .moonkey-external-wallet-btn { border-radius: var(--moonx-radius-button, var(--moonkey-border-radius-lg)); border: var(--moonx-button-border-width, 1px) solid var(--moonx-button-border-color, var(--moonkey-color-border)); color: var(--moonx-button-fg, var(--moonkey-color-foreground)); padding: 0.75rem 0.25rem; cursor: pointer; margin-top: 0.75rem; transition: all 0.2s ease-in-out; background-color: var(--moonx-button-bg, transparent); }\n.moonkey-sdk-root .moonkey-external-wallet-btn:hover { border-color: var(--moonx-button-border-color-hover, var(--moonkey-color-accent)); background-color: var(--moonx-button-bg-hover, var(--moonkey-color-background-2)); }\n.moonkey-sdk-root .moonkey-external-wallet-btn--accent-hover:hover { background-color: var(--moonkey-color-accent); }\n.moonkey-sdk-root .moonkey-external-wallet-btn__inner { display: flex; flex-direction: row; align-items: center; gap: 0.5rem; animation: moonkey-slide-in 0.3s ease-out 0.1s both; }\n\n/* === Flex row utility (icon + label pairs) === */\n.moonkey-sdk-root .moonkey-flex-row { display: flex; flex-direction: row; align-items: center; gap: 0.5rem; }\n\n/* === Login landing layout === */\n.moonkey-sdk-root .moonkey-header { position: absolute; top: 1.5rem; left: 0; right: 0; text-align: center; font-family: var(--moonx-font-family-heading, inherit); font-size: var(--moonx-font-size-heading, 0.875rem); font-weight: var(--moonx-font-weight-heading, 500); letter-spacing: var(--moonx-letter-spacing-heading, inherit); color: var(--moonx-color-heading, var(--moonkey-color-foreground)); margin-bottom: 0.5rem; padding-left: 3rem; padding-right: 3rem; }\n.moonkey-sdk-root .moonkey-header__inner { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.moonkey-sdk-root .moonkey-content-wrapper { padding-top: 1rem; padding-bottom: 1rem; width: 100%; }\n.moonkey-sdk-root .moonkey-logo-section { text-align: center; margin-bottom: 1rem; }\n.moonkey-sdk-root .moonkey-logo-section__inner { padding-top: 1rem; padding-bottom: 1rem; }\n.moonkey-sdk-root .moonkey-description { padding-left: 1.25rem; padding-right: 1.25rem; text-align: center; color: var(--moonkey-color-foreground-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.moonkey-sdk-root .moonkey-form-section { padding: 0.5rem 1rem; }\n\n/* === Email OTP content fill === */\n.moonkey-sdk-root .moonkey-otp-content { flex-grow: 1; display: flex; flex-direction: column; justify-content: center; }\n\n/* === Wallet icon status overlay badge === */\n.moonkey-sdk-root .moonkey-wallet-status-badge { position: absolute; bottom: -4px; right: -4px; background-color: var(--moonkey-color-background); border-radius: 50%; display: flex; align-items: center; justify-content: center; }\n\n/* === Wallet connect success animation === */\n@keyframes fadeInScale { from { opacity: 0; transform: scale(0.8); } to { opacity: 1; transform: scale(1); } }\n';
+var SDK_STYLES = '\n/* === Reset === */\n.moonx-sdk-root * { box-sizing: border-box; }\n.moonx-sdk-root *:focus-visible { outline: 2px solid var(--moonx-color-ring, var(--moonx-color-accent)); outline-offset: 2px; }\n.moonx-sdk-root input::placeholder { color: var(--moonx-color-foreground-3); opacity: 1; }\n\n/* === Animations === */\n@keyframes moonx-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }\n@keyframes moonx-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }\n\n/* === Button === */\n.moonx-sdk-root .moonx-btn {\n  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;\n  font-weight: var(--moonx-font-weight-medium, 500); font-size: 0.875rem; border: none; cursor: pointer;\n  user-select: none; -webkit-user-select: none; white-space: nowrap;\n  transition: background-color 0.2s, color 0.2s, border-color 0.2s, opacity 0.2s;\n  font-family: inherit; text-decoration: none;\n}\n.moonx-sdk-root .moonx-btn:disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }\n\n/* Sizes */\n.moonx-sdk-root .moonx-btn--sm  { height: 2.25rem; padding: 0 0.75rem; border-radius: var(--moonx-radius-button, var(--moonx-border-radius-md)); }\n.moonx-sdk-root .moonx-btn--md, .moonx-sdk-root .moonx-btn--default { height: 2.75rem; padding: 0 1rem; border-radius: var(--moonx-radius-button, var(--moonx-border-radius-md)); }\n.moonx-sdk-root .moonx-btn--lg  { height: 3rem; padding: 0 2rem; font-size: 1rem; border-radius: var(--moonx-radius-button, var(--moonx-border-radius-md)); }\n.moonx-sdk-root .moonx-btn--icon { width: 2rem; height: 2rem; padding: 0; border-radius: var(--moonx-radius-button, var(--moonx-border-radius-md)); }\n.moonx-sdk-root .moonx-btn--full { width: 100%; justify-content: center; }\n\n/* Variants */\n.moonx-sdk-root .moonx-btn--primary, .moonx-sdk-root .moonx-btn--default {\n  background-color: var(--moonx-button-bg, var(--moonx-color-accent)); color: var(--moonx-button-fg, var(--moonx-color-accent-foreground));\n  border: var(--moonx-button-border-width, 0px) solid var(--moonx-button-border-color, transparent);\n}\n.moonx-sdk-root .moonx-btn--primary:hover:not(:disabled), .moonx-sdk-root .moonx-btn--default:hover:not(:disabled) {\n  background-color: var(--moonx-color-accent-dark);\n}\n.moonx-sdk-root .moonx-btn--primary.moonx-state--success { background-color: var(--moonx-color-success); color: var(--moonx-color-success-foreground); }\n.moonx-sdk-root .moonx-btn--primary.moonx-state--error   { background-color: var(--moonx-color-error);   color: var(--moonx-color-error-foreground); }\n\n.moonx-sdk-root .moonx-btn--outline {\n  background-color: transparent; border: 1px solid var(--moonx-color-border); color: var(--moonx-color-foreground);\n}\n.moonx-sdk-root .moonx-btn--outline:hover:not(:disabled) { background-color: var(--moonx-color-background-2); border-color: var(--moonx-color-accent); }\n\n.moonx-sdk-root .moonx-btn--ghost  { background-color: transparent; color: var(--moonx-color-foreground); }\n.moonx-sdk-root .moonx-btn--ghost:hover:not(:disabled)  { background-color: var(--moonx-color-background-2); }\n\n.moonx-sdk-root .moonx-btn--secondary { background-color: var(--moonx-color-background-2); color: var(--moonx-color-foreground); }\n.moonx-sdk-root .moonx-btn--secondary:hover:not(:disabled) { background-color: var(--moonx-color-background-3); }\n\n.moonx-sdk-root .moonx-btn--destructive { background-color: var(--moonx-color-error); color: var(--moonx-color-error-foreground); }\n.moonx-sdk-root .moonx-btn--destructive:hover:not(:disabled) { opacity: 0.9; }\n\n.moonx-sdk-root .moonx-btn--link { background: transparent; color: var(--moonx-color-link, var(--moonx-color-accent)); text-decoration: underline; text-underline-offset: 4px; height: auto; padding: 0; }\n\n/* === Input === */\n.moonx-sdk-root .moonx-input {\n  display: flex; width: 100%; height: 2.75rem; padding: 0 0.75rem;\n  font-size: 0.875rem; font-family: inherit; color: var(--moonx-input-fg, var(--moonx-color-foreground));\n  background-color: var(--moonx-input-bg, transparent); border: var(--moonx-input-border-width, 1px) solid var(--moonx-input-border-color, var(--moonx-color-border));\n  border-radius: var(--moonx-radius-input, var(--moonx-border-radius-md)); outline: none;\n  transition: border-color 0.2s, box-shadow 0.2s; box-sizing: border-box;\n}\n.moonx-sdk-root .moonx-input:focus { border-color: var(--moonx-color-ring, var(--moonx-color-accent)); box-shadow: 0 0 0 1px var(--moonx-color-ring, var(--moonx-color-accent)); }\n.moonx-sdk-root .moonx-input:disabled { opacity: 0.5; cursor: not-allowed; }\n.moonx-sdk-root .moonx-input--error { border-color: var(--moonx-color-error); }\n\n/* === Label === */\n.moonx-sdk-root .moonx-label { display: block; font-size: 0.875rem; font-weight: var(--moonx-font-weight-medium, 500); color: var(--moonx-color-foreground); line-height: 1; }\n.moonx-sdk-root .moonx-label--secondary { color: var(--moonx-color-foreground-3); }\n.moonx-sdk-root .moonx-label--tertiary  { color: var(--moonx-color-foreground-4); font-size: 0.75rem; }\n.moonx-sdk-root .moonx-label--error     { color: var(--moonx-color-error); }\n.moonx-sdk-root .moonx-label--success   { color: var(--moonx-color-success); }\n\n/* === Detail Row === */\n.moonx-sdk-root .moonx-detail-row { display: flex; justify-content: space-between; align-items: center; padding: 0.25rem 0; }\n.moonx-sdk-root .moonx-detail-row__label { font-size: 0.875rem; color: var(--moonx-color-foreground-3); }\n.moonx-sdk-root .moonx-detail-row__value { font-size: 0.875rem; font-weight: 500; color: var(--moonx-color-foreground); text-align: right; }\n\n/* === Divider === */\n.moonx-sdk-root .moonx-divider { border-top: 1px solid var(--moonx-color-border); margin: 1rem 0; }\n\n/* === Boxes === */\n.moonx-sdk-root .moonx-box { padding: 0.75rem; border-radius: var(--moonx-border-radius-lg); }\n.moonx-sdk-root .moonx-box--surface  { background-color: var(--moonx-color-background-2); }\n.moonx-sdk-root .moonx-box--error    { background-color: var(--moonx-color-background-2); border: 1px solid var(--moonx-color-error); }\n.moonx-sdk-root .moonx-box--success  { background-color: var(--moonx-color-background-2); border: 1px solid var(--moonx-color-success); }\n.moonx-sdk-root .moonx-box--info     { background-color: var(--moonx-color-background-2); border: 1px solid var(--moonx-color-info, var(--moonx-color-border)); }\n.moonx-sdk-root .moonx-box--warning  { background-color: var(--moonx-color-background-2); border: 1px solid var(--moonx-color-warning, var(--moonx-color-error)); display: flex; align-items: flex-start; gap: 0.5rem; }\n.moonx-sdk-root .moonx-box--scrollable { overflow-y: auto; font-size: 0.875rem; white-space: pre-wrap; word-break: break-word; }\n\n/* === Address Pill === */\n.moonx-sdk-root .moonx-address-pill {\n  display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.25rem 0.75rem;\n  background-color: var(--moonx-color-background-3); color: var(--moonx-color-foreground);\n  border: 1px solid var(--moonx-color-border); border-radius: var(--moonx-border-radius-md);\n  font-size: 0.875rem; font-family: monospace; cursor: pointer;\n  transition: background-color 0.2s, border-color 0.2s;\n}\n.moonx-sdk-root .moonx-address-pill:hover { background-color: var(--moonx-color-background-2); }\n.moonx-sdk-root .moonx-address-pill--copied { border-color: var(--moonx-color-success); }\n\n/* === Mono Text === */\n.moonx-sdk-root .moonx-mono { font-family: monospace; font-size: 0.875rem; color: var(--moonx-color-foreground); }\n\n/* === Spinner === */\n.moonx-sdk-root .moonx-spinner {\n  display: inline-block; flex-shrink: 0;\n  border: 2px solid currentColor; border-top-color: transparent;\n  border-radius: 9999px; animation: moonx-spin 1s linear infinite;\n}\n.moonx-sdk-root .moonx-spinner--sm { width: 0.875rem; height: 0.875rem; }\n.moonx-sdk-root .moonx-spinner--md { width: 1rem; height: 1rem; }\n.moonx-sdk-root .moonx-spinner--lg { width: 1.5rem; height: 1.5rem; }\n.moonx-sdk-root .moonx-spinner--xl { width: 2rem; height: 2rem; }\n\n/* === Pulse skeleton === */\n.moonx-sdk-root .moonx-skeleton { background-color: var(--moonx-color-background-2); border-radius: 0.25rem; animation: moonx-pulse 2s cubic-bezier(0.4,0,0.6,1) infinite; }\n\n/* === Flow layout === */\n.moonx-sdk-root .moonx-flow-close { position: absolute; top: 1rem; right: 1.5rem; display: flex; align-items: center; flex-shrink: 0; z-index: 1; }\n.moonx-sdk-root .moonx-flow-header { display: flex; flex-direction: column; text-align: center; padding: 0 0.5rem 0.25rem; gap: 0.5rem; }\n.moonx-sdk-root .moonx-flow-content { display: flex; flex-direction: column; flex: 1; margin-top: 1rem; padding: 0 0.5rem; }\n.moonx-sdk-root .moonx-flow-footer {\n  position: absolute; bottom: 0; left: 0; right: 0;\n  background-color: var(--moonx-color-background); padding: 1rem 2rem 3rem;\n  margin: 0 0.125rem 0.125rem;\n  border-bottom-left-radius: var(--moonx-border-radius-lg);\n  border-bottom-right-radius: var(--moonx-border-radius-lg);\n}\n.moonx-sdk-root .moonx-flow-footer__actions { display: flex; gap: 0.75rem; }\n/* Buttons inside footer actions auto-stretch to fill space */\n.moonx-sdk-root .moonx-flow-footer__actions > .moonx-btn { flex: 1; height: 3rem; font-size: 1rem; }\n\n/* === Flow text utilities === */\n.moonx-sdk-root .moonx-text--heading { font-weight: var(--moonx-font-weight-heading, var(--moonx-font-weight-medium, 500)); font-family: var(--moonx-font-family-heading, inherit); letter-spacing: var(--moonx-letter-spacing-heading, inherit); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--moonx-color-heading, var(--moonx-color-foreground)); }\n.moonx-sdk-root .moonx-text--title { font-size: var(--moonx-font-size-heading, var(--moonx-font-size-lg, 1rem)); font-weight: var(--moonx-font-weight-heading, var(--moonx-font-weight-bold, 600)); font-family: var(--moonx-font-family-heading, inherit); letter-spacing: var(--moonx-letter-spacing-heading, inherit); color: var(--moonx-color-heading, var(--moonx-color-foreground)); }\n.moonx-sdk-root .moonx-text--secondary { font-size: var(--moonx-font-size-sm, 0.875rem); color: var(--moonx-color-foreground-3); }\n.moonx-sdk-root .moonx-text--error { font-size: 0.875rem; color: var(--moonx-color-error); }\n.moonx-sdk-root .moonx-text--success { font-size: 0.875rem; color: var(--moonx-color-success); }\n.moonx-sdk-root .moonx-flow-logo { display: flex; align-items: center; justify-content: center; }\n\n/* === Terms link row (accept-terms) === */\n.moonx-sdk-root .moonx-terms-link {\n  display: flex; flex-direction: row; align-items: center; justify-content: space-between;\n  border-radius: var(--moonx-border-radius-lg); padding: 0.75rem;\n  margin-left: 0.75rem; margin-right: 0.75rem;\n  border: 1px solid var(--moonx-color-border); cursor: pointer;\n  transition: background-color 0.2s ease;\n}\n.moonx-sdk-root .moonx-terms-link:hover { background-color: var(--moonx-color-background-2); }\n\n/* === Wallet item === */\n.moonx-sdk-root .moonx-wallet-item {\n  display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 1rem;\n  border: 1px solid var(--moonx-color-border); border-radius: var(--moonx-radius-button, var(--moonx-border-radius-lg));\n  background-color: var(--moonx-color-background); cursor: pointer;\n  transition: border-color 0.2s, background-color 0.2s;\n}\n.moonx-sdk-root .moonx-wallet-item:hover { border-color: var(--moonx-color-accent); background-color: var(--moonx-color-background-2); }\n.moonx-sdk-root .moonx-wallet-item--selected { border-color: var(--moonx-color-accent); background-color: var(--moonx-color-background-2); }\n\n/* === Flow overlay (z-index stack wrapper) === */\n.moonx-sdk-root .moonx-flow-overlay { position: relative; z-index: 100; }\n\n/* === Wallet connection state container === */\n.moonx-sdk-root .moonx-connect-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 3rem; padding-bottom: 3rem; }\n\n/* === Large wallet icon spinner === */\n.moonx-sdk-root .moonx-wallet-spinner { position: relative; width: 5rem; height: 5rem; display: flex; align-items: center; justify-content: center; }\n.moonx-sdk-root .moonx-wallet-spinner__ring { position: absolute; inset: 0; width: 5rem; height: 5rem; border-radius: 50%; border: 4px solid var(--moonx-color-border); }\n.moonx-sdk-root .moonx-wallet-spinner__ring--error { border-color: var(--moonx-color-error); }\n.moonx-sdk-root .moonx-wallet-spinner__spin { position: absolute; inset: 0; width: 5rem; height: 5rem; border-radius: 50%; border: 4px solid transparent; border-top-color: var(--moonx-color-accent); animation: moonx-spin 1s linear infinite; }\n.moonx-sdk-root .moonx-wallet-spinner__center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }\n\n/* === Data preview box (sign typed-data / transactions) === */\n.moonx-sdk-root .moonx-data-preview { margin-top: 0.25rem; padding: 0.75rem; background-color: var(--moonx-color-background-2); border-radius: var(--moonx-border-radius-md); font-size: 0.875rem; font-family: monospace; word-break: break-all; white-space: pre-line; user-select: none; -webkit-user-select: none; }\n\n/* === Scrollable data container (signing flows) === */\n.moonx-sdk-root .moonx-data-scroll { display: flex; flex-direction: column; max-height: 390px; overflow-y: auto; padding-bottom: 5rem; position: relative; }\n\n/* === Expand/collapse trigger === */\n.moonx-sdk-root .moonx-expand-toggle { display: inline-flex; align-items: center; cursor: pointer; user-select: none; -webkit-user-select: none; }\n\n/* === Scrollable bordered list (transaction detail panels) === */\n.moonx-sdk-root .moonx-scrollable-list { display: flex; flex-direction: column; overflow-y: auto; border: 1px solid var(--moonx-color-border); border-radius: var(--moonx-border-radius-md); scrollbar-width: none; }\n.moonx-sdk-root .moonx-scrollable-list::-webkit-scrollbar { display: none; }\n\n/* === Modal content column (passkey-enroll, add-passkey) === */\n.moonx-sdk-root .moonx-modal-content { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 1rem 1.5rem; gap: 1rem; }\n\n/* === Back nav button (absolute top-left) === */\n.moonx-sdk-root .moonx-back-btn { position: absolute; top: 1rem; left: 0.5rem; width: 2.5rem; height: 2.5rem; display: flex; align-items: center; justify-content: center; border-radius: var(--moonx-border-radius-full); }\n\n/* === Centered inline row (resend, action links) === */\n.moonx-sdk-root .moonx-center-row { display: flex; justify-content: center; align-items: center; gap: 0.25rem; }\n\n/* === Stacked button column (modal CTAs) === */\n.moonx-sdk-root .moonx-btn-stack { display: flex; flex-direction: column; gap: 0.5rem; width: 100%; padding-top: 0.5rem; }\n\n/* === Legal footer text (terms & privacy) === */\n.moonx-sdk-root .moonx-legal-text { font-size: 0.75rem; color: var(--moonx-color-foreground-3); text-align: center; line-height: 1.5; margin-top: 1rem; }\n.moonx-sdk-root .moonx-legal-text a { color: var(--moonx-color-link, var(--moonx-color-accent)); cursor: pointer; }\n/* Inline-checkbox variant: same typography, but flex layout aligned left so the checkbox sits beside the link text. */\n.moonx-sdk-root .moonx-legal-checkbox { display: flex; align-items: flex-start; justify-content: flex-start; text-align: left; gap: 0.5rem; }\n.moonx-sdk-root .moonx-legal-checkbox input[type="checkbox"] { margin-top: 0.15rem; cursor: pointer; }\n\n/* === Login gating (require_users_accept_terms) === */\n/* Wraps the email/social/wallet buttons so they can be visually disabled until the terms checkbox is ticked. The default state is unaffected. */\n.moonx-sdk-root .moonx-login-gateable { transition: opacity 0.15s ease-out; }\n.moonx-sdk-root .moonx-login-gated { opacity: 0.5; pointer-events: none; }\n\n/* === Shared entry animations === */\n@keyframes moonx-slide-in { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); } }\n@keyframes moonx-success-bounce { from { opacity: 0; transform: translateY(-50px) rotate(-60deg); } to { opacity: 1; transform: translateY(20px) rotate(0deg); } }\n@keyframes moonx-error-bounce { from { opacity: 0; transform: translateY(-50px) rotate(-60deg); } to { opacity: 1; transform: translateY(20px) rotate(0deg); } }\n@keyframes moonx-error-shake { 0%, 100% { transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { transform: translateX(-10px); } 20%, 40%, 60%, 80% { transform: translateX(10px); } }\n@keyframes moonx-mail-slide-in { from { opacity: 0; transform: translateX(-50px) rotate(-15deg); } to { opacity: 1; transform: translateX(0) rotate(0deg); } }\n@keyframes moonx-verified-slide-in { from { opacity: 0; transform: translateX(100px); } to { opacity: 1; transform: translateX(0); } }\n\n/* === Icon size utilities === */\n.moonx-sdk-root .moonx-icon--xs  { width: 0.75rem; height: 0.75rem; }\n.moonx-sdk-root .moonx-icon--sm  { width: 1rem;    height: 1rem;    }\n.moonx-sdk-root .moonx-icon--md  { width: 1.5rem;  height: 1.5rem;  }\n.moonx-sdk-root .moonx-icon--lg  { width: 2rem;    height: 2rem;    }\n.moonx-sdk-root .moonx-icon--xl  { width: 2.5rem;  height: 2.5rem;  }\n.moonx-sdk-root .moonx-icon--2xl { width: 3rem;    height: 3rem;    }\n.moonx-sdk-root .moonx-icon--mr-xs { margin-right: 0.25rem; }\n.moonx-sdk-root .moonx-icon--mr-sm { margin-right: 0.5rem; }\n.moonx-sdk-root .moonx-icon--accent  { color: var(--moonx-color-accent); }\n.moonx-sdk-root .moonx-icon--success { color: var(--moonx-color-success, #16a34a); }\n.moonx-sdk-root .moonx-icon--error   { color: var(--moonx-color-error); }\n.moonx-sdk-root .moonx-icon--muted   { color: var(--moonx-color-foreground-3); }\n.moonx-sdk-root .moonx-icon--fg      { color: var(--moonx-color-foreground); }\n\n/* === Layout utilities === */\n.moonx-sdk-root .moonx-flex-center     { display: flex; align-items: center; justify-content: center; }\n.moonx-sdk-root .moonx-flex-between    { display: flex; align-items: center; justify-content: space-between; }\n.moonx-sdk-root .moonx-flex-col        { display: flex; flex-direction: column; }\n.moonx-sdk-root .moonx-flex-col-center { display: flex; flex-direction: column; align-items: center; }\n\n/* === Text modifiers === */\n.moonx-sdk-root .moonx-text--semibold { font-weight: var(--moonx-font-weight-medium, 500); }\n.moonx-sdk-root .moonx-text--bold     { font-weight: var(--moonx-font-weight-bold, 600); }\n.moonx-sdk-root .moonx-text--center   { text-align: center; }\n.moonx-sdk-root .moonx-text--sm       { font-size: var(--moonx-font-size-sm, 0.875rem); }\n.moonx-sdk-root .moonx-text--lg       { font-size: var(--moonx-font-size-lg, 1.125rem); }\n.moonx-sdk-root .moonx-text--xl       { font-size: var(--moonx-font-size-xl, 1.25rem); }\n\n/* === Transaction detail card (success receipt) === */\n.moonx-sdk-root .moonx-detail-card { display: flex; flex-direction: column; border: 1px solid var(--moonx-color-border); border-radius: var(--moonx-border-radius-lg); padding: 1rem 0.5rem; margin: 2rem 0.5rem 0; }\n.moonx-sdk-root .moonx-detail-card__rows { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; }\n\n/* === Failed-transaction error scroll box === */\n.moonx-sdk-root .moonx-error-scroll { display: flex; flex-direction: column; background-color: var(--moonx-color-background-2); border: 1px solid var(--moonx-color-border); border-radius: var(--moonx-border-radius-lg); padding: 1rem 0.5rem; margin: 0.5rem; height: 150px; overflow: auto; }\n\n/* === Network logo badge (ethereum/solana pair) === */\n.moonx-sdk-root .moonx-network-badge { width: 32px; height: 32px; border-radius: 16px; border: 1px solid var(--moonx-color-border); background-color: var(--moonx-color-background-2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }\n.moonx-sdk-root .moonx-network-badge--overlap { margin-left: -8px; }\n\n/* === Positioned icons inside inputs === */\n.moonx-sdk-root .moonx-search-icon { position: absolute; left: 0.75rem; top: 0.875rem; color: var(--moonx-color-foreground-3); }\n.moonx-sdk-root .moonx-input-icon--left { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); color: var(--moonx-color-foreground-3); pointer-events: none; }\n\n/* === Step indicator (N of M) === */\n.moonx-sdk-root .moonx-step-label { font-size: 0.75rem; font-weight: 600; color: var(--moonx-color-accent); letter-spacing: 0.05em; text-transform: uppercase; }\n\n/* === Feature bullet item (passkey enroll) === */\n.moonx-sdk-root .moonx-feature-item { display: flex; align-items: flex-start; gap: 0.75rem; text-align: left; font-size: 0.875rem; color: var(--moonx-color-foreground); }\n\n/* === Monospace textarea (import wallet) === */\n.moonx-sdk-root .moonx-mono-textarea { width: 100%; min-height: 100px; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; background-color: var(--moonx-color-background-2); color: var(--moonx-color-foreground); border: 1px solid var(--moonx-color-border); border-radius: var(--moonx-radius-input, var(--moonx-border-radius-md)); outline: none; resize: vertical; }\n\n/* === Sign-flow inner section and row === */\n.moonx-sdk-root .moonx-sign-section { padding: 0.5rem; }\n.moonx-sdk-root .moonx-sign-row { display: flex; align-items: center; justify-content: space-between; }\n\n/* === External wallet connect button (login flow) === */\n.moonx-sdk-root .moonx-external-wallet-btn { border-radius: var(--moonx-radius-button, var(--moonx-border-radius-lg)); border: var(--moonx-button-border-width, 1px) solid var(--moonx-button-border-color, var(--moonx-color-border)); color: var(--moonx-button-fg, var(--moonx-color-foreground)); padding: 0.75rem 0.25rem; cursor: pointer; margin-top: 0.75rem; transition: all 0.2s ease-in-out; background-color: var(--moonx-button-bg, transparent); }\n.moonx-sdk-root .moonx-external-wallet-btn:hover { border-color: var(--moonx-button-border-color-hover, var(--moonx-color-accent)); background-color: var(--moonx-button-bg-hover, var(--moonx-color-background-2)); }\n.moonx-sdk-root .moonx-external-wallet-btn--accent-hover:hover { background-color: var(--moonx-color-accent); }\n.moonx-sdk-root .moonx-external-wallet-btn__inner { display: flex; flex-direction: row; align-items: center; gap: 0.5rem; animation: moonx-slide-in 0.3s ease-out 0.1s both; }\n\n/* === Flex row utility (icon + label pairs) === */\n.moonx-sdk-root .moonx-flex-row { display: flex; flex-direction: row; align-items: center; gap: 0.5rem; }\n\n/* === Login landing layout === */\n.moonx-sdk-root .moonx-header { position: absolute; top: 1.5rem; left: 0; right: 0; text-align: center; font-family: var(--moonx-font-family-heading, inherit); font-size: var(--moonx-font-size-heading, 0.875rem); font-weight: var(--moonx-font-weight-heading, 500); letter-spacing: var(--moonx-letter-spacing-heading, inherit); color: var(--moonx-color-heading, var(--moonx-color-foreground)); margin-bottom: 0.5rem; padding-left: 3rem; padding-right: 3rem; }\n.moonx-sdk-root .moonx-header__inner { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.moonx-sdk-root .moonx-content-wrapper { padding-top: 1rem; padding-bottom: 1rem; width: 100%; }\n.moonx-sdk-root .moonx-logo-section { text-align: center; margin-bottom: 1rem; }\n.moonx-sdk-root .moonx-logo-section__inner { padding-top: 1rem; padding-bottom: 1rem; }\n.moonx-sdk-root .moonx-description { padding-left: 1.25rem; padding-right: 1.25rem; text-align: center; color: var(--moonx-color-foreground-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.moonx-sdk-root .moonx-form-section { padding: 0.5rem 1rem; }\n\n/* === Email OTP content fill === */\n.moonx-sdk-root .moonx-otp-content { flex-grow: 1; display: flex; flex-direction: column; justify-content: center; }\n\n/* === Wallet icon status overlay badge === */\n.moonx-sdk-root .moonx-wallet-status-badge { position: absolute; bottom: -4px; right: -4px; background-color: var(--moonx-color-background); border-radius: 50%; display: flex; align-items: center; justify-content: center; }\n\n/* === Wallet connect success animation === */\n@keyframes fadeInScale { from { opacity: 0; transform: scale(0.8); } to { opacity: 1; transform: scale(1); } }\n';
 // src/components/scoped-container.tsx
 import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
 function ScopedContainer(param) {
@@ -3548,12 +3548,12 @@ function ScopedContainer(param) {
         boxSizing: "border-box",
         WebkitFontSmoothing: "antialiased",
         MozOsxFontSmoothing: "grayscale",
-        fontFamily: "var(--moonkey-font-family)",
+        fontFamily: "var(--moonx-font-family)",
         letterSpacing: "var(--moonx-letter-spacing, normal)",
         color: mergedTheme.colors.foreground
     });
     return /* @__PURE__ */ jsxs2("div", {
-        className: "moonkey-sdk-root".concat(className ? " ".concat(className) : ""),
+        className: "moonx-sdk-root".concat(className ? " ".concat(className) : ""),
         style: containerStyles,
         "data-theme": isDark ? "dark" : "light",
         children: [
@@ -3574,17 +3574,18 @@ function ScopedContainer(param) {
 }
 // src/components/vanilla-ui/root-card.tsx
 import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+var MODAL_PORTAL_Z_INDEX = 2147483646;
 function RootCard(param) {
     var children = param.children, _param_centerContent = param.centerContent, centerContent = _param_centerContent === void 0 ? true : _param_centerContent, _param_embedded = param.embedded, embedded = _param_embedded === void 0 ? false : _param_embedded, _param_isDark = param.isDark, isDark = _param_isDark === void 0 ? false : _param_isDark, theme = param.theme, appearance = param.appearance;
     var minHeight = "500px";
     var cardStyle = {
         minHeight: minHeight,
         width: "100%",
-        borderRadius: "var(--moonx-radius-card, var(--moonkey-border-radius-lg))",
+        borderRadius: "var(--moonx-radius-card, var(--moonx-border-radius-lg))",
         boxShadow: "var(--moonx-card-shadow, 0 25px 50px -12px rgb(0 0 0 / 0.25))",
-        border: "var(--moonx-card-border-width, 1px) solid var(--moonx-card-border-color, var(--moonkey-color-border))",
+        border: "var(--moonx-card-border-width, 1px) solid var(--moonx-card-border-color, var(--moonx-color-border))",
         position: "relative",
-        backgroundColor: "var(--moonkey-color-background)",
+        backgroundColor: "var(--moonx-color-background)",
         color: "var(--moonx-card-fg, inherit)",
         display: "flex",
         flexDirection: "column",
@@ -3647,10 +3648,10 @@ function RootCard(param) {
             theme: theme,
             appearance: appearance,
             children: /* @__PURE__ */ jsx6("div", {
-                className: cx("moonkey-root-card", "moonkey-embedded"),
+                className: cx("moonx-root-card", "moonx-embedded"),
                 style: cardStyle,
                 children: /* @__PURE__ */ jsx6("div", {
-                    className: "moonkey-card-content",
+                    className: "moonx-card-content",
                     style: contentStyle,
                     children: children
                 })
@@ -3663,8 +3664,8 @@ function RootCard(param) {
     useEffect7(function() {
         if (typeof window === "undefined") return;
         var portalDiv = document.createElement("div");
-        portalDiv.id = "moonkey-modal-portal";
-        portalDiv.style.cssText = "\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      z-index: 2147483647;\n      pointer-events: none;\n    ";
+        portalDiv.id = "moonx-modal-portal";
+        portalDiv.style.cssText = "\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      z-index: ".concat(MODAL_PORTAL_Z_INDEX, ";\n      pointer-events: none;\n    ");
         document.body.appendChild(portalDiv);
         setPortalContainer(portalDiv);
         return function() {
@@ -3728,29 +3729,29 @@ function RootCard(param) {
         children: [
             /* @__PURE__ */ jsx6("style", {
                 dangerouslySetInnerHTML: {
-                    __html: "\n          @keyframes fadeInZoom {\n            from {\n              opacity: 0;\n              transform: scale(0.95);\n            }\n            to {\n              opacity: 1;\n              transform: scale(1);\n            }\n          }\n\n          @keyframes slideUpFromBottom {\n            from {\n              opacity: 0;\n              transform: translateY(100%);\n            }\n            to {\n              opacity: 1;\n              transform: translateY(0);\n            }\n          }\n\n          /* Fix for mobile keyboard - use dvh units */\n          .moonkey-modal-overlay,\n          .moonkey-modal-container {\n            height: 100dvh !important;\n            min-height: 100dvh !important;\n            pointer-events: auto !important;\n          }\n\n          /* Desktop: centered modal with zoom animation */\n          .moonkey-modal-card {\n            animation: fadeInZoom 0.2s ease-out;\n          }\n\n          /* Mobile: bottom sheet with slide up animation */\n          @media (max-width: 768px) {\n            .moonkey-modal-container {\n              align-items: flex-end !important;\n              padding: 0 !important;\n              /* Prevent layout shift when keyboard opens */\n              position: fixed !important;\n              overscroll-behavior: contain !important;\n            }\n\n            .moonkey-modal-wrapper {\n              max-width: 100% !important;\n              width: 100% !important;\n            }\n\n            .moonkey-modal-card {\n              animation: slideUpFromBottom 0.3s ease-out !important;\n              max-width: 100% !important;\n              width: 100% !important;\n              border-bottom-left-radius: 0 !important;\n              border-bottom-right-radius: 0 !important;\n              border-top-left-radius: 1.5rem !important;\n              border-top-right-radius: 1.5rem !important;\n              margin: 0 !important;\n              max-height: 100dvh !important;\n              overflow-y: auto !important;\n              /* Prevent bounce/rubber-band scrolling on iOS */\n              overscroll-behavior: contain !important;\n              /* Smooth scrolling on iOS */\n              -webkit-overflow-scrolling: touch !important;\n              /* Prevent zoom on input focus */\n              touch-action: manipulation !important;\n            }\n\n            /* Ensure content is scrollable when keyboard is open */\n            .moonkey-card-content {\n              overflow-y: auto !important;\n              -webkit-overflow-scrolling: touch !important;\n              overscroll-behavior: contain !important;\n              /* Prevent content from shifting */\n              position: relative !important;\n            }\n\n            /* Prevent input zoom on iOS */\n            .moonkey-modal-card input,\n            .moonkey-modal-card textarea,\n            .moonkey-modal-card select {\n              font-size: 16px !important;\n              touch-action: manipulation !important;\n            }\n          }\n\n          /* Fallback for browsers that don't support dvh */\n          @supports not (height: 100dvh) {\n            .moonkey-modal-overlay,\n            .moonkey-modal-container {\n              height: 100vh !important;\n              min-height: -webkit-fill-available !important;\n            }\n          }\n        "
+                    __html: "\n          @keyframes fadeInZoom {\n            from {\n              opacity: 0;\n              transform: scale(0.95);\n            }\n            to {\n              opacity: 1;\n              transform: scale(1);\n            }\n          }\n\n          @keyframes slideUpFromBottom {\n            from {\n              opacity: 0;\n              transform: translateY(100%);\n            }\n            to {\n              opacity: 1;\n              transform: translateY(0);\n            }\n          }\n\n          /* Fix for mobile keyboard - use dvh units */\n          .moonx-modal-overlay,\n          .moonx-modal-container {\n            height: 100dvh !important;\n            min-height: 100dvh !important;\n            pointer-events: auto !important;\n          }\n\n          /* Desktop: centered modal with zoom animation */\n          .moonx-modal-card {\n            animation: fadeInZoom 0.2s ease-out;\n          }\n\n          /* Mobile: bottom sheet with slide up animation */\n          @media (max-width: 768px) {\n            .moonx-modal-container {\n              align-items: flex-end !important;\n              padding: 0 !important;\n              /* Prevent layout shift when keyboard opens */\n              position: fixed !important;\n              overscroll-behavior: contain !important;\n            }\n\n            .moonx-modal-wrapper {\n              max-width: 100% !important;\n              width: 100% !important;\n            }\n\n            .moonx-modal-card {\n              animation: slideUpFromBottom 0.3s ease-out !important;\n              max-width: 100% !important;\n              width: 100% !important;\n              border-bottom-left-radius: 0 !important;\n              border-bottom-right-radius: 0 !important;\n              border-top-left-radius: 1.5rem !important;\n              border-top-right-radius: 1.5rem !important;\n              margin: 0 !important;\n              max-height: 100dvh !important;\n              overflow-y: auto !important;\n              /* Prevent bounce/rubber-band scrolling on iOS */\n              overscroll-behavior: contain !important;\n              /* Smooth scrolling on iOS */\n              -webkit-overflow-scrolling: touch !important;\n              /* Prevent zoom on input focus */\n              touch-action: manipulation !important;\n            }\n\n            /* Ensure content is scrollable when keyboard is open */\n            .moonx-card-content {\n              overflow-y: auto !important;\n              -webkit-overflow-scrolling: touch !important;\n              overscroll-behavior: contain !important;\n              /* Prevent content from shifting */\n              position: relative !important;\n            }\n\n            /* Prevent input zoom on iOS */\n            .moonx-modal-card input,\n            .moonx-modal-card textarea,\n            .moonx-modal-card select {\n              font-size: 16px !important;\n              touch-action: manipulation !important;\n            }\n          }\n\n          /* Fallback for browsers that don't support dvh */\n          @supports not (height: 100dvh) {\n            .moonx-modal-overlay,\n            .moonx-modal-container {\n              height: 100vh !important;\n              min-height: -webkit-fill-available !important;\n            }\n          }\n        "
                 }
             }),
             /* @__PURE__ */ jsx6("div", {
-                className: "moonkey-modal-overlay",
+                className: "moonx-modal-overlay",
                 style: _object_spread_props(_object_spread({}, modalOverlayStyle), {
                     pointerEvents: "auto"
                 })
             }),
             /* @__PURE__ */ jsx6("div", {
                 ref: modalContainerRef,
-                className: "moonkey-modal-container",
+                className: "moonx-modal-container",
                 style: _object_spread_props(_object_spread({}, modalContainerStyle), {
                     pointerEvents: "auto"
                 }),
                 children: /* @__PURE__ */ jsx6("div", {
-                    className: "moonkey-modal-wrapper",
+                    className: "moonx-modal-wrapper",
                     style: modalWrapperStyle,
                     children: /* @__PURE__ */ jsx6("div", {
-                        className: cx("moonkey-root-card", "moonkey-modal", "moonkey-modal-card"),
+                        className: cx("moonx-root-card", "moonx-modal", "moonx-modal-card"),
                         style: modalCardStyle,
                         children: /* @__PURE__ */ jsx6("div", {
-                            className: "moonkey-card-content",
+                            className: "moonx-card-content",
                             style: contentStyle,
                             children: children
                         })
@@ -3807,7 +3808,7 @@ var CountdownTimer = function CountdownTimer(param) {
         fontWeight: "500"
     };
     return /* @__PURE__ */ jsxs4("div", {
-        className: cx("moonkey-countdown-timer", className),
+        className: cx("moonx-countdown-timer", className),
         style: containerStyle,
         children: [
             /* @__PURE__ */ jsx7("div", {
@@ -3898,21 +3899,21 @@ function SimpleOtpInput(param) {
         var isFocused = focusedIndex === index;
         var isFirst = index === 0;
         var isLast = index === length - 1;
-        var borderColor = "var(--moonkey-color-border)";
-        var backgroundColor = "var(--moonkey-color-background)";
-        var textColor = "var(--moonkey-color-foreground)";
+        var borderColor = "var(--moonx-color-border)";
+        var backgroundColor = "var(--moonx-color-background)";
+        var textColor = "var(--moonx-color-foreground)";
         if (validationState === "success") {
-            borderColor = "var(--moonkey-color-success)";
-            backgroundColor = "var(--moonkey-color-background-2)";
-            textColor = "var(--moonkey-color-success)";
+            borderColor = "var(--moonx-color-success)";
+            backgroundColor = "var(--moonx-color-background-2)";
+            textColor = "var(--moonx-color-success)";
         } else if (validationState === "error") {
-            borderColor = "var(--moonkey-color-error)";
-            backgroundColor = "var(--moonkey-color-background-2)";
-            textColor = "var(--moonkey-color-error)";
+            borderColor = "var(--moonx-color-error)";
+            backgroundColor = "var(--moonx-color-background-2)";
+            textColor = "var(--moonx-color-error)";
         } else if (isFilled) {
-            borderColor = "var(--moonkey-color-foreground)";
+            borderColor = "var(--moonx-color-foreground)";
         } else if (isFocused) {
-            borderColor = "var(--moonkey-color-accent)";
+            borderColor = "var(--moonx-color-accent)";
         }
         return {
             width: "3rem",
@@ -3924,10 +3925,10 @@ function SimpleOtpInput(param) {
             borderBottom: "1px solid ".concat(borderColor),
             borderRight: "1px solid ".concat(borderColor),
             borderLeft: isFirst ? "1px solid ".concat(borderColor) : "none",
-            borderTopLeftRadius: isFirst ? "var(--moonkey-border-radius-md)" : 0,
-            borderBottomLeftRadius: isFirst ? "var(--moonkey-border-radius-md)" : 0,
-            borderTopRightRadius: isLast ? "var(--moonkey-border-radius-md)" : 0,
-            borderBottomRightRadius: isLast ? "var(--moonkey-border-radius-md)" : 0,
+            borderTopLeftRadius: isFirst ? "var(--moonx-border-radius-md)" : 0,
+            borderBottomLeftRadius: isFirst ? "var(--moonx-border-radius-md)" : 0,
+            borderTopRightRadius: isLast ? "var(--moonx-border-radius-md)" : 0,
+            borderBottomRightRadius: isLast ? "var(--moonx-border-radius-md)" : 0,
             backgroundColor: backgroundColor,
             color: textColor,
             outline: "none",
@@ -3935,7 +3936,7 @@ function SimpleOtpInput(param) {
             boxShadow: isFocused ? "0 0 0 3px rgba(99, 102, 241, 0.1)" : "0 1px 2px 0 rgb(0 0 0 / 0.05)",
             cursor: disabled ? "not-allowed" : "text",
             opacity: disabled ? 0.5 : 1,
-            fontFamily: "var(--moonkey-font-family)"
+            fontFamily: "var(--moonx-font-family)"
         };
     };
     var containerStyle = {
@@ -4027,7 +4028,7 @@ function AddressPill(param) {
     var label = address.length > prefixLen + suffixLen ? "".concat(address.slice(0, prefixLen), "...").concat(address.slice(-suffixLen)) : address;
     return /* @__PURE__ */ jsxs5("button", {
         type: "button",
-        className: cx("moonkey-address-pill", copied && "moonkey-address-pill--copied", className),
+        className: cx("moonx-address-pill", copied && "moonx-address-pill--copied", className),
         onClick: handleCopy,
         title: address,
         children: [
@@ -4036,7 +4037,7 @@ function AddressPill(param) {
                 style: {
                     width: "1rem",
                     height: "1rem",
-                    color: "var(--moonkey-color-success)"
+                    color: "var(--moonx-color-success)"
                 }
             }) : /* @__PURE__ */ jsx9(Copy, {
                 style: {
@@ -4066,13 +4067,13 @@ var ExpiryPill = function ExpiryPill(param) {
                 alignItems: "center",
                 gap: "0.4rem",
                 padding: "0.35rem 0.75rem",
-                borderRadius: "var(--moonkey-border-radius-full, 9999px)",
+                borderRadius: "var(--moonx-border-radius-full, 9999px)",
                 fontSize: "0.8125rem",
                 lineHeight: 1,
                 fontVariantNumeric: "tabular-nums",
-                backgroundColor: "var(--moonkey-color-background-2, #f9fafb)",
-                color: urgent ? "var(--moonkey-color-error, #ef4444)" : "var(--moonkey-color-foreground-3, #6b7280)",
-                border: "1px solid var(--moonkey-color-border, #e5e7eb)"
+                backgroundColor: "var(--moonx-color-background-2, #f9fafb)",
+                color: urgent ? "var(--moonx-color-error, #ef4444)" : "var(--moonx-color-foreground-3, #6b7280)",
+                border: "1px solid var(--moonx-color-border, #e5e7eb)"
             },
             children: [
                 /* @__PURE__ */ jsx10(Clock, {
@@ -4118,10 +4119,10 @@ function ErrorBox(param) {
             "aria-hidden": "true"
         });
         return /* @__PURE__ */ jsxs7("div", _object_spread_props(_object_spread({}, a11yProps), {
-            className: cx("moonkey-text--error", className),
+            className: cx("moonx-text--error", className),
             style: _object_spread({
                 fontSize: "0.875rem",
-                color: "var(--moonkey-color-error)",
+                color: "var(--moonx-color-error)",
                 textAlign: resolvedAlign,
                 display: "flex",
                 alignItems: "center",
@@ -4138,7 +4139,7 @@ function ErrorBox(param) {
         }));
     }
     return /* @__PURE__ */ jsxs7("div", _object_spread_props(_object_spread({}, a11yProps), {
-        className: cx("moonkey-box moonkey-box--warning", className),
+        className: cx("moonx-box moonx-box--warning", className),
         style: style,
         children: [
             icon && /* @__PURE__ */ jsx11("span", {
@@ -4148,14 +4149,14 @@ function ErrorBox(param) {
                     marginTop: "0.125rem",
                     width: "1.25rem",
                     height: "1.25rem",
-                    color: "var(--moonkey-color-error)"
+                    color: "var(--moonx-color-error)"
                 },
                 children: icon
             }),
             /* @__PURE__ */ jsx11("span", {
                 style: _object_spread({
                     fontSize: "0.875rem",
-                    color: "var(--moonkey-color-error)"
+                    color: "var(--moonx-color-error)"
                 }, align === "center" && {
                     textAlign: "center",
                     flex: 1
@@ -4170,7 +4171,7 @@ import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 function SuccessBox(param) {
     var children = param.children, icon = param.icon, className = param.className;
     return /* @__PURE__ */ jsxs8("div", {
-        className: cx("moonkey-box moonkey-box--success", className),
+        className: cx("moonx-box moonx-box--success", className),
         style: {
             display: "flex",
             alignItems: "flex-start",
@@ -4183,14 +4184,14 @@ function SuccessBox(param) {
                     marginTop: "0.125rem",
                     width: "1.25rem",
                     height: "1.25rem",
-                    color: "var(--moonkey-color-success)"
+                    color: "var(--moonx-color-success)"
                 },
                 children: icon
             }),
             /* @__PURE__ */ jsx12("span", {
                 style: {
                     fontSize: "0.875rem",
-                    color: "var(--moonkey-color-success)"
+                    color: "var(--moonx-color-success)"
                 },
                 children: children
             })
@@ -4207,7 +4208,7 @@ function MonoText(_0) {
         "className"
     ]);
     return /* @__PURE__ */ jsx14("span", _object_spread_props(_object_spread({
-        className: cx("moonkey-mono", className)
+        className: cx("moonx-mono", className)
     }, props), {
         children: children
     }));
@@ -4217,14 +4218,14 @@ import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 function DetailRow(param) {
     var label = param.label, value = param.value, className = param.className;
     return /* @__PURE__ */ jsxs9("div", {
-        className: cx("moonkey-detail-row", className),
+        className: cx("moonx-detail-row", className),
         children: [
             /* @__PURE__ */ jsx15("span", {
-                className: "moonkey-detail-row__label",
+                className: "moonx-detail-row__label",
                 children: label
             }),
             /* @__PURE__ */ jsx15("span", {
-                className: "moonkey-detail-row__value",
+                className: "moonx-detail-row__value",
                 children: value
             })
         ]
@@ -4538,14 +4539,14 @@ var AddPasskey = function AddPasskey(param) {
     };
     var renderLogo = function renderLogo() {
         return /* @__PURE__ */ jsx16("div", {
-            className: "moonkey-flow-logo",
+            className: "moonx-flow-logo",
             style: {
                 paddingTop: "1rem"
             },
             children: customLogoUrl ? /* @__PURE__ */ jsx16("img", {
                 src: customLogoUrl,
                 alt: "",
-                className: "moonkey-icon--lg",
+                className: "moonx-icon--lg",
                 style: {
                     objectFit: "contain"
                 }
@@ -4566,22 +4567,22 @@ var AddPasskey = function AddPasskey(param) {
             theme: config === null || config === void 0 ? void 0 : (_config_config6 = config.config) === null || _config_config6 === void 0 ? void 0 : _config_config6.theme,
             appearance: config === null || config === void 0 ? void 0 : (_config_config7 = config.config) === null || _config_config7 === void 0 ? void 0 : _config_config7.appearance,
             children: /* @__PURE__ */ jsxs10("div", {
-                className: cx("moonkey-add-passkey", "moonkey-add-passkey-success", "moonkey-modal-content"),
+                className: cx("moonx-add-passkey", "moonx-add-passkey-success", "moonx-modal-content"),
                 children: [
                     renderLogo(),
                     /* @__PURE__ */ jsx16(CheckCircle2, {
-                        className: "moonkey-icon--2xl moonkey-icon--success"
+                        className: "moonx-icon--2xl moonx-icon--success"
                     }),
                     /* @__PURE__ */ jsx16("div", {
-                        className: "moonkey-text--title moonkey-text--xl",
+                        className: "moonx-text--title moonx-text--xl",
                         children: "New passkey added"
                     }),
                     /* @__PURE__ */ jsx16("div", {
-                        className: "moonkey-text--secondary",
+                        className: "moonx-text--secondary",
                         children: "You can now unlock your wallet from this passkey too."
                     }),
                     /* @__PURE__ */ jsx16("div", {
-                        className: "moonkey-btn-stack",
+                        className: "moonx-btn-stack",
                         children: /* @__PURE__ */ jsx16(Button, {
                             onClick: function onClick() {
                                 return finish({
@@ -4603,15 +4604,15 @@ var AddPasskey = function AddPasskey(param) {
             theme: config === null || config === void 0 ? void 0 : (_config_config8 = config.config) === null || _config_config8 === void 0 ? void 0 : _config_config8.theme,
             appearance: config === null || config === void 0 ? void 0 : (_config_config9 = config.config) === null || _config_config9 === void 0 ? void 0 : _config_config9.appearance,
             children: /* @__PURE__ */ jsxs10("div", {
-                className: cx("moonkey-add-passkey", "moonkey-add-passkey-error", "moonkey-modal-content"),
+                className: cx("moonx-add-passkey", "moonx-add-passkey-error", "moonx-modal-content"),
                 children: [
                     renderLogo(),
                     /* @__PURE__ */ jsx16(AlertTriangle, {
                         "aria-hidden": true,
-                        className: "moonkey-icon--xl moonkey-icon--error"
+                        className: "moonx-icon--xl moonx-icon--error"
                     }),
                     /* @__PURE__ */ jsx16("div", {
-                        className: "moonkey-text--title moonkey-text--xl",
+                        className: "moonx-text--title moonx-text--xl",
                         children: recoverWithUnlock ? "Unlock expired" : "Couldn't add passkey"
                     }),
                     errorMessage && /* @__PURE__ */ jsx16(ErrorBox, {
@@ -4620,7 +4621,7 @@ var AddPasskey = function AddPasskey(param) {
                         children: errorMessage
                     }),
                     /* @__PURE__ */ jsxs10("div", {
-                        className: "moonkey-btn-stack",
+                        className: "moonx-btn-stack",
                         children: [
                             /* @__PURE__ */ jsx16(Button, {
                                 onClick: handleRetry,
@@ -4646,30 +4647,30 @@ var AddPasskey = function AddPasskey(param) {
             theme: config === null || config === void 0 ? void 0 : (_config_config10 = config.config) === null || _config_config10 === void 0 ? void 0 : _config_config10.theme,
             appearance: config === null || config === void 0 ? void 0 : (_config_config11 = config.config) === null || _config_config11 === void 0 ? void 0 : _config_config11.appearance,
             children: /* @__PURE__ */ jsxs10("div", {
-                className: cx("moonkey-add-passkey", "moonkey-add-passkey-step-1", "moonkey-modal-content"),
+                className: cx("moonx-add-passkey", "moonx-add-passkey-step-1", "moonx-modal-content"),
                 children: [
                     renderLogo(),
                     /* @__PURE__ */ jsx16("div", {
-                        className: "moonkey-step-label",
+                        className: "moonx-step-label",
                         children: "Step 1 of 2"
                     }),
                     /* @__PURE__ */ jsx16(KeyRound, {
-                        className: "moonkey-icon--xl moonkey-icon--accent"
+                        className: "moonx-icon--xl moonx-icon--accent"
                     }),
                     /* @__PURE__ */ jsx16("div", {
-                        className: "moonkey-text--title moonkey-text--xl",
+                        className: "moonx-text--title moonx-text--xl",
                         children: "Confirm with an existing passkey"
                     }),
                     /* @__PURE__ */ jsx16("div", {
-                        className: "moonkey-text--secondary",
+                        className: "moonx-text--secondary",
                         children: "To add another passkey, first prove you have access by unlocking with one you already use. Your wallet stays encrypted on this device throughout."
                     }),
                     errorMessage && /* @__PURE__ */ jsx16("div", {
-                        className: "moonkey-text--error",
+                        className: "moonx-text--error",
                         children: errorMessage
                     }),
                     /* @__PURE__ */ jsxs10("div", {
-                        className: "moonkey-btn-stack",
+                        className: "moonx-btn-stack",
                         children: [
                             /* @__PURE__ */ jsx16(Button, {
                                 onClick: handleUnlock,
@@ -4695,40 +4696,40 @@ var AddPasskey = function AddPasskey(param) {
         theme: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.theme,
         appearance: config === null || config === void 0 ? void 0 : (_config_config5 = config.config) === null || _config_config5 === void 0 ? void 0 : _config_config5.appearance,
         children: /* @__PURE__ */ jsxs10("div", {
-            className: cx("moonkey-add-passkey", "moonkey-add-passkey-step-2", "moonkey-modal-content"),
+            className: cx("moonx-add-passkey", "moonx-add-passkey-step-2", "moonx-modal-content"),
             children: [
                 renderLogo(),
                 /* @__PURE__ */ jsx16("div", {
-                    className: "moonkey-step-label",
+                    className: "moonx-step-label",
                     children: "Step 2 of 2"
                 }),
                 /* @__PURE__ */ jsx16(Plus, {
-                    className: "moonkey-icon--xl moonkey-icon--accent",
+                    className: "moonx-icon--xl moonx-icon--accent",
                     "aria-hidden": true
                 }),
                 /* @__PURE__ */ jsx16(Fingerprint, {
-                    className: "moonkey-icon--xl moonkey-icon--accent",
+                    className: "moonx-icon--xl moonx-icon--accent",
                     style: {
                         marginTop: "-1rem"
                     }
                 }),
                 /* @__PURE__ */ jsx16("div", {
-                    className: "moonkey-text--title moonkey-text--xl",
+                    className: "moonx-text--title moonx-text--xl",
                     children: "Add another passkey"
                 }),
                 /* @__PURE__ */ jsx16("div", {
-                    className: "moonkey-text--secondary",
+                    className: "moonx-text--secondary",
                     children: "On the next prompt, your browser or password manager will offer to create a new passkey. Pick a syncing option (iCloud Keychain, Google Password Manager, 1Password) so you keep access if you lose this device."
                 }),
                 secondsLeft !== null && /* @__PURE__ */ jsx16(ExpiryPill, {
                     secondsLeft: secondsLeft
                 }),
                 errorMessage && /* @__PURE__ */ jsx16("div", {
-                    className: "moonkey-text--error",
+                    className: "moonx-text--error",
                     children: errorMessage
                 }),
                 /* @__PURE__ */ jsxs10("div", {
-                    className: "moonkey-btn-stack",
+                    className: "moonx-btn-stack",
                     children: [
                         /* @__PURE__ */ jsx16(Button, {
                             onClick: handleEnroll,
@@ -4907,20 +4908,20 @@ var EmailOtpInput = function EmailOtpInput(param) {
     };
     return /* @__PURE__ */ jsx17(Fragment, {
         children: /* @__PURE__ */ jsx17("div", {
-            className: cx("moonkey-email-otp-input", "moonkey-flex-col"),
+            className: cx("moonx-email-otp-input", "moonx-flex-col"),
             style: {
                 marginTop: "1rem"
             },
             children: /* @__PURE__ */ jsx17("div", {
-                className: "moonkey-otp-content",
+                className: "moonx-otp-content",
                 children: /* @__PURE__ */ jsxs11("div", {
-                    className: "moonkey-flex-col",
+                    className: "moonx-flex-col",
                     style: {
                         gap: "1rem"
                     },
                     children: [
                         /* @__PURE__ */ jsx17(Label, {
-                            htmlFor: "moonkey-email-input",
+                            htmlFor: "moonx-email-input",
                             children: "Email address"
                         }),
                         /* @__PURE__ */ jsxs11("div", {
@@ -4929,13 +4930,13 @@ var EmailOtpInput = function EmailOtpInput(param) {
                             },
                             children: [
                                 /* @__PURE__ */ jsx17("div", {
-                                    className: "moonkey-input-icon--left",
+                                    className: "moonx-input-icon--left",
                                     children: /* @__PURE__ */ jsx17(Mail, {
-                                        className: "moonkey-icon--md"
+                                        className: "moonx-icon--md"
                                     })
                                 }),
                                 /* @__PURE__ */ jsx17(Input, {
-                                    id: "moonkey-email-input",
+                                    id: "moonx-email-input",
                                     type: "email",
                                     value: email,
                                     onChange: function onChange(e) {
@@ -4949,7 +4950,7 @@ var EmailOtpInput = function EmailOtpInput(param) {
                                         paddingRight: "5.3rem",
                                         paddingTop: "0.75rem",
                                         paddingBottom: "0.75rem",
-                                        borderRadius: "var(--moonx-radius-input, var(--moonkey-border-radius-lg))",
+                                        borderRadius: "var(--moonx-radius-input, var(--moonx-border-radius-lg))",
                                         fontSize: "1rem"
                                     },
                                     required: true
@@ -4969,9 +4970,9 @@ var EmailOtpInput = function EmailOtpInput(param) {
                                         size: "sm",
                                         disabled: !isEmailValid || isProcessing,
                                         children: isProcessing ? /* @__PURE__ */ jsxs11("svg", {
-                                            className: "moonkey-icon--sm",
+                                            className: "moonx-icon--sm",
                                             style: {
-                                                animation: "moonkey-spin 1s linear infinite"
+                                                animation: "moonx-spin 1s linear infinite"
                                             },
                                             fill: "none",
                                             viewBox: "0 0 24 24",
@@ -5515,49 +5516,49 @@ var EmailOtpVerify = function EmailOtpVerify(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx18("div", {
-                    className: "moonkey-back-btn",
+                    className: "moonx-back-btn",
                     children: /* @__PURE__ */ jsx18(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onBackPress,
                         disabled: isLoading,
                         children: /* @__PURE__ */ jsx18(ChevronLeft, {
-                            className: "moonkey-icon--md"
+                            className: "moonx-icon--md"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx18("div", {
-                    className: "moonkey-flex-col",
+                    className: "moonx-flex-col",
                     children: /* @__PURE__ */ jsxs12("div", {
-                        className: "moonkey-otp-content",
+                        className: "moonx-otp-content",
                         children: [
                             /* @__PURE__ */ jsx18("div", {
-                                className: "moonkey-flex-center",
+                                className: "moonx-flex-center",
                                 children: /* @__PURE__ */ jsx18("div", {
                                     style: {
-                                        animation: "moonkey-mail-slide-in 0.8s ease-out 0.4s both"
+                                        animation: "moonx-mail-slide-in 0.8s ease-out 0.4s both"
                                     },
                                     children: /* @__PURE__ */ jsx18(MailCheck, {
-                                        className: "moonkey-icon--2xl moonkey-icon--muted"
+                                        className: "moonx-icon--2xl moonx-icon--muted"
                                     })
                                 })
                             }),
                             /* @__PURE__ */ jsx18("div", {
-                                className: "moonkey-label moonkey-text--lg moonkey-text--center",
+                                className: "moonx-label moonx-text--lg moonx-text--center",
                                 style: {
                                     paddingTop: "1rem"
                                 },
                                 children: (config === null || config === void 0 ? void 0 : (_config_config5 = config.config) === null || _config_config5 === void 0 ? void 0 : (_config_config_emailConfig = _config_config5.emailConfig) === null || _config_config_emailConfig === void 0 ? void 0 : _config_config_emailConfig.verifyEmailTitle) || t("emailOtp.title")
                             }),
                             /* @__PURE__ */ jsxs12("div", {
-                                className: "moonkey-flex-col",
+                                className: "moonx-flex-col",
                                 style: {
                                     gap: "1.5rem",
                                     paddingTop: "1.5rem"
                                 },
                                 children: [
                                     /* @__PURE__ */ jsxs12("div", {
-                                        className: "moonkey-text--secondary moonkey-text--center",
+                                        className: "moonx-text--secondary moonx-text--center",
                                         style: {
                                             paddingLeft: "2rem",
                                             paddingRight: "2rem"
@@ -5566,7 +5567,7 @@ var EmailOtpVerify = function EmailOtpVerify(param) {
                                             t("emailOtp.descriptionStart"),
                                             " ",
                                             /* @__PURE__ */ jsx18("span", {
-                                                className: "moonkey-text--bold",
+                                                className: "moonx-text--bold",
                                                 title: emailOtpSendResponse.email,
                                                 children: formatEmailDisplay(emailOtpSendResponse.email)
                                             }),
@@ -5575,7 +5576,7 @@ var EmailOtpVerify = function EmailOtpVerify(param) {
                                         ]
                                     }),
                                     /* @__PURE__ */ jsx18("div", {
-                                        className: "moonkey-flex-col-center",
+                                        className: "moonx-flex-col-center",
                                         style: {
                                             paddingTop: "1rem",
                                             paddingBottom: "1rem"
@@ -5589,7 +5590,7 @@ var EmailOtpVerify = function EmailOtpVerify(param) {
                                             },
                                             children: [
                                                 validationState === "success" && /* @__PURE__ */ jsxs12("div", {
-                                                    className: "moonkey-text--success",
+                                                    className: "moonx-text--success",
                                                     style: {
                                                         textAlign: "right"
                                                     },
@@ -5615,7 +5616,7 @@ var EmailOtpVerify = function EmailOtpVerify(param) {
                                         children: errorMessage
                                     }),
                                     canResend ? /* @__PURE__ */ jsxs12("div", {
-                                        className: "moonkey-center-row",
+                                        className: "moonx-center-row",
                                         children: [
                                             /* @__PURE__ */ jsx18(Label, {
                                                 tone: "secondary",
@@ -5635,7 +5636,7 @@ var EmailOtpVerify = function EmailOtpVerify(param) {
                                                     },
                                                     children: [
                                                         /* @__PURE__ */ jsx18("span", {
-                                                            className: "moonkey-spinner moonkey-spinner--sm"
+                                                            className: "moonx-spinner moonx-spinner--sm"
                                                         }),
                                                         t("emailOtp.sending")
                                                     ]
@@ -5679,7 +5680,7 @@ var AnimatedCheck = function AnimatedCheck(param) {
         width: size,
         height: size,
         borderRadius: "50%",
-        backgroundColor: "var(--moonkey-color-success)",
+        backgroundColor: "var(--moonx-color-success)",
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
@@ -5761,7 +5762,7 @@ var EmailOtpVerified = function EmailOtpVerified(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config5 = config.config) === null || _config_config5 === void 0 ? void 0 : _config_config5.appearance,
         children: /* @__PURE__ */ jsxs14("div", {
             style: {
-                animation: "moonkey-verified-slide-in 0.4s ease-out 0.1s both"
+                animation: "moonx-verified-slide-in 0.4s ease-out 0.1s both"
             },
             children: [
                 /* @__PURE__ */ jsx20("div", {
@@ -5937,13 +5938,16 @@ var ExportKey = function ExportKey(param) {
         url.searchParams.append("wallet_type", walletType);
         url.searchParams.append("entropy_type", entropyType2);
         url.searchParams.append("displayMode", isDark ? "dark" : "light");
-        url.searchParams.append("user_handle_b64url", userHandleB64url);
-        url.searchParams.append("credential_id_b64url", credentialIdB64url);
-        url.searchParams.append("keyshare_read_token", keyshareReadToken);
         var themeVars = buildThemeParams();
         if (Object.keys(themeVars).length > 0) {
             url.searchParams.append("theme", JSON.stringify(themeVars));
         }
+        var secrets = new URLSearchParams({
+            user_handle_b64url: userHandleB64url,
+            credential_id_b64url: credentialIdB64url,
+            keyshare_read_token: keyshareReadToken
+        });
+        url.hash = secrets.toString();
         return url.toString();
     };
     var getWallet = function getWallet() {
@@ -6128,13 +6132,13 @@ var ExportKey = function ExportKey(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config6 = config.config) === null || _config_config6 === void 0 ? void 0 : _config_config6.appearance,
             children: [
                 /* @__PURE__ */ jsx22("div", {
-                    className: "moonkey-flow-close",
+                    className: "moonx-flow-close",
                     children: /* @__PURE__ */ jsx22(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onCancel,
                         children: /* @__PURE__ */ jsx22(X, {
-                            className: "moonkey-icon--sm"
+                            className: "moonx-icon--sm"
                         })
                     })
                 }),
@@ -6143,28 +6147,28 @@ var ExportKey = function ExportKey(param) {
                         gap: "1rem",
                         padding: "1.5rem"
                     },
-                    className: "moonkey-flex-col-center moonkey-text--center",
+                    className: "moonx-flex-col-center moonx-text--center",
                     children: [
                         /* @__PURE__ */ jsx22("div", {
                             style: {
                                 width: "3rem",
                                 height: "3rem",
                                 borderRadius: "50%",
-                                backgroundColor: "var(--moonkey-color-background-2)"
+                                backgroundColor: "var(--moonx-color-background-2)"
                             },
-                            className: "moonkey-flex-center",
+                            className: "moonx-flex-center",
                             children: /* @__PURE__ */ jsx22(ShieldOff, {
-                                className: "moonkey-icon--md moonkey-icon--muted"
+                                className: "moonx-icon--md moonx-icon--muted"
                             })
                         }),
                         /* @__PURE__ */ jsxs15("div", {
                             children: [
                                 /* @__PURE__ */ jsx22("p", {
-                                    className: "moonkey-text--title",
+                                    className: "moonx-text--title",
                                     children: t("exportKey.notAvailable")
                                 }),
                                 /* @__PURE__ */ jsx22("p", {
-                                    className: "moonkey-text--secondary",
+                                    className: "moonx-text--secondary",
                                     style: {
                                         paddingTop: "1rem"
                                     },
@@ -6184,21 +6188,21 @@ var ExportKey = function ExportKey(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsx22("div", {
-                className: "moonkey-flow-close",
+                className: "moonx-flow-close",
                 children: /* @__PURE__ */ jsx22(Button, {
                     variant: "ghost",
                     size: "icon",
                     onClick: onCancel,
                     children: /* @__PURE__ */ jsx22(X, {
-                        className: "moonkey-icon--sm"
+                        className: "moonx-icon--sm"
                     })
                 })
             }),
             /* @__PURE__ */ jsxs15("div", {
-                className: "moonkey-flow-header",
+                className: "moonx-flow-header",
                 children: [
                     /* @__PURE__ */ jsx22("p", {
-                        className: "moonkey-text--heading",
+                        className: "moonx-text--heading",
                         children: (_ref = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.title) !== null && _ref !== void 0 ? _ref : /* @__PURE__ */ jsxs15(Fragment3, {
                             children: [
                                 "Export ",
@@ -6214,7 +6218,7 @@ var ExportKey = function ExportKey(param) {
                 ]
             }),
             /* @__PURE__ */ jsxs15("div", {
-                className: "moonkey-flow-content",
+                className: "moonx-flow-content",
                 children: [
                     /* @__PURE__ */ jsx22(ErrorBox, {
                         icon: WarningIcon,
@@ -6224,7 +6228,7 @@ var ExportKey = function ExportKey(param) {
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.neverShareDescription) || t("exportKey.neverShare")
                     }),
                     /* @__PURE__ */ jsx22("div", {
-                        className: "moonkey-box moonkey-box--surface",
+                        className: "moonx-box moonx-box--surface",
                         style: {
                             marginBottom: "1rem"
                         },
@@ -6242,7 +6246,7 @@ var ExportKey = function ExportKey(param) {
                             gap: "0.5rem",
                             marginTop: "0.5rem"
                         },
-                        className: "moonkey-flex-col",
+                        className: "moonx-flex-col",
                         children: [
                             /* @__PURE__ */ jsx22(Button, {
                                 onClick: handleReveal,
@@ -6262,14 +6266,14 @@ var ExportKey = function ExportKey(param) {
                                     },
                                     children: [
                                         /* @__PURE__ */ jsx22(KeyRound2, {
-                                            className: "moonkey-icon--sm"
+                                            className: "moonx-icon--sm"
                                         }),
                                         "Reveal Key"
                                     ]
                                 })
                             }),
                             revealError && /* @__PURE__ */ jsx22("p", {
-                                className: "moonkey-text--error moonkey-text--center",
+                                className: "moonx-text--error moonx-text--center",
                                 children: revealError
                             })
                         ]
@@ -6279,12 +6283,15 @@ var ExportKey = function ExportKey(param) {
                         src: iframeUrl,
                         allow: "clipboard-write",
                         style: {
-                            width: "calc(100% + 1rem)",
-                            marginLeft: "-0.5rem",
-                            marginRight: "-0.5rem",
+                            // Match the sibling content width (never-share warning, wallet
+                            // box) — both sit inside `.moonkey-flow-content`'s 0.5rem inline
+                            // padding. A previous `calc(100% + 1rem)` + negative margins
+                            // full-bled the iframe into that padding, so the revealed key
+                            // rendered ~1rem wider than the warning above it.
+                            width: "100%",
                             height: "180px",
                             border: "none",
-                            borderRadius: "var(--moonkey-border-radius-lg)"
+                            borderRadius: "var(--moonx-border-radius-lg)"
                         }
                     })
                 ]
@@ -6302,7 +6309,7 @@ var FundingFailure = function FundingFailure(param) {
     var _config_config, _config_config_appearance, _config_config1, _config_config_appearance1, _config_config2, _config_config3, _config_config4;
     var isDark = propsIsDark !== void 0 ? propsIsDark : isDarkMode(config === null || config === void 0 ? void 0 : (_config_config = config.config) === null || _config_config === void 0 ? void 0 : _config_config.theme, config === null || config === void 0 ? void 0 : (_config_config1 = config.config) === null || _config_config1 === void 0 ? void 0 : (_config_config_appearance = _config_config1.appearance) === null || _config_config_appearance === void 0 ? void 0 : _config_config_appearance.displayMode, config === null || config === void 0 ? void 0 : (_config_config2 = config.config) === null || _config_config2 === void 0 ? void 0 : (_config_config_appearance1 = _config_config2.appearance) === null || _config_config_appearance1 === void 0 ? void 0 : _config_config_appearance1.backgroundColor);
     return /* @__PURE__ */ jsx23("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs16(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -6310,42 +6317,42 @@ var FundingFailure = function FundingFailure(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx23("div", {
-                    className: "moonkey-flex-center",
+                    className: "moonx-flex-center",
                     style: {
                         marginTop: "3rem"
                     },
                     children: /* @__PURE__ */ jsx23("div", {
                         style: {
-                            animation: "moonkey-error-shake 0.5s ease-out 0.1s both"
+                            animation: "moonx-error-shake 0.5s ease-out 0.1s both"
                         },
                         children: /* @__PURE__ */ jsx23(XCircle, {
-                            className: "moonkey-icon--2xl moonkey-icon--error"
+                            className: "moonx-icon--2xl moonx-icon--error"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx23("div", {
-                    className: "moonkey-text--lg moonkey-text--semibold moonkey-text--center",
+                    className: "moonx-text--lg moonx-text--semibold moonx-text--center",
                     style: {
                         paddingTop: "0.5rem"
                     },
                     children: "Funding Failed"
                 }),
                 /* @__PURE__ */ jsx23("div", {
-                    className: "moonkey-text--center",
+                    className: "moonx-text--center",
                     style: {
                         paddingTop: "2.5rem",
                         paddingLeft: "0.5rem",
                         paddingRight: "0.5rem"
                     },
                     children: /* @__PURE__ */ jsx23("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: "We couldn't complete your funding request. Please try again or contact support if the problem persists."
                     })
                 }),
                 /* @__PURE__ */ jsx23("div", {
-                    className: "moonkey-flow-footer",
+                    className: "moonx-flow-footer",
                     children: /* @__PURE__ */ jsx23("div", {
-                        className: "moonkey-flow-footer__actions",
+                        className: "moonx-flow-footer__actions",
                         children: /* @__PURE__ */ jsx23(Button, {
                             onClick: onClose,
                             children: "Try Again"
@@ -6362,7 +6369,7 @@ import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
 var FundingOptionButton = function FundingOptionButton(param) {
     var icon = param.icon, label = param.label, onClick = param.onClick;
     return /* @__PURE__ */ jsx24("div", {
-        className: "moonkey-wallet-item",
+        className: "moonx-wallet-item",
         onClick: onClick,
         children: /* @__PURE__ */ jsxs17("div", {
             style: {
@@ -6379,7 +6386,7 @@ var FundingOptionButton = function FundingOptionButton(param) {
                     children: icon
                 }),
                 /* @__PURE__ */ jsx24("div", {
-                    className: "moonkey-text--sm",
+                    className: "moonx-text--sm",
                     children: label
                 })
             ]
@@ -6398,7 +6405,7 @@ var FundingSelection = function FundingSelection(param) {
         children: /* @__PURE__ */ jsxs17("div", {
             children: [
                 /* @__PURE__ */ jsxs17("div", {
-                    className: "moonkey-flex-between",
+                    className: "moonx-flex-between",
                     children: [
                         /* @__PURE__ */ jsx24(Button, {
                             variant: "ghost",
@@ -6408,11 +6415,11 @@ var FundingSelection = function FundingSelection(param) {
                                 visibility: "hidden"
                             },
                             children: /* @__PURE__ */ jsx24(ArrowLeft, {
-                                className: "moonkey-icon--sm moonkey-icon--fg"
+                                className: "moonx-icon--sm moonx-icon--fg"
                             })
                         }),
                         /* @__PURE__ */ jsx24("span", {
-                            className: "moonkey-text--title",
+                            className: "moonx-text--title",
                             children: (uiConfig === null || uiConfig === void 0 ? void 0 : (_uiConfig_landing = uiConfig.landing) === null || _uiConfig_landing === void 0 ? void 0 : _uiConfig_landing.title) || "Add funds to your wallet"
                         }),
                         /* @__PURE__ */ jsx24(Button, {
@@ -6420,13 +6427,13 @@ var FundingSelection = function FundingSelection(param) {
                             size: "icon",
                             onClick: onClose,
                             children: /* @__PURE__ */ jsx24(X2, {
-                                className: "moonkey-icon--sm moonkey-icon--fg"
+                                className: "moonx-icon--sm moonx-icon--fg"
                             })
                         })
                     ]
                 }),
                 /* @__PURE__ */ jsxs17("div", {
-                    className: "moonkey-flex-col",
+                    className: "moonx-flex-col",
                     style: {
                         marginTop: "1rem",
                         gap: "0.5rem"
@@ -6434,7 +6441,7 @@ var FundingSelection = function FundingSelection(param) {
                     children: [
                         /* @__PURE__ */ jsx24(FundingOptionButton, {
                             icon: /* @__PURE__ */ jsx24(CreditCard, {
-                                className: "moonkey-icon--fg"
+                                className: "moonx-icon--fg"
                             }),
                             label: "Pay with card",
                             onClick: function onClick() {
@@ -6443,7 +6450,7 @@ var FundingSelection = function FundingSelection(param) {
                         }),
                         /* @__PURE__ */ jsx24(FundingOptionButton, {
                             icon: /* @__PURE__ */ jsx24(QrCode, {
-                                className: "moonkey-icon--fg"
+                                className: "moonx-icon--fg"
                             }),
                             label: "Receive funds",
                             onClick: function onClick() {
@@ -6464,7 +6471,7 @@ function FundingSuccess(param) {
     var _config_config, _config_config_appearance, _config_config1, _config_config_appearance1, _config_config2, _config_config3, _config_config4;
     var isDark = propsIsDark !== void 0 ? propsIsDark : isDarkMode(config === null || config === void 0 ? void 0 : (_config_config = config.config) === null || _config_config === void 0 ? void 0 : _config_config.theme, config === null || config === void 0 ? void 0 : (_config_config1 = config.config) === null || _config_config1 === void 0 ? void 0 : (_config_config_appearance = _config_config1.appearance) === null || _config_config_appearance === void 0 ? void 0 : _config_config_appearance.displayMode, config === null || config === void 0 ? void 0 : (_config_config2 = config.config) === null || _config_config2 === void 0 ? void 0 : (_config_config_appearance1 = _config_config2.appearance) === null || _config_config_appearance1 === void 0 ? void 0 : _config_config_appearance1.backgroundColor);
     return /* @__PURE__ */ jsx25("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs18(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -6472,39 +6479,39 @@ function FundingSuccess(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx25("div", {
-                    className: "moonkey-flex-center",
+                    className: "moonx-flex-center",
                     children: /* @__PURE__ */ jsx25("div", {
                         style: {
-                            animation: "moonkey-success-bounce 0.8s ease-out 0.1s both"
+                            animation: "moonx-success-bounce 0.8s ease-out 0.1s both"
                         },
                         children: /* @__PURE__ */ jsx25(CheckCircle22, {
-                            className: "moonkey-icon--2xl moonkey-icon--success"
+                            className: "moonx-icon--2xl moonx-icon--success"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx25("div", {
-                    className: "moonkey-text--lg moonkey-text--semibold moonkey-text--center",
+                    className: "moonx-text--lg moonx-text--semibold moonx-text--center",
                     style: {
                         paddingTop: "3rem"
                     },
                     children: "Funding Successful"
                 }),
                 /* @__PURE__ */ jsx25("div", {
-                    className: "moonkey-text--center",
+                    className: "moonx-text--center",
                     style: {
                         paddingTop: "2.5rem",
                         paddingLeft: "0.5rem",
                         paddingRight: "0.5rem"
                     },
                     children: /* @__PURE__ */ jsx25("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: "Your wallet has been funded successfully. The funds should appear in your account shortly."
                     })
                 }),
                 /* @__PURE__ */ jsx25("div", {
-                    className: "moonkey-flow-footer",
+                    className: "moonx-flow-footer",
                     children: /* @__PURE__ */ jsx25("div", {
-                        className: "moonkey-flow-footer__actions",
+                        className: "moonx-flow-footer__actions",
                         children: /* @__PURE__ */ jsx25(Button, {
                             onClick: onClose,
                             children: "Done"
@@ -6573,7 +6580,7 @@ var LoadingSpinner = function LoadingSpinner(param) {
                                     position: "absolute",
                                     inset: 0,
                                     borderRadius: "50%",
-                                    border: "4px solid var(--moonkey-color-background-2)"
+                                    border: "4px solid var(--moonx-color-background-2)"
                                 }
                             }),
                             /* @__PURE__ */ jsx26("div", {
@@ -6582,8 +6589,8 @@ var LoadingSpinner = function LoadingSpinner(param) {
                                     inset: 0,
                                     borderRadius: "50%",
                                     border: "4px solid transparent",
-                                    borderTopColor: "var(--moonkey-color-accent)",
-                                    animation: "moonkey-spin 1s linear infinite"
+                                    borderTopColor: "var(--moonx-color-accent)",
+                                    animation: "moonx-spin 1s linear infinite"
                                 }
                             }),
                             (iconUrl || iconComponent) && /* @__PURE__ */ jsx26("div", {
@@ -6628,7 +6635,7 @@ var LoadingSpinner = function LoadingSpinner(param) {
             }),
             text && /* @__PURE__ */ jsx26("div", {
                 style: {
-                    color: "var(--moonkey-color-foreground-3)",
+                    color: "var(--moonx-color-foreground-3)",
                     fontSize: "0.875rem"
                 },
                 children: text
@@ -6835,7 +6842,7 @@ var PayWithCard = function PayWithCard(param) {
         children: /* @__PURE__ */ jsxs20("div", {
             children: [
                 /* @__PURE__ */ jsxs20("div", {
-                    className: "moonkey-flex-between",
+                    className: "moonx-flex-between",
                     style: {
                         marginBottom: "1.5rem"
                     },
@@ -6845,11 +6852,11 @@ var PayWithCard = function PayWithCard(param) {
                             size: "icon",
                             onClick: onClose,
                             children: /* @__PURE__ */ jsx27(ArrowLeft2, {
-                                className: "moonkey-icon--sm moonkey-icon--fg"
+                                className: "moonx-icon--sm moonx-icon--fg"
                             })
                         }),
                         /* @__PURE__ */ jsx27("div", {
-                            className: "moonkey-text--title",
+                            className: "moonx-text--title",
                             style: {
                                 fontWeight: 600,
                                 flex: 1,
@@ -6862,7 +6869,7 @@ var PayWithCard = function PayWithCard(param) {
                             size: "icon",
                             onClick: onClose,
                             children: /* @__PURE__ */ jsx27(X3, {
-                                className: "moonkey-icon--sm moonkey-icon--fg"
+                                className: "moonx-icon--sm moonx-icon--fg"
                             })
                         })
                     ]
@@ -6872,7 +6879,7 @@ var PayWithCard = function PayWithCard(param) {
                         gap: "1.5rem",
                         padding: "1rem"
                     },
-                    className: "moonkey-flex-col-center",
+                    className: "moonx-flex-col-center",
                     children: isLoading ? /* @__PURE__ */ jsxs20(Fragment4, {
                         children: [
                             /* @__PURE__ */ jsx27(LoadingSpinner, {
@@ -6880,7 +6887,7 @@ var PayWithCard = function PayWithCard(param) {
                                 iconUrl: moonpay_default
                             }),
                             /* @__PURE__ */ jsx27("div", {
-                                className: "moonkey-text--secondary moonkey-text--center",
+                                className: "moonx-text--secondary moonx-text--center",
                                 style: {
                                     maxWidth: "320px"
                                 },
@@ -6890,7 +6897,7 @@ var PayWithCard = function PayWithCard(param) {
                     }) : popupBlocked ? /* @__PURE__ */ jsxs20(Fragment4, {
                         children: [
                             /* @__PURE__ */ jsx27("div", {
-                                className: "moonkey-icon--muted moonkey-text--center",
+                                className: "moonx-icon--muted moonx-text--center",
                                 style: {
                                     fontSize: "1rem",
                                     fontWeight: 700,
@@ -6899,7 +6906,7 @@ var PayWithCard = function PayWithCard(param) {
                                 children: "Popup blocked"
                             }),
                             /* @__PURE__ */ jsx27("div", {
-                                className: "moonkey-text--secondary moonkey-text--center",
+                                className: "moonx-text--secondary moonx-text--center",
                                 style: {
                                     maxWidth: "320px"
                                 },
@@ -6912,7 +6919,7 @@ var PayWithCard = function PayWithCard(param) {
                                     maxWidth: "320px",
                                     marginTop: "1rem"
                                 },
-                                className: "moonkey-flex-col",
+                                className: "moonx-flex-col",
                                 children: [
                                     /* @__PURE__ */ jsxs20(Button, {
                                         onClick: handleManualOpen,
@@ -6920,7 +6927,7 @@ var PayWithCard = function PayWithCard(param) {
                                             /* @__PURE__ */ jsx27(ExternalLink, {
                                                 size: 16,
                                                 style: {
-                                                    color: "var(--moonkey-color-accent-foreground)"
+                                                    color: "var(--moonx-color-accent-foreground)"
                                                 }
                                             }),
                                             "Try Opening Again"
@@ -6941,7 +6948,7 @@ var PayWithCard = function PayWithCard(param) {
                                 iconUrl: moonpay_default
                             }),
                             /* @__PURE__ */ jsx27("div", {
-                                className: "moonkey-text--secondary moonkey-text--center",
+                                className: "moonx-text--secondary moonx-text--center",
                                 style: {
                                     maxWidth: "320px"
                                 },
@@ -6953,7 +6960,7 @@ var PayWithCard = function PayWithCard(param) {
                                 children: [
                                     /* @__PURE__ */ jsx27(ExternalLink, {
                                         size: 16,
-                                        className: "moonkey-icon--fg"
+                                        className: "moonx-icon--fg"
                                     }),
                                     "Reopen Payment Window"
                                 ]
@@ -7053,12 +7060,12 @@ var GeneratedQRCode = function GeneratedQRCode(param) {
         padding: "2rem"
     };
     var errorTextStyle = {
-        color: "var(--moonkey-color-error)",
+        color: "var(--moonx-color-error)",
         fontSize: "0.875rem",
         marginBottom: "0.5rem"
     };
     var errorDetailStyle = {
-        color: "var(--moonkey-color-foreground-3)",
+        color: "var(--moonx-color-foreground-3)",
         fontSize: "0.75rem"
     };
     var containerStyle = {
@@ -7081,13 +7088,13 @@ var GeneratedQRCode = function GeneratedQRCode(param) {
         borderRadius: "50%",
         height: "3rem",
         width: "3rem",
-        borderBottom: "2px solid var(--moonkey-color-accent)",
+        borderBottom: "2px solid var(--moonx-color-accent)",
         marginBottom: "1rem"
     };
     var loadingTextStyle = {
         fontSize: "1.125rem",
         fontWeight: 500,
-        color: "var(--moonkey-color-foreground)"
+        color: "var(--moonx-color-foreground)"
     };
     var qrContainerStyle = {
         display: "flex",
@@ -7203,7 +7210,7 @@ var ReceiveFundsQRCode = function ReceiveFundsQRCode(param) {
     };
     var qrCodeUri = "".concat(walletType, ":").concat(walletAddress);
     return /* @__PURE__ */ jsxs22("div", {
-        className: "moonkey-flex-col-center",
+        className: "moonx-flex-col-center",
         style: {
             position: "relative",
             gap: "1rem"
@@ -7218,21 +7225,21 @@ var ReceiveFundsQRCode = function ReceiveFundsQRCode(param) {
                 height: 225
             }),
             /* @__PURE__ */ jsxs22("div", {
-                className: "moonkey-flex-col-center",
+                className: "moonx-flex-col-center",
                 style: {
                     gap: "0.5rem",
                     width: "100%"
                 },
                 children: [
                     /* @__PURE__ */ jsxs22("div", {
-                        className: "moonkey-flex-between",
+                        className: "moonx-flex-between",
                         style: {
                             width: "100%",
                             marginBottom: "0.5rem"
                         },
                         children: [
                             /* @__PURE__ */ jsxs22("div", {
-                                className: "moonkey-text--secondary moonkey-text--semibold",
+                                className: "moonx-text--secondary moonx-text--semibold",
                                 children: [
                                     "Your ",
                                     walletType === "solana" ? "Solana" : "Ethereum",
@@ -7242,10 +7249,10 @@ var ReceiveFundsQRCode = function ReceiveFundsQRCode(param) {
                             /* @__PURE__ */ jsx29("button", {
                                 style: {
                                     padding: "0.25rem 0.75rem",
-                                    backgroundColor: isCopied ? "var(--moonkey-color-success)" : "var(--moonkey-color-accent)",
+                                    backgroundColor: isCopied ? "var(--moonx-color-success)" : "var(--moonx-color-accent)",
                                     color: "white",
                                     border: "none",
-                                    borderRadius: "var(--moonkey-border-radius-md)",
+                                    borderRadius: "var(--moonx-border-radius-md)",
                                     fontSize: "0.75rem",
                                     fontWeight: 500,
                                     cursor: "pointer",
@@ -7257,12 +7264,12 @@ var ReceiveFundsQRCode = function ReceiveFundsQRCode(param) {
                                 onClick: handleCopyAddress,
                                 onMouseEnter: function onMouseEnter(e) {
                                     if (!isCopied) {
-                                        e.currentTarget.style.backgroundColor = "var(--moonkey-color-accent-dark)";
+                                        e.currentTarget.style.backgroundColor = "var(--moonx-color-accent-dark)";
                                     }
                                 },
                                 onMouseLeave: function onMouseLeave(e) {
                                     if (!isCopied) {
-                                        e.currentTarget.style.backgroundColor = "var(--moonkey-color-accent)";
+                                        e.currentTarget.style.backgroundColor = "var(--moonx-color-accent)";
                                     }
                                 },
                                 children: isCopied ? /* @__PURE__ */ jsxs22(Fragment6, {
@@ -7316,10 +7323,10 @@ var ReceiveFundsQRCode = function ReceiveFundsQRCode(param) {
                     /* @__PURE__ */ jsx29("div", {
                         style: {
                             fontSize: "0.75rem",
-                            color: "var(--moonkey-color-foreground)",
-                            backgroundColor: "var(--moonkey-color-background-2)",
+                            color: "var(--moonx-color-foreground)",
+                            backgroundColor: "var(--moonx-color-background-2)",
                             padding: "0.5rem 0.75rem",
-                            borderRadius: "var(--moonkey-border-radius-md)",
+                            borderRadius: "var(--moonx-border-radius-md)",
                             wordBreak: "break-all",
                             textAlign: "center",
                             width: "100%"
@@ -7355,7 +7362,7 @@ var ReceivedFunds = function ReceivedFunds(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsxs23("div", {
-                className: "moonkey-flex-between",
+                className: "moonx-flex-between",
                 style: {
                     marginBottom: "0.5rem"
                 },
@@ -7365,11 +7372,11 @@ var ReceivedFunds = function ReceivedFunds(param) {
                         size: "icon",
                         onClick: onClose,
                         children: /* @__PURE__ */ jsx30(ArrowLeft3, {
-                            className: "moonkey-icon--sm moonkey-icon--fg"
+                            className: "moonx-icon--sm moonx-icon--fg"
                         })
                     }),
                     /* @__PURE__ */ jsx30("div", {
-                        className: "moonkey-text--title",
+                        className: "moonx-text--title",
                         style: {
                             fontWeight: 600,
                             flex: 1
@@ -7381,13 +7388,13 @@ var ReceivedFunds = function ReceivedFunds(param) {
                         size: "icon",
                         onClick: onClose,
                         children: /* @__PURE__ */ jsx30(X4, {
-                            className: "moonkey-icon--sm moonkey-icon--fg"
+                            className: "moonx-icon--sm moonx-icon--fg"
                         })
                     })
                 ]
             }),
             isLoading ? /* @__PURE__ */ jsx30("div", {
-                className: "moonkey-flex-col-center",
+                className: "moonx-flex-col-center",
                 style: {
                     justifyContent: "center",
                     padding: "3rem",
@@ -7397,7 +7404,7 @@ var ReceivedFunds = function ReceivedFunds(param) {
                     children: "Loading wallet information..."
                 })
             }) : error ? /* @__PURE__ */ jsxs23("div", {
-                className: "moonkey-flex-col-center moonkey-text--error",
+                className: "moonx-flex-col-center moonx-text--error",
                 style: {
                     justifyContent: "center",
                     padding: "3rem",
@@ -7416,13 +7423,13 @@ var ReceivedFunds = function ReceivedFunds(param) {
                     })
                 ]
             }) : /* @__PURE__ */ jsxs23("div", {
-                className: "moonkey-flex-col-center",
+                className: "moonx-flex-col-center",
                 style: {
                     padding: "0.5rem"
                 },
                 children: [
                     /* @__PURE__ */ jsx30("div", {
-                        className: "moonkey-text--secondary moonkey-text--center",
+                        className: "moonx-text--secondary moonx-text--center",
                         style: {
                             overflow: "hidden",
                             textOverflow: "ellipsis",
@@ -7634,37 +7641,37 @@ var ImportWallet = function ImportWallet(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsx32("div", {
-                className: "moonkey-flow-close",
+                className: "moonx-flow-close",
                 children: /* @__PURE__ */ jsx32(Button, {
                     variant: "ghost",
                     size: "icon",
                     onClick: onCancel,
                     children: /* @__PURE__ */ jsx32(X5, {
-                        className: "moonkey-icon--sm"
+                        className: "moonx-icon--sm"
                     })
                 })
             }),
             /* @__PURE__ */ jsxs24("div", {
-                className: "moonkey-flow-header",
+                className: "moonx-flow-header",
                 children: [
                     /* @__PURE__ */ jsx32("div", {
-                        className: "moonkey-text--heading",
+                        className: "moonx-text--heading",
                         children: title
                     }),
                     /* @__PURE__ */ jsx32("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: description
                     })
                 ]
             }),
             /* @__PURE__ */ jsxs24("div", {
-                className: "moonkey-flow-content",
+                className: "moonx-flow-content",
                 style: {
                     gap: "0.75rem"
                 },
                 children: [
                     /* @__PURE__ */ jsxs24("div", {
-                        className: "moonkey-flex-col",
+                        className: "moonx-flex-col",
                         style: {
                             gap: "0.5rem"
                         },
@@ -7681,7 +7688,7 @@ var ImportWallet = function ImportWallet(param) {
                                 spellCheck: false,
                                 autoComplete: "off",
                                 disabled: submitting,
-                                className: "moonkey-mono-textarea"
+                                className: "moonx-mono-textarea"
                             })
                         ]
                     }),
@@ -7700,7 +7707,7 @@ var ImportWallet = function ImportWallet(param) {
                                 style: {
                                     display: "block",
                                     fontWeight: 500,
-                                    color: "var(--moonkey-color-foreground)"
+                                    color: "var(--moonx-color-foreground)"
                                 },
                                 children: successText
                             }),
@@ -7709,7 +7716,7 @@ var ImportWallet = function ImportWallet(param) {
                                     display: "block",
                                     fontFamily: "monospace",
                                     fontSize: "0.75rem",
-                                    color: "var(--moonkey-color-foreground-3)",
+                                    color: "var(--moonx-color-foreground-3)",
                                     wordBreak: "break-all"
                                 },
                                 children: importedWallet.public_address
@@ -7745,17 +7752,17 @@ var SocialLoginButton = function SocialLoginButton(param) {
     var icon = param.icon, text = param.text, provider = param.provider, onSocialLoginClick = param.onSocialLoginClick;
     var _useState23 = _sliced_to_array(useState23(false), 2), isHovered = _useState23[0], setIsHovered = _useState23[1];
     var buttonStyle = {
-        borderRadius: "var(--moonx-radius-button, var(--moonkey-border-radius-lg))",
+        borderRadius: "var(--moonx-radius-button, var(--moonx-border-radius-lg))",
         borderWidth: "var(--moonx-button-border-width, 1px)",
         borderStyle: "solid",
-        borderColor: isHovered ? "var(--moonx-button-border-color-hover, var(--moonkey-color-accent))" : "var(--moonx-button-border-color, var(--moonkey-color-border))",
-        color: "var(--moonx-button-fg, var(--moonkey-color-foreground))",
+        borderColor: isHovered ? "var(--moonx-button-border-color-hover, var(--moonx-color-accent))" : "var(--moonx-button-border-color, var(--moonx-color-border))",
+        color: "var(--moonx-button-fg, var(--moonx-color-foreground))",
         paddingTop: "0.75rem",
         paddingBottom: "0.75rem",
         paddingLeft: "0.25rem",
         paddingRight: "0.25rem",
         cursor: "pointer",
-        backgroundColor: isHovered ? "var(--moonx-button-bg-hover, var(--moonkey-color-background-2))" : "var(--moonx-button-bg, transparent)",
+        backgroundColor: isHovered ? "var(--moonx-button-bg-hover, var(--moonx-color-background-2))" : "var(--moonx-button-bg, transparent)",
         marginTop: "0.75rem",
         transition: "all 0.2s ease-in-out"
     };
@@ -7779,7 +7786,7 @@ var SocialLoginButton = function SocialLoginButton(param) {
                 }
             }),
             /* @__PURE__ */ jsx33("div", {
-                className: cx("moonkey-social-login-button"),
+                className: cx("moonx-social-login-button"),
                 style: buttonStyle,
                 onMouseEnter: function onMouseEnter() {
                     return setIsHovered(true);
@@ -7823,7 +7830,7 @@ var AppleLogin = function AppleLogin(param) {
         children: /* @__PURE__ */ jsx34("path", {
             d: "M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z",
             transform: "translate(-2, -2)",
-            fill: "var(--moonkey-color-foreground, #000)"
+            fill: "var(--moonx-color-foreground, #000)"
         })
     });
     return /* @__PURE__ */ jsx34(SocialLoginButton, {
@@ -7876,12 +7883,12 @@ import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
 var ConnectSolanaWalletButton = function ConnectSolanaWalletButton(param) {
     var onConnectWalletClick = param.onConnectWalletClick;
     return /* @__PURE__ */ jsx36("div", {
-        className: cx("moonkey-external-wallet-btn", "moonkey-connect-solana-wallet-button"),
+        className: cx("moonx-external-wallet-btn", "moonx-connect-solana-wallet-button"),
         onClick: function onClick() {
             return onConnectWalletClick();
         },
         children: /* @__PURE__ */ jsxs27("div", {
-            className: "moonkey-external-wallet-btn__inner",
+            className: "moonx-external-wallet-btn__inner",
             children: [
                 /* @__PURE__ */ jsx36("div", {
                     style: {
@@ -7905,12 +7912,12 @@ import { jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
 var ConnectEthereumWalletButton = function ConnectEthereumWalletButton(param) {
     var onWalletConnectClick = param.onWalletConnectClick;
     return /* @__PURE__ */ jsx37("div", {
-        className: "moonkey-external-wallet-btn",
+        className: "moonx-external-wallet-btn",
         onClick: function onClick() {
             return onWalletConnectClick();
         },
         children: /* @__PURE__ */ jsxs28("div", {
-            className: "moonkey-external-wallet-btn__inner",
+            className: "moonx-external-wallet-btn__inner",
             children: [
                 /* @__PURE__ */ jsx37("div", {
                     style: {
@@ -9363,7 +9370,7 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
         width: "5rem",
         height: "5rem",
         borderRadius: "50%",
-        border: "4px solid var(--moonkey-color-border)"
+        border: "4px solid var(--moonx-color-border)"
     };
     var spinnerInnerStyles = {
         position: "absolute",
@@ -9372,7 +9379,7 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
         height: "5rem",
         borderRadius: "50%",
         border: "4px solid transparent",
-        borderTopColor: "var(--moonkey-color-accent)",
+        borderTopColor: "var(--moonx-color-accent)",
         animation: "spin 1s linear infinite"
     };
     var errorRingStyles = {
@@ -9381,7 +9388,7 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
         width: "5rem",
         height: "5rem",
         borderRadius: "50%",
-        border: "4px solid var(--moonkey-color-error)"
+        border: "4px solid var(--moonx-color-error)"
     };
     var iconInnerContainerStyles = {
         position: "absolute",
@@ -9394,7 +9401,7 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
         width: "3rem",
         height: "3rem",
         borderRadius: "50%",
-        backgroundColor: "var(--moonkey-color-background-2)",
+        backgroundColor: "var(--moonx-color-background-2)",
         display: "flex",
         alignItems: "center",
         justifyContent: "center"
@@ -9407,7 +9414,7 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
         width: "4rem",
         height: "4rem",
         borderRadius: "50%",
-        backgroundColor: "var(--moonkey-color-background-2)",
+        backgroundColor: "var(--moonx-color-background-2)",
         display: "flex",
         alignItems: "center",
         justifyContent: "center"
@@ -9423,12 +9430,12 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
     var titleStyles = {
         fontSize: "1.125rem",
         fontWeight: 500,
-        color: "var(--moonkey-color-foreground)",
+        color: "var(--moonx-color-foreground)",
         marginBottom: "0.5rem"
     };
     var descriptionStyles = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-foreground-3)"
+        color: "var(--moonx-color-foreground-3)"
     };
     var contentContainerStyles = {
         textAlign: "center",
@@ -9437,24 +9444,24 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
     };
     var successDescriptionStyles = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-foreground-3)",
+        color: "var(--moonx-color-foreground-3)",
         marginBottom: "1rem"
     };
     var addressStyles = {
         fontSize: "0.75rem",
-        color: "var(--moonkey-color-foreground-3)",
+        color: "var(--moonx-color-foreground-3)",
         fontFamily: "monospace",
-        backgroundColor: "var(--moonkey-color-background-2)",
+        backgroundColor: "var(--moonx-color-background-2)",
         padding: "0.5rem 0.75rem",
-        borderRadius: "var(--moonkey-border-radius-md)"
+        borderRadius: "var(--moonx-border-radius-md)"
     };
     var errorBoxStyles = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-error)",
+        color: "var(--moonx-color-error)",
         marginBottom: "1rem",
         padding: "0.75rem 1rem",
-        backgroundColor: "var(--moonkey-color-background-2)",
-        borderRadius: "var(--moonkey-border-radius-md)"
+        backgroundColor: "var(--moonx-color-background-2)",
+        borderRadius: "var(--moonx-border-radius-md)"
     };
     var buttonContainerStyles = {
         display: "flex",
@@ -9465,7 +9472,7 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
         bottom: 0,
         left: 0,
         right: 0,
-        backgroundColor: "var(--moonkey-color-background)",
+        backgroundColor: "var(--moonx-color-background)",
         paddingTop: "1rem",
         paddingBottom: "3rem",
         marginBottom: "0.125rem",
@@ -9473,8 +9480,8 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
         marginRight: "0.125rem",
         paddingLeft: "2rem",
         paddingRight: "2rem",
-        borderBottomLeftRadius: "var(--moonkey-border-radius-lg)",
-        borderBottomRightRadius: "var(--moonkey-border-radius-lg)"
+        borderBottomLeftRadius: "var(--moonx-border-radius-lg)",
+        borderBottomRightRadius: "var(--moonx-border-radius-lg)"
     };
     var primaryButtonStyles = {
         flex: 1,
@@ -9482,9 +9489,9 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
         paddingBottom: "0.75rem",
         paddingLeft: "1rem",
         paddingRight: "1rem",
-        backgroundColor: isTryAgainHovered ? "var(--moonkey-color-accent-dark)" : "var(--moonkey-color-accent)",
-        border: "1px solid var(--moonkey-color-border)",
-        borderRadius: "var(--moonkey-border-radius-lg)",
+        backgroundColor: isTryAgainHovered ? "var(--moonx-color-accent-dark)" : "var(--moonx-color-accent)",
+        border: "1px solid var(--moonx-color-border)",
+        borderRadius: "var(--moonx-border-radius-lg)",
         color: "white",
         transition: "background-color 0.2s",
         cursor: "pointer",
@@ -9493,10 +9500,10 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
     var successButtonStyles = {
         width: "100%",
         padding: "0.75rem 1.5rem",
-        backgroundColor: "var(--moonkey-color-success)",
+        backgroundColor: "var(--moonx-color-success)",
         color: "#ffffff",
         border: "none",
-        borderRadius: "var(--moonkey-border-radius-md)",
+        borderRadius: "var(--moonx-border-radius-md)",
         fontSize: "0.875rem",
         fontWeight: 500,
         cursor: "pointer",
@@ -9505,10 +9512,10 @@ var BrowserExtensionUI = function BrowserExtensionUI(param) {
     var secondaryButtonStyles = {
         width: "100%",
         padding: "0.75rem 1.5rem",
-        backgroundColor: isBackHovered ? "var(--moonkey-color-accent-dark)" : "var(--moonkey-color-accent)",
-        color: "var(--moonkey-color-accent-foreground)",
+        backgroundColor: isBackHovered ? "var(--moonx-color-accent-dark)" : "var(--moonx-color-accent)",
+        color: "var(--moonx-color-accent-foreground)",
         border: "none",
-        borderRadius: "var(--moonkey-border-radius-md)",
+        borderRadius: "var(--moonx-border-radius-md)",
         fontSize: "0.875rem",
         fontWeight: 500,
         cursor: "pointer",
@@ -9856,7 +9863,7 @@ var QRCodeUI = function QRCodeUI(param) {
     };
     var subtitleStyle = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-foreground-3)"
+        color: "var(--moonx-color-foreground-3)"
     };
     var stateContainerStyle = {
         display: "flex",
@@ -9890,7 +9897,7 @@ var QRCodeUI = function QRCodeUI(param) {
         width: "5rem",
         height: "5rem",
         borderRadius: "50%",
-        border: "4px solid var(--moonkey-color-border)"
+        border: "4px solid var(--moonx-color-border)"
     };
     var spinnerAnimStyle = {
         position: "absolute",
@@ -9899,7 +9906,7 @@ var QRCodeUI = function QRCodeUI(param) {
         height: "5rem",
         borderRadius: "50%",
         border: "4px solid transparent",
-        borderTopColor: "var(--moonkey-color-accent)",
+        borderTopColor: "var(--moonx-color-accent)",
         animation: "spin 1s linear infinite"
     };
     var spinnerCenterStyle = {
@@ -9913,7 +9920,7 @@ var QRCodeUI = function QRCodeUI(param) {
         width: "3rem",
         height: "3rem",
         borderRadius: "50%",
-        backgroundColor: "var(--moonkey-color-background-2)",
+        backgroundColor: "var(--moonx-color-background-2)",
         display: "flex",
         alignItems: "center",
         justifyContent: "center"
@@ -9929,18 +9936,18 @@ var QRCodeUI = function QRCodeUI(param) {
     var textLgStyle = {
         fontSize: "1.125rem",
         fontWeight: 500,
-        color: "var(--moonkey-color-foreground)",
+        color: "var(--moonx-color-foreground)",
         marginBottom: "0.5rem"
     };
     var textSmStyle = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-foreground-3)"
+        color: "var(--moonx-color-foreground-3)"
     };
     var successIconStyle = {
         borderRadius: "50%",
         height: "3rem",
         width: "3rem",
-        backgroundColor: "var(--moonkey-color-background-2)",
+        backgroundColor: "var(--moonx-color-background-2)",
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
@@ -9950,11 +9957,11 @@ var QRCodeUI = function QRCodeUI(param) {
         borderRadius: "50%",
         height: "2rem",
         width: "2rem",
-        backgroundColor: "var(--moonkey-color-success)"
+        backgroundColor: "var(--moonx-color-success)"
     };
     var accountStyle = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-foreground-3)",
+        color: "var(--moonx-color-foreground-3)",
         marginTop: "0.5rem",
         fontFamily: "monospace"
     };
@@ -9964,18 +9971,18 @@ var QRCodeUI = function QRCodeUI(param) {
         width: "5rem",
         height: "5rem",
         borderRadius: "50%",
-        border: "4px solid var(--moonkey-color-error)"
+        border: "4px solid var(--moonx-color-error)"
     };
     var errorMessageStyle = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-error)",
+        color: "var(--moonx-color-error)",
         marginBottom: "1rem",
         paddingLeft: "1rem",
         paddingRight: "1rem",
         paddingTop: "0.75rem",
         paddingBottom: "0.75rem",
-        backgroundColor: "var(--moonkey-color-background-2)",
-        borderRadius: "var(--moonkey-border-radius-lg)"
+        backgroundColor: "var(--moonx-color-background-2)",
+        borderRadius: "var(--moonx-border-radius-lg)"
     };
     return /* @__PURE__ */ jsxs30(Fragment8, {
         children: [
@@ -10182,7 +10189,7 @@ var WalletConnectionUI = function WalletConnectionUI(param) {
     var spacerStyles = {
         fontSize: "1.125rem",
         fontWeight: 500,
-        color: "var(--moonkey-color-foreground)"
+        color: "var(--moonx-color-foreground)"
     };
     var deepLinkContainerStyles = {
         display: "flex",
@@ -10190,8 +10197,8 @@ var WalletConnectionUI = function WalletConnectionUI(param) {
         alignItems: "center",
         gap: "1.5rem",
         padding: "1.5rem",
-        backgroundColor: "var(--moonkey-color-background)",
-        borderRadius: "var(--moonkey-border-radius-md)",
+        backgroundColor: "var(--moonx-color-background)",
+        borderRadius: "var(--moonx-border-radius-md)",
         boxShadow: "0 10px 15px -3px rgb(0 0 0 / 0.1)"
     };
     var walletImageStyles = {
@@ -10207,19 +10214,19 @@ var WalletConnectionUI = function WalletConnectionUI(param) {
         fontSize: "1.25rem",
         fontWeight: 600,
         marginBottom: "0.5rem",
-        color: "var(--moonkey-color-foreground)"
+        color: "var(--moonx-color-foreground)"
     };
     var descriptionStyles = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-foreground-3)"
+        color: "var(--moonx-color-foreground-3)"
     };
     var deepLinkButtonStyles = {
         width: "100%",
         padding: "1rem 1.5rem",
-        backgroundColor: isDeepLinkHovered ? "var(--moonkey-color-accent-dark)" : "var(--moonkey-color-accent)",
-        color: "var(--moonkey-color-accent-foreground)",
+        backgroundColor: isDeepLinkHovered ? "var(--moonx-color-accent-dark)" : "var(--moonx-color-accent)",
+        color: "var(--moonx-color-accent-foreground)",
         border: "none",
-        borderRadius: "var(--moonkey-border-radius-md)",
+        borderRadius: "var(--moonx-border-radius-md)",
         fontSize: "0.875rem",
         fontWeight: 500,
         cursor: "pointer",
@@ -10232,12 +10239,12 @@ var WalletConnectionUI = function WalletConnectionUI(param) {
     var infoBoxStyles = {
         width: "100%",
         padding: "1rem",
-        backgroundColor: "var(--moonkey-color-accent)",
-        borderRadius: "var(--moonkey-border-radius-md)"
+        backgroundColor: "var(--moonx-color-accent)",
+        borderRadius: "var(--moonx-border-radius-md)"
     };
     var infoTextStyles = {
         fontSize: "0.75rem",
-        color: "var(--moonkey-color-accent-foreground)",
+        color: "var(--moonx-color-accent-foreground)",
         textAlign: "center"
     };
     return /* @__PURE__ */ jsx41(RootCard, {
@@ -10391,10 +10398,10 @@ var WalletCard = function WalletCard(param) {
         gap: "0.5rem",
         position: "relative",
         padding: "0.75rem 0.25rem",
-        border: "1px solid ".concat(isHovered ? "var(--moonkey-color-accent)" : "var(--moonkey-color-border)"),
-        borderRadius: "var(--moonkey-border-radius-lg)",
+        border: "1px solid ".concat(isHovered ? "var(--moonx-color-accent)" : "var(--moonx-color-border)"),
+        borderRadius: "var(--moonx-border-radius-lg)",
         transition: "all 0.2s",
-        backgroundColor: "var(--moonkey-color-background)",
+        backgroundColor: "var(--moonx-color-background)",
         cursor: "pointer"
     };
     var imageContainerStyle = {
@@ -10411,13 +10418,13 @@ var WalletCard = function WalletCard(param) {
         right: 0,
         width: "0.75rem",
         height: "0.75rem",
-        backgroundColor: "var(--moonkey-color-success)",
+        backgroundColor: "var(--moonx-color-success)",
         borderRadius: "50%",
-        border: "2px solid var(--moonkey-color-background)"
+        border: "2px solid var(--moonx-color-background)"
     };
     var textStyle = {
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-foreground)",
+        color: "var(--moonx-color-foreground)",
         transition: "color 0.2s"
     };
     return /* @__PURE__ */ jsxs32("button", {
@@ -10592,12 +10599,12 @@ var WalletListScreen = function WalletListScreen(param) {
             width: "3rem",
             height: "3rem",
             border: "2px solid transparent",
-            borderBottomColor: "var(--moonkey-color-accent)",
+            borderBottomColor: "var(--moonx-color-accent)",
             borderRadius: "50%",
             animation: "spin 1s linear infinite"
         };
         var loadingTextStyles = {
-            color: "var(--moonkey-color-foreground-3)",
+            color: "var(--moonx-color-foreground-3)",
             fontSize: "0.875rem"
         };
         return /* @__PURE__ */ jsxs33(RootCard, {
@@ -10637,25 +10644,25 @@ var WalletListScreen = function WalletListScreen(param) {
             gap: "1rem"
         };
         var errorIconStyles = {
-            color: "var(--moonkey-color-error)",
+            color: "var(--moonx-color-error)",
             fontSize: "1.125rem"
         };
         var errorTitleStyles = {
-            color: "var(--moonkey-color-foreground)",
+            color: "var(--moonx-color-foreground)",
             fontWeight: 500,
             fontSize: "0.875rem"
         };
         var errorMessageStyles = {
-            color: "var(--moonkey-color-foreground-3)",
+            color: "var(--moonx-color-foreground-3)",
             fontSize: "0.875rem",
             textAlign: "center"
         };
         var retryButtonStyles = {
             padding: "0.5rem 1rem",
-            backgroundColor: isRetryHovered ? "var(--moonkey-color-accent-dark)" : "var(--moonkey-color-accent)",
-            color: "var(--moonkey-color-accent-foreground)",
+            backgroundColor: isRetryHovered ? "var(--moonx-color-accent-dark)" : "var(--moonx-color-accent)",
+            color: "var(--moonx-color-accent-foreground)",
             border: "none",
-            borderRadius: "var(--moonkey-border-radius-md)",
+            borderRadius: "var(--moonx-border-radius-md)",
             cursor: "pointer",
             fontSize: "0.875rem",
             fontWeight: 500,
@@ -10705,7 +10712,7 @@ var WalletListScreen = function WalletListScreen(param) {
     var titleStyles = {
         fontSize: "1rem",
         fontWeight: 500,
-        color: "var(--moonkey-color-foreground)"
+        color: "var(--moonx-color-foreground)"
     };
     var contentStyles = {
         display: "flex",
@@ -10719,11 +10726,11 @@ var WalletListScreen = function WalletListScreen(param) {
     var searchInputStyles = {
         width: "100%",
         padding: "0.75rem 1rem 0.75rem 2.5rem",
-        border: "1px solid var(--moonkey-color-border)",
-        borderRadius: "var(--moonkey-border-radius-lg)",
+        border: "1px solid var(--moonx-color-border)",
+        borderRadius: "var(--moonx-border-radius-lg)",
         fontSize: "0.875rem",
-        color: "var(--moonkey-color-foreground)",
-        backgroundColor: "var(--moonkey-color-background)",
+        color: "var(--moonx-color-foreground)",
+        backgroundColor: "var(--moonx-color-background)",
         outline: "none",
         transition: "border-color 0.2s ease, box-shadow 0.2s ease"
     };
@@ -10733,7 +10740,7 @@ var WalletListScreen = function WalletListScreen(param) {
         top: "0.875rem",
         width: "1rem",
         height: "1rem",
-        color: "var(--moonkey-color-foreground-3)"
+        color: "var(--moonx-color-foreground-3)"
     };
     var walletListContainerStyles = {
         height: "300px",
@@ -10746,12 +10753,12 @@ var WalletListScreen = function WalletListScreen(param) {
         padding: "2rem 1rem"
     };
     var emptyTitleStyles = {
-        color: "var(--moonkey-color-foreground-3)",
+        color: "var(--moonx-color-foreground-3)",
         fontSize: "0.875rem",
         marginBottom: "0.5rem"
     };
     var emptySubtitleStyles = {
-        color: "var(--moonkey-color-foreground-3)",
+        color: "var(--moonx-color-foreground-3)",
         fontSize: "0.75rem",
         opacity: 0.7
     };
@@ -10762,7 +10769,7 @@ var WalletListScreen = function WalletListScreen(param) {
     };
     var dividerStyles = {
         margin: "0.2rem 0",
-        borderTop: "1px solid var(--moonkey-color-border)"
+        borderTop: "1px solid var(--moonx-color-border)"
     };
     return /* @__PURE__ */ jsxs33(RootCard, {
         centerContent: false,
@@ -10771,7 +10778,7 @@ var WalletListScreen = function WalletListScreen(param) {
         children: [
             /* @__PURE__ */ jsx43("style", {
                 dangerouslySetInnerHTML: {
-                    __html: "\n          .wallet-list-container::-webkit-scrollbar {\n            display: none;\n          }\n          .wallet-search-input:focus {\n            border-color: var(--moonkey-color-accent);\n            box-shadow: 0 0 0 2px var(--moonkey-color-accent);\n          }\n        "
+                    __html: "\n          .wallet-list-container::-webkit-scrollbar {\n            display: none;\n          }\n          .wallet-search-input:focus {\n            border-color: var(--moonx-color-accent);\n            box-shadow: 0 0 0 2px var(--moonx-color-accent);\n          }\n        "
                 }
             }),
             /* @__PURE__ */ jsxs33("div", {
@@ -11031,7 +11038,7 @@ var WalletConnectFlow = function WalletConnectFlow(param) {
         return /* @__PURE__ */ jsx44("div", {
             style: {
                 minHeight: "100vh",
-                backgroundColor: "var(--moonkey-color-background-2)",
+                backgroundColor: "var(--moonx-color-background-2)",
                 display: "flex",
                 alignItems: "center",
                 justifyContent: "center"
@@ -11043,25 +11050,25 @@ var WalletConnectFlow = function WalletConnectFlow(param) {
                 children: [
                     /* @__PURE__ */ jsx44("div", {
                         style: {
-                            animation: "moonkey-spin 1s linear infinite",
+                            animation: "moonx-spin 1s linear infinite",
                             borderRadius: "50%",
                             height: "4rem",
                             width: "4rem",
-                            borderBottom: "2px solid var(--moonkey-color-accent)",
+                            borderBottom: "2px solid var(--moonx-color-accent)",
                             margin: "0 auto 1rem"
                         }
                     }),
                     /* @__PURE__ */ jsx44("p", {
                         style: {
                             fontSize: "1.25rem",
-                            color: "var(--moonkey-color-foreground-3)"
+                            color: "var(--moonx-color-foreground-3)"
                         },
                         children: "Initializing WalletConnect..."
                     }),
                     /* @__PURE__ */ jsx44("p", {
                         style: {
                             fontSize: "0.875rem",
-                            color: "var(--moonkey-color-foreground-3)",
+                            color: "var(--moonx-color-foreground-3)",
                             marginTop: "0.5rem"
                         },
                         children: "Please wait a moment"
@@ -11107,12 +11114,12 @@ import { jsx as jsx45, jsxs as jsxs35 } from "react/jsx-runtime";
 var WalletFlowButton = function WalletFlowButton(param) {
     var onWalletFlowClick = param.onWalletFlowClick;
     return /* @__PURE__ */ jsx45("div", {
-        className: cx("moonkey-external-wallet-btn", "moonkey-connect-solana-wallet-button"),
+        className: cx("moonx-external-wallet-btn", "moonx-connect-solana-wallet-button"),
         onClick: function onClick() {
             return onWalletFlowClick();
         },
         children: /* @__PURE__ */ jsxs35("div", {
-            className: "moonkey-external-wallet-btn__inner",
+            className: "moonx-external-wallet-btn__inner",
             children: [
                 /* @__PURE__ */ jsx45("div", {
                     style: {
@@ -11152,18 +11159,18 @@ var NetworkSelection = function NetworkSelection(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsxs36("div", {
-                className: "moonkey-flex-between",
+                className: "moonx-flex-between",
                 children: [
                     /* @__PURE__ */ jsx46(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onBack,
                         children: /* @__PURE__ */ jsx46(ArrowLeft6, {
-                            className: "moonkey-icon--sm"
+                            className: "moonx-icon--sm"
                         })
                     }),
                     /* @__PURE__ */ jsx46("div", {
-                        className: "moonkey-label",
+                        className: "moonx-label",
                         children: /* @__PURE__ */ jsx46("span", {
                             children: "Select Network"
                         })
@@ -11175,20 +11182,20 @@ var NetworkSelection = function NetworkSelection(param) {
                             visibility: "hidden"
                         },
                         children: /* @__PURE__ */ jsx46(X8, {
-                            className: "moonkey-icon--sm"
+                            className: "moonx-icon--sm"
                         })
                     })
                 ]
             }),
             /* @__PURE__ */ jsxs36("div", {
-                className: "moonkey-flex-col",
+                className: "moonx-flex-col",
                 style: {
                     gap: "1rem",
                     marginTop: "1.5rem"
                 },
                 children: [
                     /* @__PURE__ */ jsxs36("div", {
-                        className: "moonkey-flex-col-center",
+                        className: "moonx-flex-col-center",
                         style: {
                             gap: "0.5rem",
                             marginBottom: "0.5rem"
@@ -11197,45 +11204,45 @@ var NetworkSelection = function NetworkSelection(param) {
                             walletIcon && /* @__PURE__ */ jsx46("img", {
                                 src: walletIcon,
                                 alt: walletName,
-                                className: "moonkey-icon--2xl",
+                                className: "moonx-icon--2xl",
                                 style: {
-                                    borderRadius: "var(--moonkey-border-radius-md)"
+                                    borderRadius: "var(--moonx-border-radius-md)"
                                 }
                             }),
                             /* @__PURE__ */ jsx46("span", {
-                                className: "moonkey-text--title moonkey-text--lg",
+                                className: "moonx-text--title moonx-text--lg",
                                 children: walletName
                             })
                         ]
                     }),
                     /* @__PURE__ */ jsx46("p", {
-                        className: "moonkey-text--secondary moonkey-text--center",
+                        className: "moonx-text--secondary moonx-text--center",
                         style: {
                             marginBottom: "0.25rem"
                         },
                         children: "This wallet supports multiple networks. Choose which network you'd like to connect with:"
                     }),
                     supportedNetworks.includes("ethereum") && /* @__PURE__ */ jsxs36("div", {
-                        className: "moonkey-wallet-item",
+                        className: "moonx-wallet-item",
                         onClick: function onClick() {
                             return onNetworkSelect("ethereum");
                         },
                         children: [
                             /* @__PURE__ */ jsxs36("div", {
-                                className: "moonkey-flex-col",
+                                className: "moonx-flex-col",
                                 children: [
                                     /* @__PURE__ */ jsx46("span", {
-                                        className: "moonkey-text--title",
+                                        className: "moonx-text--title",
                                         children: "Ethereum"
                                     }),
                                     /* @__PURE__ */ jsx46("span", {
-                                        className: "moonkey-text--secondary",
+                                        className: "moonx-text--secondary",
                                         children: "Connect with Ethereum network"
                                     })
                                 ]
                             }),
                             /* @__PURE__ */ jsx46("div", {
-                                className: "moonkey-network-badge",
+                                className: "moonx-network-badge",
                                 children: /* @__PURE__ */ jsx46("img", {
                                     src: ethereum_default,
                                     alt: "Ethereum",
@@ -11249,26 +11256,26 @@ var NetworkSelection = function NetworkSelection(param) {
                         ]
                     }),
                     supportedNetworks.includes("solana") && /* @__PURE__ */ jsxs36("div", {
-                        className: "moonkey-wallet-item",
+                        className: "moonx-wallet-item",
                         onClick: function onClick() {
                             return onNetworkSelect("solana");
                         },
                         children: [
                             /* @__PURE__ */ jsxs36("div", {
-                                className: "moonkey-flex-col",
+                                className: "moonx-flex-col",
                                 children: [
                                     /* @__PURE__ */ jsx46("span", {
-                                        className: "moonkey-text--title",
+                                        className: "moonx-text--title",
                                         children: "Solana"
                                     }),
                                     /* @__PURE__ */ jsx46("span", {
-                                        className: "moonkey-text--secondary",
+                                        className: "moonx-text--secondary",
                                         children: "Connect with Solana network"
                                     })
                                 ]
                             }),
                             /* @__PURE__ */ jsx46("div", {
-                                className: "moonkey-network-badge",
+                                className: "moonx-network-badge",
                                 children: /* @__PURE__ */ jsx46("img", {
                                     src: solana_default,
                                     alt: "Solana",
@@ -11892,46 +11899,46 @@ var SolanaConnectionUI = function SolanaConnectionUI(param) {
         }, 100);
     };
     var spinnerWidget = /* @__PURE__ */ jsxs37("div", {
-        className: "moonkey-wallet-spinner",
+        className: "moonx-wallet-spinner",
         children: [
             /* @__PURE__ */ jsx47("div", {
-                className: "moonkey-wallet-spinner__ring"
+                className: "moonx-wallet-spinner__ring"
             }),
             /* @__PURE__ */ jsx47("div", {
-                className: "moonkey-wallet-spinner__spin"
+                className: "moonx-wallet-spinner__spin"
             }),
             /* @__PURE__ */ jsx47("div", {
-                className: "moonkey-wallet-spinner__center",
+                className: "moonx-wallet-spinner__center",
                 children: /* @__PURE__ */ jsx47("img", {
                     src: walletIcon,
                     alt: walletName,
-                    className: "moonkey-icon--lg"
+                    className: "moonx-icon--lg"
                 })
             })
         ]
     });
     return /* @__PURE__ */ jsxs37("div", {
-        className: "moonkey-flex-col-center",
+        className: "moonx-flex-col-center",
         children: [
             (connectionState === "connecting" || connectionState === "signing") && /* @__PURE__ */ jsxs37("div", {
-                className: "moonkey-connect-state",
+                className: "moonx-connect-state",
                 children: [
                     spinnerWidget,
                     /* @__PURE__ */ jsxs37("div", {
-                        className: "moonkey-text--center",
+                        className: "moonx-text--center",
                         style: {
                             marginTop: "1rem"
                         },
                         children: [
                             /* @__PURE__ */ jsx47("div", {
-                                className: "moonkey-label moonkey-text--lg",
+                                className: "moonx-label moonx-text--lg",
                                 style: {
                                     marginBottom: "0.5rem"
                                 },
                                 children: connectionState === "connecting" ? "Connecting to ".concat(walletName) : "Sign Message to Verify"
                             }),
                             /* @__PURE__ */ jsx47("div", {
-                                className: "moonkey-text--secondary",
+                                className: "moonx-text--secondary",
                                 children: connectionState === "connecting" ? "Opening your wallet..." : "Please sign the message in your wallet to complete authentication"
                             })
                         ]
@@ -11939,39 +11946,39 @@ var SolanaConnectionUI = function SolanaConnectionUI(param) {
                 ]
             }),
             (connectionState === "error" || connectionState === "rejected") && /* @__PURE__ */ jsxs37("div", {
-                className: "moonkey-connect-state",
+                className: "moonx-connect-state",
                 children: [
                     /* @__PURE__ */ jsxs37("div", {
-                        className: "moonkey-wallet-spinner",
+                        className: "moonx-wallet-spinner",
                         children: [
                             /* @__PURE__ */ jsx47("div", {
-                                className: "moonkey-wallet-spinner__ring moonkey-wallet-spinner__ring--error"
+                                className: "moonx-wallet-spinner__ring moonx-wallet-spinner__ring--error"
                             }),
                             /* @__PURE__ */ jsx47("div", {
-                                className: "moonkey-wallet-spinner__center",
+                                className: "moonx-wallet-spinner__center",
                                 children: /* @__PURE__ */ jsx47("img", {
                                     src: walletIcon,
                                     alt: walletName,
-                                    className: "moonkey-icon--lg"
+                                    className: "moonx-icon--lg"
                                 })
                             })
                         ]
                     }),
                     /* @__PURE__ */ jsxs37("div", {
-                        className: "moonkey-text--center",
+                        className: "moonx-text--center",
                         style: {
                             marginTop: "1rem"
                         },
                         children: [
                             /* @__PURE__ */ jsx47("div", {
-                                className: "moonkey-label moonkey-text--lg",
+                                className: "moonx-label moonx-text--lg",
                                 style: {
                                     marginBottom: "0.5rem"
                                 },
                                 children: connectionState === "error" ? "Connection Failed" : "Connection Rejected"
                             }),
                             /* @__PURE__ */ jsx47("div", {
-                                className: "moonkey-box moonkey-box--error moonkey-text--error",
+                                className: "moonx-box moonx-box--error moonx-text--error",
                                 style: {
                                     marginBottom: "1rem"
                                 },
@@ -12131,7 +12138,7 @@ var UnifiedWalletList = function UnifiedWalletList(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsxs38("div", {
-                className: "moonkey-flex-between",
+                className: "moonx-flex-between",
                 children: [
                     /* @__PURE__ */ jsx48(Button, {
                         variant: "ghost",
@@ -12140,11 +12147,11 @@ var UnifiedWalletList = function UnifiedWalletList(param) {
                             return onCancel();
                         },
                         children: /* @__PURE__ */ jsx48(ArrowLeft7, {
-                            className: "moonkey-icon--sm"
+                            className: "moonx-icon--sm"
                         })
                     }),
                     /* @__PURE__ */ jsx48("div", {
-                        className: "moonkey-label",
+                        className: "moonx-label",
                         children: /* @__PURE__ */ jsx48("span", {
                             children: "Select a wallet"
                         })
@@ -12159,13 +12166,13 @@ var UnifiedWalletList = function UnifiedWalletList(param) {
                             return onCancel();
                         },
                         children: /* @__PURE__ */ jsx48(X9, {
-                            className: "moonkey-icon--sm"
+                            className: "moonx-icon--sm"
                         })
                     })
                 ]
             }),
             /* @__PURE__ */ jsxs38("div", {
-                className: "moonkey-flex-col",
+                className: "moonx-flex-col",
                 style: {
                     marginTop: "1rem",
                     gap: "0.75rem"
@@ -12183,13 +12190,13 @@ var UnifiedWalletList = function UnifiedWalletList(param) {
                                 onChange: function onChange(e) {
                                     return setSearchValue(e.target.value);
                                 },
-                                className: "moonkey-input",
+                                className: "moonx-input",
                                 style: {
                                     paddingLeft: "2.5rem"
                                 }
                             }),
                             /* @__PURE__ */ jsx48("svg", {
-                                className: "moonkey-search-icon moonkey-icon--sm",
+                                className: "moonx-search-icon moonx-icon--sm",
                                 fill: "none",
                                 stroke: "currentColor",
                                 viewBox: "0 0 24 24",
@@ -12203,26 +12210,26 @@ var UnifiedWalletList = function UnifiedWalletList(param) {
                         ]
                     }),
                     /* @__PURE__ */ jsx48("div", {
-                        className: "moonkey-scrollable-list",
+                        className: "moonx-scrollable-list",
                         style: {
                             height: "300px",
                             gap: "0.5rem"
                         },
                         children: loading ? /* @__PURE__ */ jsx48("div", {
-                            className: "moonkey-text--secondary moonkey-flex-center",
+                            className: "moonx-text--secondary moonx-flex-center",
                             style: {
                                 padding: "2rem 1rem"
                             },
                             children: "Loading wallets..."
                         }) : filteredWallets.length === 0 ? /* @__PURE__ */ jsx48("div", {
-                            className: "moonkey-text--secondary moonkey-text--center",
+                            className: "moonx-text--secondary moonx-text--center",
                             style: {
                                 padding: "2rem 1rem"
                             },
                             children: "No wallets found"
                         }) : filteredWallets.map(function(wallet) {
                             return /* @__PURE__ */ jsxs38("div", {
-                                className: "moonkey-wallet-item",
+                                className: "moonx-wallet-item",
                                 onClick: function onClick() {
                                     return onWalletSelect(wallet);
                                 },
@@ -12254,7 +12261,7 @@ var UnifiedWalletList = function UnifiedWalletList(param) {
                                         })
                                     }),
                                     /* @__PURE__ */ jsx48("span", {
-                                        className: "moonkey-text--sm moonkey-icon--fg",
+                                        className: "moonx-text--sm moonx-icon--fg",
                                         style: {
                                             transition: "color 0.2s"
                                         },
@@ -12270,7 +12277,7 @@ var UnifiedWalletList = function UnifiedWalletList(param) {
                                         },
                                         children: [
                                             wallet.supportedNetworks.includes("ethereum") && /* @__PURE__ */ jsx48("div", {
-                                                className: "moonkey-network-badge",
+                                                className: "moonx-network-badge",
                                                 children: /* @__PURE__ */ jsx48("img", {
                                                     src: ethereum_default,
                                                     alt: "Ethereum",
@@ -12282,7 +12289,7 @@ var UnifiedWalletList = function UnifiedWalletList(param) {
                                                 })
                                             }),
                                             wallet.supportedNetworks.includes("solana") && /* @__PURE__ */ jsx48("div", {
-                                                className: "moonkey-network-badge" + (wallet.supportedNetworks.includes("ethereum") ? " moonkey-network-badge--overlap" : ""),
+                                                className: "moonx-network-badge" + (wallet.supportedNetworks.includes("ethereum") ? " moonx-network-badge--overlap" : ""),
                                                 children: /* @__PURE__ */ jsx48("img", {
                                                     src: solana_default,
                                                     alt: "Solana",
@@ -12468,18 +12475,18 @@ var WalletsFlow = function WalletsFlow(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsxs39("div", {
-                    className: "moonkey-flex-between",
+                    className: "moonx-flex-between",
                     children: [
                         /* @__PURE__ */ jsx49(Button, {
                             variant: "ghost",
                             size: "icon",
                             onClick: handleBack,
                             children: /* @__PURE__ */ jsx49(ArrowLeft8, {
-                                className: "moonkey-icon--sm"
+                                className: "moonx-icon--sm"
                             })
                         }),
                         /* @__PURE__ */ jsx49("div", {
-                            className: "moonkey-text--title",
+                            className: "moonx-text--title",
                             children: /* @__PURE__ */ jsxs39("span", {
                                 children: [
                                     "Connect ",
@@ -12495,13 +12502,13 @@ var WalletsFlow = function WalletsFlow(param) {
                             },
                             onClick: handleBack,
                             children: /* @__PURE__ */ jsx49(X10, {
-                                className: "moonkey-icon--sm"
+                                className: "moonx-icon--sm"
                             })
                         })
                     ]
                 }),
                 /* @__PURE__ */ jsx49("div", {
-                    className: "moonkey-flex-col",
+                    className: "moonx-flex-col",
                     style: {
                         marginTop: "1rem"
                     },
@@ -12528,7 +12535,7 @@ var WalletsFlow = function WalletsFlow(param) {
                 theme: config === null || config === void 0 ? void 0 : (_config_config5 = config.config) === null || _config_config5 === void 0 ? void 0 : _config_config5.theme,
                 appearance: config === null || config === void 0 ? void 0 : (_config_config6 = config.config) === null || _config_config6 === void 0 ? void 0 : _config_config6.appearance,
                 children: /* @__PURE__ */ jsxs39("div", {
-                    className: "moonkey-connect-state",
+                    className: "moonx-connect-state",
                     style: {
                         gap: "1rem"
                     },
@@ -12538,13 +12545,13 @@ var WalletsFlow = function WalletsFlow(param) {
                                 width: "3rem",
                                 height: "3rem",
                                 border: "2px solid transparent",
-                                borderBottomColor: "var(--moonkey-color-accent)",
+                                borderBottomColor: "var(--moonx-color-accent)",
                                 borderRadius: "50%",
-                                animation: "moonkey-spin 1s linear infinite"
+                                animation: "moonx-spin 1s linear infinite"
                             }
                         }),
                         /* @__PURE__ */ jsx49("p", {
-                            className: "moonkey-text--secondary",
+                            className: "moonx-text--secondary",
                             children: "Initializing WalletConnect..."
                         })
                     ]
@@ -12632,10 +12639,10 @@ var TermsAndPrivacy = function TermsAndPrivacy(param) {
         });
     };
     if (require_users_accept_terms) {
-        var checkboxId = "moonkey-terms-checkbox";
+        var checkboxId = "moonx-terms-checkbox";
         return /* @__PURE__ */ jsxs40("label", {
             htmlFor: checkboxId,
-            className: "moonkey-legal-text moonkey-legal-checkbox",
+            className: "moonx-legal-text moonx-legal-checkbox",
             children: [
                 /* @__PURE__ */ jsx50("input", {
                     id: checkboxId,
@@ -12652,7 +12659,7 @@ var TermsAndPrivacy = function TermsAndPrivacy(param) {
         });
     }
     return /* @__PURE__ */ jsx50("div", {
-        className: "moonkey-legal-text",
+        className: "moonx-legal-text",
         children: renderLinks()
     });
 };
@@ -12796,14 +12803,14 @@ var LoginLanding = function LoginLanding(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config7 = config.config) === null || _config_config7 === void 0 ? void 0 : _config_config7.appearance,
         children: [
             !hideClose && /* @__PURE__ */ jsx51("div", {
-                className: "moonkey-flow-close",
+                className: "moonx-flow-close",
                 children: /* @__PURE__ */ jsx51(Button, {
                     variant: "ghost",
                     size: "icon",
                     onClick: onCancel,
                     "aria-label": "Close",
                     children: /* @__PURE__ */ jsx51("svg", {
-                        className: "moonkey-icon--md",
+                        className: "moonx-icon--md",
                         fill: "none",
                         stroke: "currentColor",
                         viewBox: "0 0 24 24",
@@ -12817,20 +12824,20 @@ var LoginLanding = function LoginLanding(param) {
                 })
             }),
             /* @__PURE__ */ jsx51("div", {
-                className: "moonkey-header",
+                className: "moonx-header",
                 children: /* @__PURE__ */ jsx51("div", {
-                    className: "moonkey-header__inner",
+                    className: "moonx-header__inner",
                     children: (config === null || config === void 0 ? void 0 : (_config_config8 = config.config) === null || _config_config8 === void 0 ? void 0 : (_config_config_appearance3 = _config_config8.appearance) === null || _config_config_appearance3 === void 0 ? void 0 : (_config_config_appearance_loginHeaderTitle = _config_config_appearance3.loginHeaderTitle) === null || _config_config_appearance_loginHeaderTitle === void 0 ? void 0 : _config_config_appearance_loginHeaderTitle.toString()) || t("loginLanding.title")
                 })
             }),
             /* @__PURE__ */ jsxs41("div", {
-                className: "moonkey-content-wrapper",
+                className: "moonx-content-wrapper",
                 children: [
                     /* @__PURE__ */ jsxs41("div", {
-                        className: "moonkey-logo-section",
+                        className: "moonx-logo-section",
                         children: [
                             /* @__PURE__ */ jsx51("div", {
-                                className: "moonkey-logo-section__inner",
+                                className: "moonx-logo-section__inner",
                                 children: /* @__PURE__ */ jsx51(AppLogo, {
                                     appConfig: appConfig,
                                     src: logo === null || logo === void 0 ? void 0 : logo.src,
@@ -12839,16 +12846,16 @@ var LoginLanding = function LoginLanding(param) {
                                 })
                             }),
                             (config === null || config === void 0 ? void 0 : (_config_config9 = config.config) === null || _config_config9 === void 0 ? void 0 : (_config_config_appearance4 = _config_config9.appearance) === null || _config_config_appearance4 === void 0 ? void 0 : _config_config_appearance4.loginHeaderDescription) && /* @__PURE__ */ jsx51("div", {
-                                className: "moonkey-description",
+                                className: "moonx-description",
                                 children: config === null || config === void 0 ? void 0 : (_config_config10 = config.config) === null || _config_config10 === void 0 ? void 0 : (_config_config_appearance5 = _config_config10.appearance) === null || _config_config_appearance5 === void 0 ? void 0 : _config_config_appearance5.loginHeaderDescription
                             })
                         ]
                     }),
                     /* @__PURE__ */ jsxs41("div", {
-                        className: "moonkey-form-section",
+                        className: "moonx-form-section",
                         children: [
                             /* @__PURE__ */ jsxs41("div", {
-                                className: "moonkey-login-gateable".concat(loginGated ? " moonkey-login-gated" : ""),
+                                className: "moonx-login-gateable".concat(loginGated ? " moonx-login-gated" : ""),
                                 "aria-disabled": loginGated,
                                 children: [
                                     showEmail && /* @__PURE__ */ jsx51(EmailOtpInput, {
@@ -12864,7 +12871,7 @@ var LoginLanding = function LoginLanding(param) {
                                         }
                                     }),
                                     /* @__PURE__ */ jsxs41("div", {
-                                        className: "moonkey-social-buttons moonkey-flex-col",
+                                        className: "moonx-social-buttons moonx-flex-col",
                                         children: [
                                             showGoogle && /* @__PURE__ */ jsx51(GoogleLogin, {
                                                 onLoginClick: function onLoginClick() {
@@ -12879,7 +12886,7 @@ var LoginLanding = function LoginLanding(param) {
                                         ]
                                     }),
                                     showWallet && /* @__PURE__ */ jsx51("div", {
-                                        className: "moonkey-wallet-section moonkey-flex-col",
+                                        className: "moonx-wallet-section moonx-flex-col",
                                         style: {
                                             gap: "0.75rem"
                                         },
@@ -12913,7 +12920,7 @@ var OAuth = function OAuth(param) {
     var t = useTranslation().t;
     var isDark = isDarkMode(config === null || config === void 0 ? void 0 : (_config_config = config.config) === null || _config_config === void 0 ? void 0 : _config_config.theme, config === null || config === void 0 ? void 0 : (_config_config1 = config.config) === null || _config_config1 === void 0 ? void 0 : (_config_config_appearance = _config_config1.appearance) === null || _config_config_appearance === void 0 ? void 0 : _config_config_appearance.displayMode, config === null || config === void 0 ? void 0 : (_config_config2 = config.config) === null || _config_config2 === void 0 ? void 0 : (_config_config_appearance1 = _config_config2.appearance) === null || _config_config_appearance1 === void 0 ? void 0 : _config_config_appearance1.backgroundColor);
     var googleIcon = /* @__PURE__ */ jsxs42("svg", {
-        className: "moonkey-icon--xl",
+        className: "moonx-icon--xl",
         viewBox: "0 0 24 24",
         xmlns: "http://www.w3.org/2000/svg",
         children: [
@@ -12936,13 +12943,13 @@ var OAuth = function OAuth(param) {
         ]
     });
     var appleIcon = /* @__PURE__ */ jsx52("svg", {
-        className: "moonkey-icon--xl",
+        className: "moonx-icon--xl",
         viewBox: "0 0 20 20",
         xmlns: "http://www.w3.org/2000/svg",
         children: /* @__PURE__ */ jsx52("path", {
             d: "M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z",
             transform: "translate(-2, -2)",
-            fill: "var(--moonkey-color-foreground, #000)"
+            fill: "var(--moonx-color-foreground, #000)"
         })
     });
     var getIcon = function getIcon() {
@@ -12961,7 +12968,7 @@ var OAuth = function OAuth(param) {
         theme: config === null || config === void 0 ? void 0 : (_config_config3 = config.config) === null || _config_config3 === void 0 ? void 0 : _config_config3.theme,
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: /* @__PURE__ */ jsxs42("div", {
-            className: cx("moonkey-oauth-container", "moonkey-flex-col-center", "moonkey-text--center"),
+            className: cx("moonx-oauth-container", "moonx-flex-col-center", "moonx-text--center"),
             style: {
                 paddingBottom: "0.25rem",
                 paddingLeft: "0.5rem",
@@ -12970,10 +12977,10 @@ var OAuth = function OAuth(param) {
             },
             children: [
                 /* @__PURE__ */ jsx52("div", {
-                    className: "moonkey-flow-logo",
+                    className: "moonx-flow-logo",
                     children: /* @__PURE__ */ jsx52(AppLogo, {
                         appConfig: appConfig,
-                        className: "moonkey-icon--lg"
+                        className: "moonx-icon--lg"
                     })
                 }),
                 /* @__PURE__ */ jsx52("div", {
@@ -12982,7 +12989,7 @@ var OAuth = function OAuth(param) {
                         gap: "1rem",
                         justifyContent: "center"
                     },
-                    className: "moonkey-flex-col-center",
+                    className: "moonx-flex-col-center",
                     children: /* @__PURE__ */ jsx52(LoadingSpinner, {
                         iconComponent: getIcon(),
                         size: "md",
@@ -13243,17 +13250,17 @@ var PasskeyEnroll = function PasskeyEnroll(param) {
             theme: config === null || config === void 0 ? void 0 : (_config_config6 = config.config) === null || _config_config6 === void 0 ? void 0 : _config_config6.theme,
             appearance: config === null || config === void 0 ? void 0 : (_config_config7 = config.config) === null || _config_config7 === void 0 ? void 0 : _config_config7.appearance,
             children: /* @__PURE__ */ jsxs43("div", {
-                className: cx("moonkey-passkey-enroll", "moonkey-passkey-success", "moonkey-modal-content"),
+                className: cx("moonx-passkey-enroll", "moonx-passkey-success", "moonx-modal-content"),
                 children: [
                     /* @__PURE__ */ jsx53("div", {
-                        className: "moonkey-flow-logo",
+                        className: "moonx-flow-logo",
                         style: {
                             paddingTop: "1rem"
                         },
                         children: customLogoUrl ? /* @__PURE__ */ jsx53("img", {
                             src: customLogoUrl,
                             alt: "",
-                            className: "moonkey-icon--lg",
+                            className: "moonx-icon--lg",
                             style: {
                                 objectFit: "contain"
                             }
@@ -13266,18 +13273,18 @@ var PasskeyEnroll = function PasskeyEnroll(param) {
                         })
                     }),
                     /* @__PURE__ */ jsx53(CheckCircle24, {
-                        className: "moonkey-icon--2xl moonkey-icon--success"
+                        className: "moonx-icon--2xl moonx-icon--success"
                     }),
                     /* @__PURE__ */ jsx53("div", {
-                        className: "moonkey-text--title moonkey-text--xl",
+                        className: "moonx-text--title moonx-text--xl",
                         children: successTitleText
                     }),
                     /* @__PURE__ */ jsx53("div", {
-                        className: "moonkey-text--secondary",
+                        className: "moonx-text--secondary",
                         children: successDescriptionText
                     }),
                     /* @__PURE__ */ jsx53("div", {
-                        className: "moonkey-btn-stack",
+                        className: "moonx-btn-stack",
                         children: /* @__PURE__ */ jsx53(Button, {
                             onClick: finish,
                             children: successDoneButtonText
@@ -13293,17 +13300,17 @@ var PasskeyEnroll = function PasskeyEnroll(param) {
         theme: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.theme,
         appearance: config === null || config === void 0 ? void 0 : (_config_config5 = config.config) === null || _config_config5 === void 0 ? void 0 : _config_config5.appearance,
         children: /* @__PURE__ */ jsxs43("div", {
-            className: cx("moonkey-passkey-enroll", "moonkey-modal-content"),
+            className: cx("moonx-passkey-enroll", "moonx-modal-content"),
             children: [
                 /* @__PURE__ */ jsx53("div", {
-                    className: "moonkey-flow-logo",
+                    className: "moonx-flow-logo",
                     style: {
                         paddingTop: "1rem"
                     },
                     children: customLogoUrl ? /* @__PURE__ */ jsx53("img", {
                         src: customLogoUrl,
                         alt: "",
-                        className: "moonkey-icon--lg",
+                        className: "moonx-icon--lg",
                         style: {
                             objectFit: "contain"
                         }
@@ -13316,18 +13323,18 @@ var PasskeyEnroll = function PasskeyEnroll(param) {
                     })
                 }),
                 /* @__PURE__ */ jsx53(Fingerprint2, {
-                    className: "moonkey-icon--xl moonkey-icon--accent"
+                    className: "moonx-icon--xl moonx-icon--accent"
                 }),
                 /* @__PURE__ */ jsx53("div", {
-                    className: "moonkey-text--title moonkey-text--xl",
+                    className: "moonx-text--title moonx-text--xl",
                     children: titleText
                 }),
                 /* @__PURE__ */ jsx53("div", {
-                    className: "moonkey-text--secondary",
+                    className: "moonx-text--secondary",
                     children: descriptionText
                 }),
                 /* @__PURE__ */ jsxs43("div", {
-                    className: "moonkey-flex-col",
+                    className: "moonx-flex-col",
                     style: {
                         gap: "0.75rem",
                         width: "100%",
@@ -13335,10 +13342,10 @@ var PasskeyEnroll = function PasskeyEnroll(param) {
                     },
                     children: [
                         /* @__PURE__ */ jsxs43("div", {
-                            className: "moonkey-feature-item",
+                            className: "moonx-feature-item",
                             children: [
                                 /* @__PURE__ */ jsx53(ShieldCheck, {
-                                    className: "moonkey-icon--accent",
+                                    className: "moonx-icon--accent",
                                     style: {
                                         width: "1.25rem",
                                         height: "1.25rem",
@@ -13351,10 +13358,10 @@ var PasskeyEnroll = function PasskeyEnroll(param) {
                             ]
                         }),
                         /* @__PURE__ */ jsxs43("div", {
-                            className: "moonkey-feature-item",
+                            className: "moonx-feature-item",
                             children: [
                                 /* @__PURE__ */ jsx53(CloudCog, {
-                                    className: "moonkey-icon--accent",
+                                    className: "moonx-icon--accent",
                                     style: {
                                         width: "1.25rem",
                                         height: "1.25rem",
@@ -13372,7 +13379,7 @@ var PasskeyEnroll = function PasskeyEnroll(param) {
                     children: errorMessage
                 }),
                 /* @__PURE__ */ jsxs43("div", {
-                    className: "moonkey-btn-stack",
+                    className: "moonx-btn-stack",
                     children: [
                         /* @__PURE__ */ jsx53(Button, {
                             onClick: enroll,
@@ -13393,6 +13400,32 @@ var PasskeyEnroll = function PasskeyEnroll(param) {
 // src/components/flows/send-ethereum-transaction-flow/send-ethereum-transaction-flow.tsx
 import { PostMessageClient as PostMessageClient4, PostMessageMethod as PostMessageMethod21, PostMessageType as PostMessageType22 } from "@moon-x/core/utils";
 import { useState as useState41 } from "react";
+// src/lib/verify-ethereum-transaction.ts
+import { serializeEthereumTransaction as serializeEthereumTransaction2 } from "@moon-x/core/lib";
+var ETHEREUM_TX_PREVIEW_MISMATCH = "ETHEREUM_TX_PREVIEW_MISMATCH";
+function canonicalSerializedForSigning(transaction, serializedTransaction) {
+    return _async_to_generator(function() {
+        var canonical;
+        return _ts_generator(this, function(_state) {
+            switch(_state.label){
+                case 0:
+                    return [
+                        4,
+                        serializeEthereumTransaction2(transaction)
+                    ];
+                case 1:
+                    canonical = _state.sent();
+                    if (canonical.toLowerCase() !== serializedTransaction.toLowerCase()) {
+                        throw new Error(ETHEREUM_TX_PREVIEW_MISMATCH);
+                    }
+                    return [
+                        2,
+                        canonical
+                    ];
+            }
+        });
+    })();
+}
 // src/components/flows/send-ethereum-transaction-flow/send-ethereum-transaction.tsx
 import { PostMessageMethod as PostMessageMethod20, PostMessageType as PostMessageType21 } from "@moon-x/core/utils";
 import { ListCheck, X as X11, XCircle as XCircle2 } from "lucide-react";
@@ -13473,7 +13506,7 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
         console.error("Failed to get confirm transaction:", error2 || "Unknown error");
     };
     return /* @__PURE__ */ jsx54("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs44(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -13481,35 +13514,35 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx54("div", {
-                    className: "moonkey-flow-close",
+                    className: "moonx-flow-close",
                     children: /* @__PURE__ */ jsx54(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onCancel,
                         children: /* @__PURE__ */ jsx54(X11, {
-                            className: "moonkey-icon--sm"
+                            className: "moonx-icon--sm"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsxs44("div", {
-                    className: "moonkey-flow-header",
+                    className: "moonx-flow-header",
                     style: {
                         marginTop: "1rem"
                     },
                     children: [
                         /* @__PURE__ */ jsx54("div", {
-                            className: "moonkey-flow-logo",
+                            className: "moonx-flow-logo",
                             children: /* @__PURE__ */ jsx54(AppLogo, {
                                 appConfig: appConfig,
-                                className: "moonkey-icon--lg"
+                                className: "moonx-icon--lg"
                             })
                         }),
                         /* @__PURE__ */ jsx54("div", {
-                            className: "moonkey-label",
+                            className: "moonx-label",
                             children: t("sendTransaction.confirmTransaction")
                         }),
                         /* @__PURE__ */ jsx54("div", {
-                            className: "moonkey-text--secondary",
+                            className: "moonx-text--secondary",
                             children: t("sendTransaction.wantsPermission", {
                                 companyName: appConfig === null || appConfig === void 0 ? void 0 : appConfig.name
                             })
@@ -13517,7 +13550,7 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
                     ]
                 }),
                 isLoadingError ? /* @__PURE__ */ jsxs44("div", {
-                    className: "moonkey-flex-col-center",
+                    className: "moonx-flex-col-center",
                     style: {
                         textAlign: "center",
                         marginTop: "2rem",
@@ -13526,17 +13559,17 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
                     children: [
                         /* @__PURE__ */ jsx54("div", {
                             children: /* @__PURE__ */ jsx54(XCircle2, {
-                                className: "moonkey-icon--lg moonkey-icon--error"
+                                className: "moonx-icon--lg moonx-icon--error"
                             })
                         }),
                         /* @__PURE__ */ jsxs44("div", {
                             children: [
                                 /* @__PURE__ */ jsx54("div", {
-                                    className: "moonkey-label",
+                                    className: "moonx-label",
                                     children: "Error detected"
                                 }),
                                 /* @__PURE__ */ jsx54("div", {
-                                    className: "moonkey-text--secondary",
+                                    className: "moonx-text--secondary",
                                     style: {
                                         marginTop: "1rem"
                                     },
@@ -13546,12 +13579,12 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
                         })
                     ]
                 }) : /* @__PURE__ */ jsx54("div", {
-                    className: "moonkey-flex-col",
+                    className: "moonx-flex-col",
                     style: {
                         marginTop: "1rem"
                     },
                     children: /* @__PURE__ */ jsxs44("div", {
-                        className: "moonkey-detail-card__rows",
+                        className: "moonx-detail-card__rows",
                         children: [
                             /* @__PURE__ */ jsxs44("div", {
                                 style: {
@@ -13570,7 +13603,7 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
                                     /* @__PURE__ */ jsx54(DetailRow, {
                                         label: formatAddress((wallet === null || wallet === void 0 ? void 0 : wallet.public_address) || "", 8, 8),
                                         value: isLoadingConfirm ? /* @__PURE__ */ jsx54("div", {
-                                            className: "moonkey-skeleton",
+                                            className: "moonx-skeleton",
                                             style: {
                                                 height: "1rem",
                                                 width: "4rem"
@@ -13597,7 +13630,7 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
                                 children: /* @__PURE__ */ jsx54(DetailRow, {
                                     label: t("sendTransaction.estimatedFee"),
                                     value: isLoadingConfirm ? /* @__PURE__ */ jsx54("div", {
-                                        className: "moonkey-skeleton",
+                                        className: "moonx-skeleton",
                                         style: {
                                             height: "1rem",
                                             width: "4rem"
@@ -13623,10 +13656,10 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
                                     },
                                     children: [
                                         /* @__PURE__ */ jsx54(ListCheck, {
-                                            className: "moonkey-icon--sm"
+                                            className: "moonx-icon--sm"
                                         }),
                                         /* @__PURE__ */ jsx54("span", {
-                                            className: "moonkey-label",
+                                            className: "moonx-label",
                                             children: isLoadingConfirm ? t("common.loading") : t("sendTransaction.viewAdvancedDetails")
                                         })
                                     ]
@@ -13636,9 +13669,9 @@ var SendEthereumTransaction = function SendEthereumTransaction(param) {
                     })
                 }),
                 /* @__PURE__ */ jsx54("div", {
-                    className: "moonkey-flow-footer",
+                    className: "moonx-flow-footer",
                     children: /* @__PURE__ */ jsxs44("div", {
-                        className: "moonkey-flow-footer__actions",
+                        className: "moonx-flow-footer__actions",
                         children: [
                             /* @__PURE__ */ jsx54(Button, {
                                 variant: "outline",
@@ -13666,7 +13699,7 @@ function SendEthereumTransactionFailed(param) {
     var t = useTranslation().t;
     var isDark = propsIsDark !== void 0 ? propsIsDark : isDarkMode(config === null || config === void 0 ? void 0 : (_config_config = config.config) === null || _config_config === void 0 ? void 0 : _config_config.theme, config === null || config === void 0 ? void 0 : (_config_config1 = config.config) === null || _config_config1 === void 0 ? void 0 : (_config_config_appearance = _config_config1.appearance) === null || _config_config_appearance === void 0 ? void 0 : _config_config_appearance.displayMode, config === null || config === void 0 ? void 0 : (_config_config2 = config.config) === null || _config_config2 === void 0 ? void 0 : (_config_config_appearance1 = _config_config2.appearance) === null || _config_config_appearance1 === void 0 ? void 0 : _config_config_appearance1.backgroundColor);
     return /* @__PURE__ */ jsx55("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs45(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -13674,29 +13707,29 @@ function SendEthereumTransactionFailed(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx55("div", {
-                    className: "moonkey-flow-close",
+                    className: "moonx-flow-close",
                     children: /* @__PURE__ */ jsx55(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onClose,
                         children: /* @__PURE__ */ jsx55(X12, {
-                            className: "moonkey-icon--md"
+                            className: "moonx-icon--md"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx55("div", {
-                    className: "moonkey-flex-center",
+                    className: "moonx-flex-center",
                     children: /* @__PURE__ */ jsx55("div", {
                         style: {
-                            animation: "moonkey-error-bounce 0.8s ease-out 0.1s both"
+                            animation: "moonx-error-bounce 0.8s ease-out 0.1s both"
                         },
                         children: /* @__PURE__ */ jsx55(XCircle3, {
-                            className: "moonkey-icon--2xl moonkey-icon--error"
+                            className: "moonx-icon--2xl moonx-icon--error"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx55("div", {
-                    className: "moonkey-text--heading",
+                    className: "moonx-text--heading",
                     style: {
                         paddingTop: "2rem"
                     },
@@ -13709,7 +13742,7 @@ function SendEthereumTransactionFailed(param) {
                         paddingRight: "0.5rem"
                     },
                     children: /* @__PURE__ */ jsx55("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.description) || t("sendTransaction.failure.transactionFailedDescription")
                     })
                 }),
@@ -13720,14 +13753,14 @@ function SendEthereumTransactionFailed(param) {
                         marginTop: "1.5rem"
                     },
                     children: /* @__PURE__ */ jsx55("div", {
-                        className: "moonkey-text--sm moonkey-text--semibold",
+                        className: "moonx-text--sm moonx-text--semibold",
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.errorTitle) || t("sendTransaction.failure.transactionFailedErrorDetails")
                     })
                 }),
                 /* @__PURE__ */ jsx55("div", {
-                    className: "moonkey-error-scroll",
+                    className: "moonx-error-scroll",
                     children: /* @__PURE__ */ jsx55("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         style: {
                             padding: "0 0.5rem"
                         },
@@ -13735,9 +13768,9 @@ function SendEthereumTransactionFailed(param) {
                     })
                 }),
                 /* @__PURE__ */ jsx55("div", {
-                    className: "moonkey-flow-footer",
+                    className: "moonx-flow-footer",
                     children: /* @__PURE__ */ jsx55("div", {
-                        className: "moonkey-flow-footer__actions",
+                        className: "moonx-flow-footer__actions",
                         children: /* @__PURE__ */ jsx55(Button, {
                             onClick: onClose,
                             children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.closeButtonText) || t("sendTransaction.failure.transactionFailedRetryTransaction")
@@ -13757,7 +13790,7 @@ function SendEthereumTransactionSuccess(param) {
     var t = useTranslation().t;
     var isDark = propsIsDark !== void 0 ? propsIsDark : isDarkMode(config === null || config === void 0 ? void 0 : (_config_config = config.config) === null || _config_config === void 0 ? void 0 : _config_config.theme, config === null || config === void 0 ? void 0 : (_config_config1 = config.config) === null || _config_config1 === void 0 ? void 0 : (_config_config_appearance = _config_config1.appearance) === null || _config_config_appearance === void 0 ? void 0 : _config_config_appearance.displayMode, config === null || config === void 0 ? void 0 : (_config_config2 = config.config) === null || _config_config2 === void 0 ? void 0 : (_config_config_appearance1 = _config_config2.appearance) === null || _config_config_appearance1 === void 0 ? void 0 : _config_config_appearance1.backgroundColor);
     return /* @__PURE__ */ jsx56("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs46(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -13765,18 +13798,18 @@ function SendEthereumTransactionSuccess(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx56("div", {
-                    className: "moonkey-flex-center",
+                    className: "moonx-flex-center",
                     children: /* @__PURE__ */ jsx56("div", {
                         style: {
-                            animation: "moonkey-success-bounce 0.8s ease-out 0.1s both"
+                            animation: "moonx-success-bounce 0.8s ease-out 0.1s both"
                         },
                         children: /* @__PURE__ */ jsx56(CheckCircle25, {
-                            className: "moonkey-icon--2xl moonkey-icon--success"
+                            className: "moonx-icon--2xl moonx-icon--success"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx56("div", {
-                    className: "moonkey-text--heading",
+                    className: "moonx-text--heading",
                     style: {
                         paddingTop: "2rem"
                     },
@@ -13789,14 +13822,14 @@ function SendEthereumTransactionSuccess(param) {
                         paddingRight: "0.5rem"
                     },
                     children: /* @__PURE__ */ jsx56("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.description) || t("sendTransaction.success.transactionCompleteDescription")
                     })
                 }),
                 /* @__PURE__ */ jsx56("div", {
-                    className: "moonkey-detail-card",
+                    className: "moonx-detail-card",
                     children: /* @__PURE__ */ jsxs46("div", {
-                        className: "moonkey-detail-card__rows",
+                        className: "moonx-detail-card__rows",
                         children: [
                             /* @__PURE__ */ jsx56(DetailRow, {
                                 label: t("sendTransaction.success.transactionCompleteNetwork"),
@@ -13808,7 +13841,7 @@ function SendEthereumTransactionSuccess(param) {
                             /* @__PURE__ */ jsx56(DetailRow, {
                                 label: t("sendTransaction.success.transactionCompleteTotal"),
                                 value: /* @__PURE__ */ jsxs46("div", {
-                                    className: "moonkey-flex-col",
+                                    className: "moonx-flex-col",
                                     style: {
                                         textAlign: "right"
                                     },
@@ -13817,7 +13850,7 @@ function SendEthereumTransactionSuccess(param) {
                                             children: transactionSummary.totalFiat
                                         }),
                                         /* @__PURE__ */ jsx56("span", {
-                                            className: "moonkey-text--secondary",
+                                            className: "moonx-text--secondary",
                                             children: transactionSummary.totalCrypto
                                         })
                                     ]
@@ -13965,7 +13998,7 @@ function TransactionDetails(param) {
     if (loading) {
         var _config_config5, _config_config6;
         return /* @__PURE__ */ jsx57("div", {
-            className: "moonkey-flow-overlay",
+            className: "moonx-flow-overlay",
             children: /* @__PURE__ */ jsx57(RootCard, {
                 centerContent: false,
                 isDark: isDark,
@@ -13977,7 +14010,7 @@ function TransactionDetails(param) {
                         textAlign: "center"
                     },
                     children: /* @__PURE__ */ jsx57("div", {
-                        className: "moonkey-text--secondary",
+                        className: "moonx-text--secondary",
                         children: "Loading transaction details..."
                     })
                 })
@@ -13987,7 +14020,7 @@ function TransactionDetails(param) {
     if (error) {
         var _config_config7, _config_config8;
         return /* @__PURE__ */ jsx57("div", {
-            className: "moonkey-flow-overlay",
+            className: "moonx-flow-overlay",
             children: /* @__PURE__ */ jsxs47(RootCard, {
                 centerContent: false,
                 isDark: isDark,
@@ -13995,18 +14028,18 @@ function TransactionDetails(param) {
                 appearance: config === null || config === void 0 ? void 0 : (_config_config8 = config.config) === null || _config_config8 === void 0 ? void 0 : _config_config8.appearance,
                 children: [
                     /* @__PURE__ */ jsx57("div", {
-                        className: "moonkey-flow-close",
+                        className: "moonx-flow-close",
                         children: /* @__PURE__ */ jsx57(Button, {
                             variant: "ghost",
                             size: "icon",
                             onClick: onClose,
                             children: /* @__PURE__ */ jsx57(X13, {
-                                className: "moonkey-icon--md"
+                                className: "moonx-icon--md"
                             })
                         })
                     }),
                     /* @__PURE__ */ jsxs47("div", {
-                        className: "moonkey-flex-col-center",
+                        className: "moonx-flex-col-center",
                         style: {
                             padding: "2rem",
                             textAlign: "center",
@@ -14019,7 +14052,7 @@ function TransactionDetails(param) {
                                     width: "3rem",
                                     height: "3rem",
                                     borderRadius: "50%",
-                                    backgroundColor: "var(--moonkey-color-error)",
+                                    backgroundColor: "var(--moonx-color-error)",
                                     opacity: 0.1,
                                     display: "flex",
                                     alignItems: "center",
@@ -14028,7 +14061,7 @@ function TransactionDetails(param) {
                                 },
                                 children: /* @__PURE__ */ jsx57("div", {
                                     style: {
-                                        color: "var(--moonkey-color-error)",
+                                        color: "var(--moonx-color-error)",
                                         fontSize: "1.5rem",
                                         fontWeight: "bold"
                                     },
@@ -14042,7 +14075,7 @@ function TransactionDetails(param) {
                                 children: "Unable to Load Transaction"
                             }),
                             /* @__PURE__ */ jsx57("div", {
-                                className: "moonkey-text--secondary",
+                                className: "moonx-text--secondary",
                                 style: {
                                     marginBottom: "1rem",
                                     maxWidth: "300px"
@@ -14052,9 +14085,9 @@ function TransactionDetails(param) {
                         ]
                     }),
                     /* @__PURE__ */ jsx57("div", {
-                        className: "moonkey-flow-footer",
+                        className: "moonx-flow-footer",
                         children: /* @__PURE__ */ jsx57("div", {
-                            className: "moonkey-flow-footer__actions",
+                            className: "moonx-flow-footer__actions",
                             children: /* @__PURE__ */ jsx57(Button, {
                                 onClick: onClose,
                                 variant: "default",
@@ -14068,7 +14101,7 @@ function TransactionDetails(param) {
         });
     }
     return /* @__PURE__ */ jsx57("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs47(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -14076,28 +14109,28 @@ function TransactionDetails(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx57("div", {
-                    className: "moonkey-flow-close",
+                    className: "moonx-flow-close",
                     children: /* @__PURE__ */ jsx57(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onClose,
                         children: /* @__PURE__ */ jsx57(X13, {
-                            className: "moonkey-icon--md"
+                            className: "moonx-icon--md"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx57("div", {
-                    className: "moonkey-flow-header",
+                    className: "moonx-flow-header",
                     style: {
                         marginTop: "1rem"
                     },
                     children: /* @__PURE__ */ jsx57("div", {
-                        className: "moonkey-label",
+                        className: "moonx-label",
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.title) || t("sendTransaction.advancedTransactionDetails")
                     })
                 }),
                 /* @__PURE__ */ jsx57("div", {
-                    className: "moonkey-scrollable-list",
+                    className: "moonx-scrollable-list",
                     style: {
                         height: "300px",
                         margin: "1rem 0.75rem 0"
@@ -14108,14 +14141,14 @@ function TransactionDetails(param) {
                         },
                         children: transactionDetails.map(function(section) {
                             return /* @__PURE__ */ jsxs47("div", {
-                                className: "moonkey-flex-col",
+                                className: "moonx-flex-col",
                                 style: {
                                     justifyContent: "space-between",
                                     marginBottom: "1.5rem"
                                 },
                                 children: [
                                     /* @__PURE__ */ jsx57("h3", {
-                                        className: "moonkey-label",
+                                        className: "moonx-label",
                                         style: {
                                             marginBottom: "0.75rem"
                                         },
@@ -14131,7 +14164,7 @@ function TransactionDetails(param) {
                                                 paddingTop: "0.5rem",
                                                 paddingBottom: "0.5rem"
                                             }, index < section.details.length - 1 && {
-                                                borderBottom: "1px solid var(--moonkey-color-border)"
+                                                borderBottom: "1px solid var(--moonx-color-border)"
                                             })
                                         }, index);
                                     })
@@ -14141,9 +14174,9 @@ function TransactionDetails(param) {
                     })
                 }),
                 /* @__PURE__ */ jsx57("div", {
-                    className: "moonkey-flow-footer",
+                    className: "moonx-flow-footer",
                     children: /* @__PURE__ */ jsx57("div", {
-                        className: "moonkey-flow-footer__actions",
+                        className: "moonx-flow-footer__actions",
                         children: /* @__PURE__ */ jsx57(Button, {
                             onClick: onClose,
                             variant: "default",
@@ -14166,6 +14199,12 @@ var SendEthereumTransactionFlow = function SendEthereumTransactionFlow(param) {
     var _useState411 = _sliced_to_array(useState41(""), 2), transactionHash = _useState411[0], setTransactionHash = _useState411[1];
     var _useState412 = _sliced_to_array(useState41(null), 2), confirmTransactionData = _useState412[0], setConfirmTransactionData = _useState412[1];
     var _useState413 = _sliced_to_array(useState41(false), 2), isSending = _useState413[0], setIsSending = _useState413[1];
+    var _useState414 = _sliced_to_array(useState41(function() {
+        return structuredClone(sendTransactionRequest);
+    }), 1), request = _useState414[0];
+    var _useState415 = _sliced_to_array(useState41(function() {
+        return structuredClone(wallet);
+    }), 1), requestWallet = _useState415[0];
     var onConfirm = function onConfirm() {
         handleSend();
     };
@@ -14184,15 +14223,15 @@ var SendEthereumTransactionFlow = function SendEthereumTransactionFlow(param) {
     };
     var handleSend = function handleSend() {
         return _async_to_generator(function() {
-            var _options_uiOptions, client, _ref, userHandleB64url, credentialIdB64url, presenceTokens, signed, broadcastResponse, broadcast, hash, parentClient, error;
+            var _options_uiOptions, client, serializedToSign, _ref, userHandleB64url, credentialIdB64url, presenceTokens, signed, broadcastResponse, broadcast, hash, parentClient, error;
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
                         _state.trys.push([
                             0,
-                            5,
+                            6,
                             ,
-                            6
+                            7
                         ]);
                         setIsSending(true);
                         client = getIframeClient(publishableKey);
@@ -14204,27 +14243,33 @@ var SendEthereumTransactionFlow = function SendEthereumTransactionFlow(param) {
                         }
                         return [
                             4,
-                            onAssertPasskey()
+                            canonicalSerializedForSigning(request.transaction, request.serializedTransaction)
                         ];
                     case 1:
+                        serializedToSign = _state.sent();
+                        return [
+                            4,
+                            onAssertPasskey()
+                        ];
+                    case 2:
                         _ref = _state.sent(), userHandleB64url = _ref.userHandleB64url, credentialIdB64url = _ref.credentialIdB64url, presenceTokens = _ref.presenceTokens;
                         return [
                             4,
                             client.send(PostMessageType22.WALLET, PostMessageMethod21.SIGN_TRANSACTION, {
                                 publishableKey: publishableKey,
-                                serializedTransaction: sendTransactionRequest.serializedTransaction,
-                                wallet: wallet,
+                                serializedTransaction: serializedToSign,
+                                wallet: requestWallet,
                                 options: options,
                                 userHandleB64url: userHandleB64url,
                                 credentialIdB64url: credentialIdB64url,
                                 presenceTokens: presenceTokens
                             })
                         ];
-                    case 2:
+                    case 3:
                         signed = _state.sent();
                         return [
                             4,
-                            fetch(sendTransactionRequest.rpcUrl, {
+                            fetch(request.rpcUrl, {
                                 method: "POST",
                                 headers: {
                                     "Content-Type": "application/json"
@@ -14239,13 +14284,13 @@ var SendEthereumTransactionFlow = function SendEthereumTransactionFlow(param) {
                                 })
                             })
                         ];
-                    case 3:
+                    case 4:
                         broadcastResponse = _state.sent();
                         return [
                             4,
                             broadcastResponse.json()
                         ];
-                    case 4:
+                    case 5:
                         broadcast = _state.sent();
                         if (broadcast.error) {
                             setIsSending(false);
@@ -14270,21 +14315,21 @@ var SendEthereumTransactionFlow = function SendEthereumTransactionFlow(param) {
                             onComplete === null || onComplete === void 0 ? void 0 : onComplete({
                                 hash: hash,
                                 signature: signed.signature,
-                                metadata: sendTransactionRequest.metadata
+                                metadata: request.metadata
                             });
                         }, getWaitBeforeCloseTime());
                         return [
                             3,
-                            6
+                            7
                         ];
-                    case 5:
+                    case 6:
                         error = _state.sent();
                         setIsSending(false);
                         setCurrentStep("failed");
                         return [
                             2
                         ];
-                    case 6:
+                    case 7:
                         return [
                             2
                         ];
@@ -14315,10 +14360,10 @@ var SendEthereumTransactionFlow = function SendEthereumTransactionFlow(param) {
     if (currentStep === "confirm") {
         return /* @__PURE__ */ jsx58(SendEthereumTransaction, {
             publishableKey: publishableKey,
-            transaction: sendTransactionRequest.transaction,
-            wallet: wallet,
-            rpcUrl: sendTransactionRequest.rpcUrl,
-            network: sendTransactionRequest.network,
+            transaction: request.serializedTransaction,
+            wallet: requestWallet,
+            rpcUrl: request.rpcUrl,
+            network: request.network,
             onCancel: handleCancel,
             onConfirm: onConfirm,
             onAdvancedDetailsClick: onAdvancedDetailsClick,
@@ -14338,22 +14383,22 @@ var SendEthereumTransactionFlow = function SendEthereumTransactionFlow(param) {
         });
     }
     if (currentStep === "success") {
-        var _sendTransactionRequest_metadata, _options_uiOptions1, _sendTransactionRequest_metadata1;
-        var txData = typeof sendTransactionRequest.transaction === "string" ? null : sendTransactionRequest.transaction;
+        var _request_metadata, _options_uiOptions1, _request_metadata1;
+        var txData = typeof request.transaction === "string" ? null : request.transaction;
         var ethAmount = (txData === null || txData === void 0 ? void 0 : txData.value) || "0";
         var maxFeePerGas = (txData === null || txData === void 0 ? void 0 : txData.maxFeePerGas) || "0";
         var gasLimit = (txData === null || txData === void 0 ? void 0 : txData.gasLimit) || (txData === null || txData === void 0 ? void 0 : txData.gas) || "21000";
         var estimatedFeesWei = BigInt(maxFeePerGas) * BigInt(gasLimit);
         var estimatedFeesEth = (Number(estimatedFeesWei) / 1e18).toFixed(6);
-        var cryptoDisplay = ((_sendTransactionRequest_metadata = sendTransactionRequest.metadata) === null || _sendTransactionRequest_metadata === void 0 ? void 0 : _sendTransactionRequest_metadata.estimatedTokens) ? "".concat(ethAmount, " ETH → ").concat(sendTransactionRequest.metadata.estimatedTokens, " ").concat(sendTransactionRequest.metadata.tokenSymbol || "tokens") : "".concat(ethAmount, " ETH");
+        var cryptoDisplay = ((_request_metadata = request.metadata) === null || _request_metadata === void 0 ? void 0 : _request_metadata.estimatedTokens) ? "".concat(ethAmount, " ETH → ").concat(request.metadata.estimatedTokens, " ").concat(request.metadata.tokenSymbol || "tokens") : "".concat(ethAmount, " ETH");
         return /* @__PURE__ */ jsx58(SendEthereumTransactionSuccess, {
             uiConfig: (_options_uiOptions1 = options.uiOptions) === null || _options_uiOptions1 === void 0 ? void 0 : _options_uiOptions1.success,
             transactionSummary: {
-                walletAddress: wallet.public_address,
+                walletAddress: requestWallet.public_address,
                 totalCrypto: cryptoDisplay,
-                totalFiat: ((_sendTransactionRequest_metadata1 = sendTransactionRequest.metadata) === null || _sendTransactionRequest_metadata1 === void 0 ? void 0 : _sendTransactionRequest_metadata1.totalFiat) || "$0.00",
+                totalFiat: ((_request_metadata1 = request.metadata) === null || _request_metadata1 === void 0 ? void 0 : _request_metadata1.totalFiat) || "$0.00",
                 fees: "".concat(estimatedFeesEth, " ETH"),
-                network: sendTransactionRequest.network || "Ethereum Mainnet"
+                network: request.network || "Ethereum Mainnet"
             },
             config: config
         });
@@ -14498,7 +14543,7 @@ var SendTransaction = function SendTransaction(param) {
         console.error("Failed to get confirm transaction:", error2 || "Unknown error");
     };
     return /* @__PURE__ */ jsx59("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs48(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -14506,35 +14551,35 @@ var SendTransaction = function SendTransaction(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx59("div", {
-                    className: "moonkey-flow-close",
+                    className: "moonx-flow-close",
                     children: /* @__PURE__ */ jsx59(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onCancel,
                         children: /* @__PURE__ */ jsx59(X14, {
-                            className: "moonkey-icon--sm"
+                            className: "moonx-icon--sm"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsxs48("div", {
-                    className: "moonkey-flow-header",
+                    className: "moonx-flow-header",
                     style: {
                         marginTop: "1rem"
                     },
                     children: [
                         /* @__PURE__ */ jsx59("div", {
-                            className: "moonkey-flow-logo",
+                            className: "moonx-flow-logo",
                             children: /* @__PURE__ */ jsx59(AppLogo, {
                                 appConfig: appConfig,
-                                className: "moonkey-icon--lg"
+                                className: "moonx-icon--lg"
                             })
                         }),
                         /* @__PURE__ */ jsx59("div", {
-                            className: "moonkey-label",
+                            className: "moonx-label",
                             children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.title) || t("sendTransaction.confirmTransaction")
                         }),
                         /* @__PURE__ */ jsx59("div", {
-                            className: "moonkey-text--secondary",
+                            className: "moonx-text--secondary",
                             children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.description) || t("sendTransaction.wantsPermission", {
                                 companyName: appConfig === null || appConfig === void 0 ? void 0 : appConfig.name
                             })
@@ -14542,7 +14587,7 @@ var SendTransaction = function SendTransaction(param) {
                     ]
                 }),
                 isLoadingError ? /* @__PURE__ */ jsxs48("div", {
-                    className: "moonkey-flex-col-center moonkey-text--center",
+                    className: "moonx-flex-col-center moonx-text--center",
                     style: {
                         marginTop: "2rem",
                         gap: "0.5rem"
@@ -14550,17 +14595,17 @@ var SendTransaction = function SendTransaction(param) {
                     children: [
                         /* @__PURE__ */ jsx59("div", {
                             children: /* @__PURE__ */ jsx59(XCircle4, {
-                                className: "moonkey-icon--lg moonkey-icon--error"
+                                className: "moonx-icon--lg moonx-icon--error"
                             })
                         }),
                         /* @__PURE__ */ jsxs48("div", {
                             children: [
                                 /* @__PURE__ */ jsx59("div", {
-                                    className: "moonkey-label",
+                                    className: "moonx-label",
                                     children: "Error detected"
                                 }),
                                 /* @__PURE__ */ jsx59("div", {
-                                    className: "moonkey-text--secondary",
+                                    className: "moonx-text--secondary",
                                     style: {
                                         marginTop: "1rem"
                                     },
@@ -14570,15 +14615,15 @@ var SendTransaction = function SendTransaction(param) {
                         })
                     ]
                 }) : /* @__PURE__ */ jsx59("div", {
-                    className: "moonkey-flex-col",
+                    className: "moonx-flex-col",
                     style: {
                         marginTop: "1rem"
                     },
                     children: /* @__PURE__ */ jsxs48("div", {
-                        className: "moonkey-detail-card__rows",
+                        className: "moonx-detail-card__rows",
                         children: [
                             /* @__PURE__ */ jsxs48("div", {
-                                className: "moonkey-flex-col",
+                                className: "moonx-flex-col",
                                 style: {
                                     paddingLeft: "0.5rem",
                                     paddingRight: "0.5rem",
@@ -14593,7 +14638,7 @@ var SendTransaction = function SendTransaction(param) {
                                     /* @__PURE__ */ jsx59(DetailRow, {
                                         label: formatAddress(walletAddress, 8, 8),
                                         value: isLoadingConfirm ? /* @__PURE__ */ jsx59("div", {
-                                            className: "moonkey-skeleton",
+                                            className: "moonx-skeleton",
                                             style: {
                                                 height: "1rem",
                                                 width: "4rem"
@@ -14620,7 +14665,7 @@ var SendTransaction = function SendTransaction(param) {
                                 children: /* @__PURE__ */ jsx59(DetailRow, {
                                     label: t("sendTransaction.estimatedFee"),
                                     value: isLoadingConfirm ? /* @__PURE__ */ jsx59("div", {
-                                        className: "moonkey-skeleton",
+                                        className: "moonx-skeleton",
                                         style: {
                                             height: "1rem",
                                             width: "4rem"
@@ -14646,10 +14691,10 @@ var SendTransaction = function SendTransaction(param) {
                                     },
                                     children: [
                                         /* @__PURE__ */ jsx59(ListCheck2, {
-                                            className: "moonkey-icon--sm"
+                                            className: "moonx-icon--sm"
                                         }),
                                         /* @__PURE__ */ jsx59("span", {
-                                            className: "moonkey-label",
+                                            className: "moonx-label",
                                             children: isLoadingConfirm ? t("common.loading") : t("sendTransaction.viewAdvancedDetails")
                                         })
                                     ]
@@ -14659,9 +14704,9 @@ var SendTransaction = function SendTransaction(param) {
                     })
                 }),
                 /* @__PURE__ */ jsx59("div", {
-                    className: "moonkey-flow-footer",
+                    className: "moonx-flow-footer",
                     children: /* @__PURE__ */ jsxs48("div", {
-                        className: "moonkey-flow-footer__actions",
+                        className: "moonx-flow-footer__actions",
                         children: [
                             /* @__PURE__ */ jsx59(Button, {
                                 variant: "outline",
@@ -14689,7 +14734,7 @@ function SendTransactionFailed(param) {
     var t = useTranslation().t;
     var isDark = propsIsDark !== void 0 ? propsIsDark : isDarkMode(config === null || config === void 0 ? void 0 : (_config_config = config.config) === null || _config_config === void 0 ? void 0 : _config_config.theme, config === null || config === void 0 ? void 0 : (_config_config1 = config.config) === null || _config_config1 === void 0 ? void 0 : (_config_config_appearance = _config_config1.appearance) === null || _config_config_appearance === void 0 ? void 0 : _config_config_appearance.displayMode, config === null || config === void 0 ? void 0 : (_config_config2 = config.config) === null || _config_config2 === void 0 ? void 0 : (_config_config_appearance1 = _config_config2.appearance) === null || _config_config_appearance1 === void 0 ? void 0 : _config_config_appearance1.backgroundColor);
     return /* @__PURE__ */ jsx60("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs49(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -14697,42 +14742,42 @@ function SendTransactionFailed(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx60("div", {
-                    className: "moonkey-flow-close",
+                    className: "moonx-flow-close",
                     children: /* @__PURE__ */ jsx60(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onClose,
                         children: /* @__PURE__ */ jsx60(X15, {
-                            className: "moonkey-icon--md"
+                            className: "moonx-icon--md"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx60("div", {
-                    className: "moonkey-flex-center",
+                    className: "moonx-flex-center",
                     children: /* @__PURE__ */ jsx60("div", {
                         style: {
-                            animation: "moonkey-error-bounce 0.8s ease-out 0.1s both"
+                            animation: "moonx-error-bounce 0.8s ease-out 0.1s both"
                         },
                         children: /* @__PURE__ */ jsx60(XCircle5, {
-                            className: "moonkey-icon--2xl moonkey-icon--error"
+                            className: "moonx-icon--2xl moonx-icon--error"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx60("div", {
-                    className: "moonkey-text--heading",
+                    className: "moonx-text--heading",
                     style: {
                         paddingTop: "2rem"
                     },
                     children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.title) || t("sendTransaction.failure.transactionFailed")
                 }),
                 /* @__PURE__ */ jsx60("div", {
-                    className: "moonkey-text--center",
+                    className: "moonx-text--center",
                     style: {
                         paddingLeft: "0.5rem",
                         paddingRight: "0.5rem"
                     },
                     children: /* @__PURE__ */ jsx60("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.description) || t("sendTransaction.failure.transactionFailedDescription")
                     })
                 }),
@@ -14743,14 +14788,14 @@ function SendTransactionFailed(param) {
                         marginTop: "1.5rem"
                     },
                     children: /* @__PURE__ */ jsx60("div", {
-                        className: "moonkey-text--sm moonkey-text--semibold",
+                        className: "moonx-text--sm moonx-text--semibold",
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.errorTitle) || t("sendTransaction.failure.transactionFailedErrorDetails")
                     })
                 }),
                 /* @__PURE__ */ jsx60("div", {
-                    className: "moonkey-error-scroll",
+                    className: "moonx-error-scroll",
                     children: /* @__PURE__ */ jsx60("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         style: {
                             padding: "0 0.5rem"
                         },
@@ -14758,9 +14803,9 @@ function SendTransactionFailed(param) {
                     })
                 }),
                 /* @__PURE__ */ jsx60("div", {
-                    className: "moonkey-flow-footer",
+                    className: "moonx-flow-footer",
                     children: /* @__PURE__ */ jsx60("div", {
-                        className: "moonkey-flow-footer__actions",
+                        className: "moonx-flow-footer__actions",
                         children: /* @__PURE__ */ jsx60(Button, {
                             onClick: onClose,
                             children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.closeButtonText) || t("sendTransaction.failure.transactionFailedRetryTransaction")
@@ -14780,7 +14825,7 @@ function SendTransactionSuccess(param) {
     var t = useTranslation().t;
     var isDark = propsIsDark !== void 0 ? propsIsDark : isDarkMode(config === null || config === void 0 ? void 0 : (_config_config = config.config) === null || _config_config === void 0 ? void 0 : _config_config.theme, config === null || config === void 0 ? void 0 : (_config_config1 = config.config) === null || _config_config1 === void 0 ? void 0 : (_config_config_appearance = _config_config1.appearance) === null || _config_config_appearance === void 0 ? void 0 : _config_config_appearance.displayMode, config === null || config === void 0 ? void 0 : (_config_config2 = config.config) === null || _config_config2 === void 0 ? void 0 : (_config_config_appearance1 = _config_config2.appearance) === null || _config_config_appearance1 === void 0 ? void 0 : _config_config_appearance1.backgroundColor);
     return /* @__PURE__ */ jsx61("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs50(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -14788,38 +14833,38 @@ function SendTransactionSuccess(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx61("div", {
-                    className: "moonkey-flex-center",
+                    className: "moonx-flex-center",
                     children: /* @__PURE__ */ jsx61("div", {
                         style: {
-                            animation: "moonkey-success-bounce 0.8s ease-out 0.1s both"
+                            animation: "moonx-success-bounce 0.8s ease-out 0.1s both"
                         },
                         children: /* @__PURE__ */ jsx61(CheckCircle26, {
-                            className: "moonkey-icon--2xl moonkey-icon--success"
+                            className: "moonx-icon--2xl moonx-icon--success"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx61("div", {
-                    className: "moonkey-text--heading",
+                    className: "moonx-text--heading",
                     style: {
                         paddingTop: "2rem"
                     },
                     children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.title) || t("sendTransaction.success.transactionComplete")
                 }),
                 /* @__PURE__ */ jsx61("div", {
-                    className: "moonkey-text--center",
+                    className: "moonx-text--center",
                     style: {
                         paddingLeft: "0.5rem",
                         paddingRight: "0.5rem"
                     },
                     children: /* @__PURE__ */ jsx61("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.description) || t("sendTransaction.success.transactionCompleteDescription")
                     })
                 }),
                 /* @__PURE__ */ jsx61("div", {
-                    className: "moonkey-detail-card",
+                    className: "moonx-detail-card",
                     children: /* @__PURE__ */ jsxs50("div", {
-                        className: "moonkey-detail-card__rows",
+                        className: "moonx-detail-card__rows",
                         children: [
                             /* @__PURE__ */ jsx61(DetailRow, {
                                 label: t("sendTransaction.success.transactionCompleteNetwork"),
@@ -14831,7 +14876,7 @@ function SendTransactionSuccess(param) {
                             /* @__PURE__ */ jsx61(DetailRow, {
                                 label: t("sendTransaction.success.transactionCompleteTotal"),
                                 value: /* @__PURE__ */ jsxs50("div", {
-                                    className: "moonkey-flex-col",
+                                    className: "moonx-flex-col",
                                     style: {
                                         textAlign: "right"
                                     },
@@ -14840,7 +14885,7 @@ function SendTransactionSuccess(param) {
                                             children: transactionSummary.totalFiat
                                         }),
                                         /* @__PURE__ */ jsx61("span", {
-                                            className: "moonkey-text--secondary",
+                                            className: "moonx-text--secondary",
                                             children: transactionSummary.totalCrypto
                                         })
                                     ]
@@ -14966,7 +15011,7 @@ function SimulateTransactionDetails(param) {
     if (loading) {
         var _config_config5, _config_config6;
         return /* @__PURE__ */ jsx62("div", {
-            className: "moonkey-flow-overlay",
+            className: "moonx-flow-overlay",
             children: /* @__PURE__ */ jsx62(RootCard, {
                 centerContent: false,
                 isDark: isDark,
@@ -14978,7 +15023,7 @@ function SimulateTransactionDetails(param) {
                         textAlign: "center"
                     },
                     children: /* @__PURE__ */ jsx62("div", {
-                        className: "moonkey-text--secondary",
+                        className: "moonx-text--secondary",
                         children: "Loading transaction details..."
                     })
                 })
@@ -14988,7 +15033,7 @@ function SimulateTransactionDetails(param) {
     if (error) {
         var _config_config7, _config_config8;
         return /* @__PURE__ */ jsx62("div", {
-            className: "moonkey-flow-overlay",
+            className: "moonx-flow-overlay",
             children: /* @__PURE__ */ jsxs51(RootCard, {
                 centerContent: false,
                 isDark: isDark,
@@ -14996,18 +15041,18 @@ function SimulateTransactionDetails(param) {
                 appearance: config === null || config === void 0 ? void 0 : (_config_config8 = config.config) === null || _config_config8 === void 0 ? void 0 : _config_config8.appearance,
                 children: [
                     /* @__PURE__ */ jsx62("div", {
-                        className: "moonkey-flow-close",
+                        className: "moonx-flow-close",
                         children: /* @__PURE__ */ jsx62(Button, {
                             variant: "ghost",
                             size: "icon",
                             onClick: onClose,
                             children: /* @__PURE__ */ jsx62(X16, {
-                                className: "moonkey-icon--md"
+                                className: "moonx-icon--md"
                             })
                         })
                     }),
                     /* @__PURE__ */ jsxs51("div", {
-                        className: "moonkey-flex-col-center moonkey-text--center",
+                        className: "moonx-flex-col-center moonx-text--center",
                         style: {
                             padding: "2rem",
                             gap: "1rem",
@@ -15019,7 +15064,7 @@ function SimulateTransactionDetails(param) {
                                     width: "3rem",
                                     height: "3rem",
                                     borderRadius: "50%",
-                                    backgroundColor: "var(--moonkey-color-error)",
+                                    backgroundColor: "var(--moonx-color-error)",
                                     opacity: 0.1,
                                     display: "flex",
                                     alignItems: "center",
@@ -15028,7 +15073,7 @@ function SimulateTransactionDetails(param) {
                                 },
                                 children: /* @__PURE__ */ jsx62("div", {
                                     style: {
-                                        color: "var(--moonkey-color-error)",
+                                        color: "var(--moonx-color-error)",
                                         fontSize: "1.5rem",
                                         fontWeight: "bold"
                                     },
@@ -15042,7 +15087,7 @@ function SimulateTransactionDetails(param) {
                                 children: "Unable to Load Transaction"
                             }),
                             /* @__PURE__ */ jsx62("div", {
-                                className: "moonkey-text--secondary",
+                                className: "moonx-text--secondary",
                                 style: {
                                     marginBottom: "1rem",
                                     maxWidth: "300px"
@@ -15052,9 +15097,9 @@ function SimulateTransactionDetails(param) {
                         ]
                     }),
                     /* @__PURE__ */ jsx62("div", {
-                        className: "moonkey-flow-footer",
+                        className: "moonx-flow-footer",
                         children: /* @__PURE__ */ jsx62("div", {
-                            className: "moonkey-flow-footer__actions",
+                            className: "moonx-flow-footer__actions",
                             children: /* @__PURE__ */ jsx62(Button, {
                                 onClick: onClose,
                                 variant: "default",
@@ -15068,7 +15113,7 @@ function SimulateTransactionDetails(param) {
         });
     }
     return /* @__PURE__ */ jsx62("div", {
-        className: "moonkey-flow-overlay",
+        className: "moonx-flow-overlay",
         children: /* @__PURE__ */ jsxs51(RootCard, {
             centerContent: false,
             isDark: isDark,
@@ -15076,28 +15121,28 @@ function SimulateTransactionDetails(param) {
             appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
             children: [
                 /* @__PURE__ */ jsx62("div", {
-                    className: "moonkey-flow-close",
+                    className: "moonx-flow-close",
                     children: /* @__PURE__ */ jsx62(Button, {
                         variant: "ghost",
                         size: "icon",
                         onClick: onClose,
                         children: /* @__PURE__ */ jsx62(X16, {
-                            className: "moonkey-icon--md"
+                            className: "moonx-icon--md"
                         })
                     })
                 }),
                 /* @__PURE__ */ jsx62("div", {
-                    className: "moonkey-flow-header",
+                    className: "moonx-flow-header",
                     style: {
                         marginTop: "1rem"
                     },
                     children: /* @__PURE__ */ jsx62("div", {
-                        className: "moonkey-label",
+                        className: "moonx-label",
                         children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.title) || t("sendTransaction.advancedTransactionDetails")
                     })
                 }),
                 /* @__PURE__ */ jsx62("div", {
-                    className: "moonkey-scrollable-list",
+                    className: "moonx-scrollable-list",
                     style: {
                         height: "300px",
                         margin: "1rem 0.75rem 0"
@@ -15108,14 +15153,14 @@ function SimulateTransactionDetails(param) {
                         },
                         children: instructions.map(function(instruction) {
                             return /* @__PURE__ */ jsxs51("div", {
-                                className: "moonkey-flex-col",
+                                className: "moonx-flex-col",
                                 style: {
                                     justifyContent: "space-between",
                                     marginBottom: "1rem"
                                 },
                                 children: [
                                     instruction.title && /* @__PURE__ */ jsx62("h3", {
-                                        className: "moonkey-label",
+                                        className: "moonx-label",
                                         style: {
                                             marginBottom: "0.5rem"
                                         },
@@ -15136,9 +15181,9 @@ function SimulateTransactionDetails(param) {
                     })
                 }),
                 /* @__PURE__ */ jsx62("div", {
-                    className: "moonkey-flow-footer",
+                    className: "moonx-flow-footer",
                     children: /* @__PURE__ */ jsx62("div", {
-                        className: "moonkey-flow-footer__actions",
+                        className: "moonx-flow-footer__actions",
                         children: /* @__PURE__ */ jsx62(Button, {
                             onClick: onClose,
                             children: (uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.closeButtonText) || t("common.close")
@@ -15541,32 +15586,32 @@ var Sign7702Authorization = function Sign7702Authorization(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsx64("div", {
-                className: "moonkey-flow-close",
+                className: "moonx-flow-close",
                 children: /* @__PURE__ */ jsx64(Button, {
                     variant: "ghost",
                     size: "icon",
                     onClick: onCancel,
                     children: /* @__PURE__ */ jsx64(X17, {
-                        className: "moonkey-icon--sm"
+                        className: "moonx-icon--sm"
                     })
                 })
             }),
             /* @__PURE__ */ jsxs52("div", {
-                className: "moonkey-flow-header",
+                className: "moonx-flow-header",
                 children: [
                     /* @__PURE__ */ jsx64("div", {
-                        className: "moonkey-flow-logo",
+                        className: "moonx-flow-logo",
                         children: /* @__PURE__ */ jsx64(AppLogo, {
                             appConfig: appConfig,
-                            className: "moonkey-icon--lg"
+                            className: "moonx-icon--lg"
                         })
                     }),
                     /* @__PURE__ */ jsx64("div", {
-                        className: "moonkey-text--heading",
+                        className: "moonx-text--heading",
                         children: (options === null || options === void 0 ? void 0 : (_options_uiOptions = options.uiOptions) === null || _options_uiOptions === void 0 ? void 0 : _options_uiOptions.title) || t("sign7702Authorization.title")
                     }),
                     /* @__PURE__ */ jsx64("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: (options === null || options === void 0 ? void 0 : (_options_uiOptions1 = options.uiOptions) === null || _options_uiOptions1 === void 0 ? void 0 : _options_uiOptions1.description) || t("sign7702Authorization.description", {
                             companyName: appConfig === null || appConfig === void 0 ? void 0 : appConfig.name
                         })
@@ -15574,14 +15619,14 @@ var Sign7702Authorization = function Sign7702Authorization(param) {
                 ]
             }),
             /* @__PURE__ */ jsxs52("div", {
-                className: "moonkey-data-scroll",
+                className: "moonx-data-scroll",
                 children: [
                     /* @__PURE__ */ jsx64("div", {
-                        className: "moonkey-sign-section",
+                        className: "moonx-sign-section",
                         children: /* @__PURE__ */ jsxs52("div", {
                             children: [
                                 /* @__PURE__ */ jsxs52("div", {
-                                    className: "moonkey-sign-row",
+                                    className: "moonx-sign-row",
                                     style: {
                                         marginBottom: "0.5rem"
                                     },
@@ -15602,14 +15647,14 @@ var Sign7702Authorization = function Sign7702Authorization(param) {
                                             children: copySuccess ? /* @__PURE__ */ jsxs52(Fragment10, {
                                                 children: [
                                                     /* @__PURE__ */ jsx64(Check2, {
-                                                        className: "moonkey-icon--xs moonkey-icon--mr-xs"
+                                                        className: "moonx-icon--xs moonx-icon--mr-xs"
                                                     }),
                                                     t("common.copied")
                                                 ]
                                             }) : /* @__PURE__ */ jsxs52(Fragment10, {
                                                 children: [
                                                     /* @__PURE__ */ jsx64(Copy2, {
-                                                        className: "moonkey-icon--xs moonkey-icon--mr-xs"
+                                                        className: "moonx-icon--xs moonx-icon--mr-xs"
                                                     }),
                                                     t("common.copy")
                                                 ]
@@ -15619,7 +15664,7 @@ var Sign7702Authorization = function Sign7702Authorization(param) {
                                 }),
                                 /* @__PURE__ */ jsx64("div", {
                                     ref: contentRef,
-                                    className: "moonkey-data-preview",
+                                    className: "moonx-data-preview",
                                     style: {
                                         height: "84px",
                                         overflow: "hidden"
@@ -15630,7 +15675,7 @@ var Sign7702Authorization = function Sign7702Authorization(param) {
                         })
                     }),
                     /* @__PURE__ */ jsx64("div", {
-                        className: "moonkey-text--secondary moonkey-text--center",
+                        className: "moonx-text--secondary moonx-text--center",
                         style: {
                             marginTop: "150px",
                             paddingBottom: "0.5rem"
@@ -15640,9 +15685,9 @@ var Sign7702Authorization = function Sign7702Authorization(param) {
                 ]
             }),
             /* @__PURE__ */ jsx64("div", {
-                className: "moonkey-flow-footer",
+                className: "moonx-flow-footer",
                 children: /* @__PURE__ */ jsxs52("div", {
-                    className: "moonkey-flow-footer__actions",
+                    className: "moonx-flow-footer__actions",
                     children: [
                         /* @__PURE__ */ jsx64(Button, {
                             variant: "outline",
@@ -15658,7 +15703,7 @@ var Sign7702Authorization = function Sign7702Authorization(param) {
                                 signResult === "success" && /* @__PURE__ */ jsxs52(Fragment10, {
                                     children: [
                                         /* @__PURE__ */ jsx64(Check2, {
-                                            className: "moonkey-icon--sm moonkey-icon--mr-xs"
+                                            className: "moonx-icon--sm moonx-icon--mr-xs"
                                         }),
                                         /* @__PURE__ */ jsx64("span", {
                                             children: t("common.success")
@@ -15668,7 +15713,7 @@ var Sign7702Authorization = function Sign7702Authorization(param) {
                                 signResult === "error" && /* @__PURE__ */ jsxs52(Fragment10, {
                                     children: [
                                         /* @__PURE__ */ jsx64(XCircle6, {
-                                            className: "moonkey-icon--sm moonkey-icon--mr-xs"
+                                            className: "moonx-icon--sm moonx-icon--mr-xs"
                                         }),
                                         /* @__PURE__ */ jsx64("span", {
                                             children: t("common.failed")
@@ -15901,28 +15946,28 @@ var SignMessage = function SignMessage(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsx65("div", {
-                className: "moonkey-flow-close",
+                className: "moonx-flow-close",
                 children: /* @__PURE__ */ jsx65(Button, {
                     variant: "ghost",
                     size: "icon",
                     onClick: onCancel,
                     children: /* @__PURE__ */ jsx65(X18, {
-                        className: "moonkey-icon--sm"
+                        className: "moonx-icon--sm"
                     })
                 })
             }),
             /* @__PURE__ */ jsxs53("div", {
-                className: "moonkey-flow-header",
+                className: "moonx-flow-header",
                 children: [
                     /* @__PURE__ */ jsx65("div", {
-                        className: "moonkey-flow-logo",
+                        className: "moonx-flow-logo",
                         children: /* @__PURE__ */ jsx65(AppLogo, {
                             appConfig: appConfig,
-                            className: "moonkey-icon--lg"
+                            className: "moonx-icon--lg"
                         })
                     }),
                     /* @__PURE__ */ jsx65("p", {
-                        className: "moonkey-text--heading",
+                        className: "moonx-text--heading",
                         children: (uiOptions === null || uiOptions === void 0 ? void 0 : uiOptions.title) || t("signMessage.title")
                     }),
                     /* @__PURE__ */ jsx65(Label, {
@@ -15934,7 +15979,7 @@ var SignMessage = function SignMessage(param) {
                 ]
             }),
             /* @__PURE__ */ jsx65("div", {
-                className: "moonkey-flex-col",
+                className: "moonx-flex-col",
                 style: {
                     position: "relative"
                 },
@@ -15944,7 +15989,7 @@ var SignMessage = function SignMessage(param) {
                     },
                     children: [
                         /* @__PURE__ */ jsxs53("div", {
-                            className: "moonkey-sign-row",
+                            className: "moonx-sign-row",
                             style: {
                                 marginBottom: "0.25rem"
                             },
@@ -15973,14 +16018,14 @@ var SignMessage = function SignMessage(param) {
                                     children: copySuccess ? /* @__PURE__ */ jsxs53(Fragment11, {
                                         children: [
                                             /* @__PURE__ */ jsx65(Check3, {
-                                                className: "moonkey-icon--xs moonkey-icon--mr-xs"
+                                                className: "moonx-icon--xs moonx-icon--mr-xs"
                                             }),
                                             t("common.copied")
                                         ]
                                     }) : /* @__PURE__ */ jsxs53(Fragment11, {
                                         children: [
                                             /* @__PURE__ */ jsx65(Copy3, {
-                                                className: "moonkey-icon--xs moonkey-icon--mr-xs"
+                                                className: "moonx-icon--xs moonx-icon--mr-xs"
                                             }),
                                             t("common.copy")
                                         ]
@@ -15990,7 +16035,7 @@ var SignMessage = function SignMessage(param) {
                         }),
                         /* @__PURE__ */ jsx65("div", {
                             ref: contentRef,
-                            className: "moonkey-box moonkey-box--scrollable",
+                            className: "moonx-box moonx-box--scrollable",
                             style: {
                                 height: "210px"
                             },
@@ -16000,9 +16045,9 @@ var SignMessage = function SignMessage(param) {
                 })
             }),
             /* @__PURE__ */ jsx65("div", {
-                className: "moonkey-flow-footer",
+                className: "moonx-flow-footer",
                 children: /* @__PURE__ */ jsx65("div", {
-                    className: "moonkey-flow-footer__actions",
+                    className: "moonx-flow-footer__actions",
                     children: /* @__PURE__ */ jsxs53(Button, {
                         state: isSigning ? "loading" : signResult === "success" ? "success" : signResult === "error" ? "error" : void 0,
                         disabled: isSigning || signResult === "success",
@@ -16016,7 +16061,7 @@ var SignMessage = function SignMessage(param) {
                                 },
                                 children: [
                                     /* @__PURE__ */ jsx65(Check3, {
-                                        className: "moonkey-icon--sm moonkey-icon--mr-sm"
+                                        className: "moonx-icon--sm moonx-icon--mr-sm"
                                     }),
                                     t("common.signed")
                                 ]
@@ -16029,7 +16074,7 @@ var SignMessage = function SignMessage(param) {
                                 },
                                 children: [
                                     /* @__PURE__ */ jsx65(XCircle7, {
-                                        className: "moonkey-icon--sm moonkey-icon--mr-sm"
+                                        className: "moonx-icon--sm moonx-icon--mr-sm"
                                     }),
                                     t("common.failed")
                                 ]
@@ -16223,32 +16268,32 @@ var SignTransaction = function SignTransaction(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsx66("div", {
-                className: "moonkey-flow-close",
+                className: "moonx-flow-close",
                 children: /* @__PURE__ */ jsx66(Button, {
                     variant: "ghost",
                     size: "icon",
                     onClick: onCancel,
                     children: /* @__PURE__ */ jsx66(X19, {
-                        className: "moonkey-icon--sm"
+                        className: "moonx-icon--sm"
                     })
                 })
             }),
             /* @__PURE__ */ jsxs54("div", {
-                className: "moonkey-flow-header",
+                className: "moonx-flow-header",
                 children: [
                     /* @__PURE__ */ jsx66("div", {
-                        className: "moonkey-flow-logo",
+                        className: "moonx-flow-logo",
                         children: /* @__PURE__ */ jsx66(AppLogo, {
                             appConfig: appConfig,
-                            className: "moonkey-icon--lg"
+                            className: "moonx-icon--lg"
                         })
                     }),
                     /* @__PURE__ */ jsx66("div", {
-                        className: "moonkey-text--heading",
+                        className: "moonx-text--heading",
                         children: (options === null || options === void 0 ? void 0 : (_options_uiOptions = options.uiOptions) === null || _options_uiOptions === void 0 ? void 0 : _options_uiOptions.title) || t("signTransaction.title")
                     }),
                     /* @__PURE__ */ jsx66("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: (options === null || options === void 0 ? void 0 : (_options_uiOptions1 = options.uiOptions) === null || _options_uiOptions1 === void 0 ? void 0 : _options_uiOptions1.description) || t("signTransaction.description", {
                             companyName: appConfig === null || appConfig === void 0 ? void 0 : appConfig.name
                         })
@@ -16256,24 +16301,24 @@ var SignTransaction = function SignTransaction(param) {
                 ]
             }),
             /* @__PURE__ */ jsxs54("div", {
-                className: "moonkey-data-scroll",
+                className: "moonx-data-scroll",
                 children: [
                     /* @__PURE__ */ jsx66("div", {
-                        className: "moonkey-sign-section",
+                        className: "moonx-sign-section",
                         children: /* @__PURE__ */ jsxs54("div", {
                             children: [
                                 /* @__PURE__ */ jsxs54("div", {
-                                    className: "moonkey-sign-row",
+                                    className: "moonx-sign-row",
                                     children: [
                                         /* @__PURE__ */ jsxs54("div", {
-                                            className: "moonkey-expand-toggle",
+                                            className: "moonx-expand-toggle",
                                             onClick: handleToggle,
                                             children: [
                                                 /* @__PURE__ */ jsx66(Label, {
                                                     children: t("signTransaction.transaction")
                                                 }),
                                                 /* @__PURE__ */ jsx66(ChevronRight, {
-                                                    className: "moonkey-icon--sm",
+                                                    className: "moonx-icon--sm",
                                                     style: {
                                                         marginLeft: "0.5rem",
                                                         transition: "transform 0.2s ease-in-out",
@@ -16291,19 +16336,19 @@ var SignTransaction = function SignTransaction(param) {
                                                 paddingLeft: "0.5rem",
                                                 paddingRight: "0.5rem",
                                                 fontSize: "0.75rem",
-                                                color: copySuccess ? "var(--moonkey-color-success)" : "var(--moonkey-color-foreground-3)"
+                                                color: copySuccess ? "var(--moonx-color-success)" : "var(--moonx-color-foreground-3)"
                                             },
                                             children: copySuccess ? /* @__PURE__ */ jsxs54(Fragment12, {
                                                 children: [
                                                     /* @__PURE__ */ jsx66(Copy4, {
-                                                        className: "moonkey-icon--xs moonkey-icon--mr-xs"
+                                                        className: "moonx-icon--xs moonx-icon--mr-xs"
                                                     }),
                                                     t("common.copied")
                                                 ]
                                             }) : /* @__PURE__ */ jsxs54(Fragment12, {
                                                 children: [
                                                     /* @__PURE__ */ jsx66(Check4, {
-                                                        className: "moonkey-icon--xs moonkey-icon--mr-xs"
+                                                        className: "moonx-icon--xs moonx-icon--mr-xs"
                                                     }),
                                                     t("common.copy")
                                                 ]
@@ -16313,7 +16358,7 @@ var SignTransaction = function SignTransaction(param) {
                                 }),
                                 /* @__PURE__ */ jsx66("div", {
                                     ref: contentRef,
-                                    className: "moonkey-data-preview",
+                                    className: "moonx-data-preview",
                                     style: {
                                         height: isExpanded ? "auto" : "84px",
                                         overflow: isExpanded ? "visible" : "hidden"
@@ -16324,7 +16369,7 @@ var SignTransaction = function SignTransaction(param) {
                         })
                     }),
                     /* @__PURE__ */ jsx66("div", {
-                        className: "moonkey-text--secondary moonkey-text--center",
+                        className: "moonx-text--secondary moonx-text--center",
                         style: {
                             marginTop: isExpanded ? "1rem" : "150px",
                             paddingTop: isExpanded ? "1rem" : 0,
@@ -16335,9 +16380,9 @@ var SignTransaction = function SignTransaction(param) {
                 ]
             }),
             /* @__PURE__ */ jsx66("div", {
-                className: "moonkey-flow-footer",
+                className: "moonx-flow-footer",
                 children: /* @__PURE__ */ jsxs54("div", {
-                    className: "moonkey-flow-footer__actions",
+                    className: "moonx-flow-footer__actions",
                     children: [
                         /* @__PURE__ */ jsx66(Button, {
                             variant: "outline",
@@ -16353,7 +16398,7 @@ var SignTransaction = function SignTransaction(param) {
                                 signResult === "success" && /* @__PURE__ */ jsxs54(Fragment12, {
                                     children: [
                                         /* @__PURE__ */ jsx66(Check4, {
-                                            className: "moonkey-icon--sm moonkey-icon--mr-xs"
+                                            className: "moonx-icon--sm moonx-icon--mr-xs"
                                         }),
                                         /* @__PURE__ */ jsx66("span", {
                                             children: t("common.success")
@@ -16363,7 +16408,7 @@ var SignTransaction = function SignTransaction(param) {
                                 signResult === "error" && /* @__PURE__ */ jsxs54(Fragment12, {
                                     children: [
                                         /* @__PURE__ */ jsx66(XCircle8, {
-                                            className: "moonkey-icon--sm moonkey-icon--mr-xs"
+                                            className: "moonx-icon--sm moonx-icon--mr-xs"
                                         }),
                                         /* @__PURE__ */ jsx66("span", {
                                             children: t("common.failed")
@@ -16569,32 +16614,32 @@ var SignTypedData = function SignTypedData(param) {
         appearance: config === null || config === void 0 ? void 0 : (_config_config4 = config.config) === null || _config_config4 === void 0 ? void 0 : _config_config4.appearance,
         children: [
             /* @__PURE__ */ jsx67("div", {
-                className: "moonkey-flow-close",
+                className: "moonx-flow-close",
                 children: /* @__PURE__ */ jsx67(Button, {
                     variant: "ghost",
                     size: "icon",
                     onClick: onCancel,
                     children: /* @__PURE__ */ jsx67(X20, {
-                        className: "moonkey-icon--sm"
+                        className: "moonx-icon--sm"
                     })
                 })
             }),
             /* @__PURE__ */ jsxs55("div", {
-                className: "moonkey-flow-header",
+                className: "moonx-flow-header",
                 children: [
                     /* @__PURE__ */ jsx67("div", {
-                        className: "moonkey-flow-logo",
+                        className: "moonx-flow-logo",
                         children: /* @__PURE__ */ jsx67(AppLogo, {
                             appConfig: appConfig,
-                            className: "moonkey-icon--lg"
+                            className: "moonx-icon--lg"
                         })
                     }),
                     /* @__PURE__ */ jsx67("div", {
-                        className: "moonkey-text--heading",
+                        className: "moonx-text--heading",
                         children: (options === null || options === void 0 ? void 0 : (_options_uiOptions = options.uiOptions) === null || _options_uiOptions === void 0 ? void 0 : _options_uiOptions.title) || t("signTypedData.title")
                     }),
                     /* @__PURE__ */ jsx67("div", {
-                        className: "moonkey-text--secondary moonkey-text--semibold",
+                        className: "moonx-text--secondary moonx-text--semibold",
                         children: (options === null || options === void 0 ? void 0 : (_options_uiOptions1 = options.uiOptions) === null || _options_uiOptions1 === void 0 ? void 0 : _options_uiOptions1.description) || t("signTypedData.description", {
                             companyName: appConfig === null || appConfig === void 0 ? void 0 : appConfig.name
                         })
@@ -16602,24 +16647,24 @@ var SignTypedData = function SignTypedData(param) {
                 ]
             }),
             /* @__PURE__ */ jsxs55("div", {
-                className: "moonkey-data-scroll",
+                className: "moonx-data-scroll",
                 children: [
                     /* @__PURE__ */ jsx67("div", {
-                        className: "moonkey-sign-section",
+                        className: "moonx-sign-section",
                         children: /* @__PURE__ */ jsxs55("div", {
                             children: [
                                 /* @__PURE__ */ jsxs55("div", {
-                                    className: "moonkey-sign-row",
+                                    className: "moonx-sign-row",
                                     children: [
                                         /* @__PURE__ */ jsxs55("div", {
-                                            className: "moonkey-expand-toggle",
+                                            className: "moonx-expand-toggle",
                                             onClick: handleToggle,
                                             children: [
                                                 /* @__PURE__ */ jsx67(Label, {
                                                     children: t("signTransaction.transaction")
                                                 }),
                                                 /* @__PURE__ */ jsx67(ChevronRight2, {
-                                                    className: "moonkey-icon--sm",
+                                                    className: "moonx-icon--sm",
                                                     style: {
                                                         marginLeft: "0.5rem",
                                                         transition: "transform 0.2s ease-in-out",
@@ -16637,19 +16682,19 @@ var SignTypedData = function SignTypedData(param) {
                                                 paddingLeft: "0.5rem",
                                                 paddingRight: "0.5rem",
                                                 fontSize: "0.75rem",
-                                                color: copySuccess ? "var(--moonkey-color-success)" : "var(--moonkey-color-foreground-3)"
+                                                color: copySuccess ? "var(--moonx-color-success)" : "var(--moonx-color-foreground-3)"
                                             },
                                             children: copySuccess ? /* @__PURE__ */ jsxs55(Fragment13, {
                                                 children: [
                                                     /* @__PURE__ */ jsx67(Check5, {
-                                                        className: "moonkey-icon--xs moonkey-icon--mr-xs"
+                                                        className: "moonx-icon--xs moonx-icon--mr-xs"
                                                     }),
                                                     t("common.copied")
                                                 ]
                                             }) : /* @__PURE__ */ jsxs55(Fragment13, {
                                                 children: [
                                                     /* @__PURE__ */ jsx67(Copy5, {
-                                                        className: "moonkey-icon--xs moonkey-icon--mr-xs"
+                                                        className: "moonx-icon--xs moonx-icon--mr-xs"
                                                     }),
                                                     t("common.copy")
                                                 ]
@@ -16659,7 +16704,7 @@ var SignTypedData = function SignTypedData(param) {
                                 }),
                                 /* @__PURE__ */ jsx67("div", {
                                     ref: contentRef,
-                                    className: "moonkey-data-preview",
+                                    className: "moonx-data-preview",
                                     style: {
                                         height: isExpanded ? "auto" : "84px",
                                         overflow: isExpanded ? "visible" : "hidden"
@@ -16670,7 +16715,7 @@ var SignTypedData = function SignTypedData(param) {
                         })
                     }),
                     /* @__PURE__ */ jsx67("div", {
-                        className: "moonkey-text--secondary moonkey-text--center",
+                        className: "moonx-text--secondary moonx-text--center",
                         style: {
                             marginTop: isExpanded ? "1rem" : "150px",
                             paddingTop: isExpanded ? "1rem" : 0,
@@ -16681,9 +16726,9 @@ var SignTypedData = function SignTypedData(param) {
                 ]
             }),
             /* @__PURE__ */ jsx67("div", {
-                className: "moonkey-flow-footer",
+                className: "moonx-flow-footer",
                 children: /* @__PURE__ */ jsxs55("div", {
-                    className: "moonkey-flow-footer__actions",
+                    className: "moonx-flow-footer__actions",
                     children: [
                         /* @__PURE__ */ jsx67(Button, {
                             variant: "outline",
@@ -16699,7 +16744,7 @@ var SignTypedData = function SignTypedData(param) {
                                 signResult === "success" && /* @__PURE__ */ jsxs55(Fragment13, {
                                     children: [
                                         /* @__PURE__ */ jsx67(Check5, {
-                                            className: "moonkey-icon--sm moonkey-icon--mr-xs"
+                                            className: "moonx-icon--sm moonx-icon--mr-xs"
                                         }),
                                         /* @__PURE__ */ jsx67("span", {
                                             children: t("common.success")
@@ -16709,7 +16754,7 @@ var SignTypedData = function SignTypedData(param) {
                                 signResult === "error" && /* @__PURE__ */ jsxs55(Fragment13, {
                                     children: [
                                         /* @__PURE__ */ jsx67(XCircle9, {
-                                            className: "moonkey-icon--sm moonkey-icon--mr-xs"
+                                            className: "moonx-icon--sm moonx-icon--mr-xs"
                                         }),
                                         /* @__PURE__ */ jsx67("span", {
                                             children: t("common.failed")
@@ -16830,7 +16875,7 @@ var SolanaWalletSelector = function SolanaWalletSelector(param) {
             width: "1.5rem",
             height: "1.5rem",
             border: "2px solid transparent",
-            borderBottomColor: "var(--moonkey-color-foreground)",
+            borderBottomColor: "var(--moonx-color-foreground)",
             borderRadius: "50%",
             animation: "spin 1s linear infinite"
         };
@@ -16859,10 +16904,10 @@ var SolanaWalletSelector = function SolanaWalletSelector(param) {
     var searchInputStyles = {
         width: "100%",
         padding: "0.75rem 1rem 0.75rem 2.5rem",
-        borderRadius: "var(--moonkey-border-radius-lg)",
-        border: "1px solid var(--moonkey-color-border)",
-        backgroundColor: "var(--moonkey-color-background)",
-        color: "var(--moonkey-color-foreground)",
+        borderRadius: "var(--moonx-border-radius-lg)",
+        border: "1px solid var(--moonx-color-border)",
+        backgroundColor: "var(--moonx-color-background)",
+        color: "var(--moonx-color-foreground)",
         fontSize: "0.875rem",
         outline: "none",
         transition: "border-color 0.2s ease, box-shadow 0.2s ease"
@@ -16873,12 +16918,12 @@ var SolanaWalletSelector = function SolanaWalletSelector(param) {
         top: "0.875rem",
         width: "1rem",
         height: "1rem",
-        color: "var(--moonkey-color-foreground-3)"
+        color: "var(--moonx-color-foreground-3)"
     };
     var emptyStateStyles = {
         textAlign: "center",
         padding: "2rem 0",
-        color: "var(--moonkey-color-foreground-3)",
+        color: "var(--moonx-color-foreground-3)",
         fontSize: "0.875rem"
     };
     return /* @__PURE__ */ jsxs56("div", {
@@ -16886,7 +16931,7 @@ var SolanaWalletSelector = function SolanaWalletSelector(param) {
         children: [
             /* @__PURE__ */ jsx68("style", {
                 dangerouslySetInnerHTML: {
-                    __html: "\n          .solana-search-input:focus {\n            border-color: var(--moonkey-color-accent);\n            box-shadow: 0 0 0 2px var(--moonkey-color-accent);\n          }\n          .solana-search-input::placeholder {\n            color: var(--moonkey-color-foreground-3);\n            opacity: 0.7;\n          }\n        "
+                    __html: "\n          .solana-search-input:focus {\n            border-color: var(--moonx-color-accent);\n            box-shadow: 0 0 0 2px var(--moonx-color-accent);\n          }\n          .solana-search-input::placeholder {\n            color: var(--moonx-color-foreground-3);\n            opacity: 0.7;\n          }\n        "
                 }
             }),
             /* @__PURE__ */ jsxs56("div", {
@@ -16934,17 +16979,17 @@ var SolanaWalletSelector = function SolanaWalletSelector(param) {
                 });
                 var getInstalledWalletCardStyles = function getInstalledWalletCardStyles(walletType) {
                     return {
-                        borderRadius: "var(--moonkey-border-radius-lg)",
-                        border: "1px solid ".concat(hoveredWallet === walletType ? "var(--moonkey-color-accent)" : "var(--moonkey-color-border)"),
+                        borderRadius: "var(--moonx-border-radius-lg)",
+                        border: "1px solid ".concat(hoveredWallet === walletType ? "var(--moonx-color-accent)" : "var(--moonx-color-border)"),
                         padding: "0.75rem 0.25rem",
                         cursor: "pointer",
                         transition: "all 0.2s ease"
                     };
                 };
                 var uninstalledWalletCardStyles = {
-                    borderRadius: "var(--moonkey-border-radius-lg)",
-                    border: "1px solid var(--moonkey-color-border)",
-                    backgroundColor: "var(--moonkey-color-background-2)",
+                    borderRadius: "var(--moonx-border-radius-lg)",
+                    border: "1px solid var(--moonx-color-border)",
+                    backgroundColor: "var(--moonx-color-background-2)",
                     padding: "0.75rem 0.25rem",
                     cursor: "not-allowed",
                     opacity: 0.6,
@@ -16963,11 +17008,11 @@ var SolanaWalletSelector = function SolanaWalletSelector(param) {
                 };
                 var walletNameStyles = {
                     fontSize: "0.875rem",
-                    color: "var(--moonkey-color-foreground)"
+                    color: "var(--moonx-color-foreground)"
                 };
                 var uninstalledWalletNameStyles = {
                     fontSize: "0.875rem",
-                    color: "var(--moonkey-color-foreground-3)"
+                    color: "var(--moonx-color-foreground-3)"
                 };
                 var installLabelContainerStyles = {
                     marginLeft: "auto",
@@ -16975,11 +17020,11 @@ var SolanaWalletSelector = function SolanaWalletSelector(param) {
                 };
                 var installLabelStyles = {
                     fontSize: "0.75rem",
-                    color: "var(--moonkey-color-foreground-3)"
+                    color: "var(--moonx-color-foreground-3)"
                 };
                 var dividerStyles = {
                     margin: "0.2rem 0",
-                    borderTop: "1px solid var(--moonkey-color-border)"
+                    borderTop: "1px solid var(--moonx-color-border)"
                 };
                 return /* @__PURE__ */ jsxs56(Fragment14, {
                     children: [
@@ -17119,7 +17164,7 @@ var SolanaWallets = function SolanaWallets(param) {
                         })
                     }),
                     /* @__PURE__ */ jsx69("div", {
-                        className: "moonkey-label",
+                        className: "moonx-label",
                         children: /* @__PURE__ */ jsx69("span", {
                             children: currentStep === "listing" ? "Select a wallet" : "Connect ".concat((selectedWallet === null || selectedWallet === void 0 ? void 0 : selectedWallet.name) || "wallet")
                         })
@@ -17804,7 +17849,7 @@ var AuthProvider = function AuthProvider(param) {
         try {
             for(var _iterator = targets[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
                 var _step_value = _step.value, origin = _step_value.origin, crossorigin = _step_value.crossorigin;
-                var sel = 'link[data-moonkey-preconnect="'.concat(origin, '"]');
+                var sel = 'link[data-moonx-preconnect="'.concat(origin, '"]');
                 if (document.head.querySelector(sel)) continue;
                 for(var _i = 0, _iter = [
                     "preconnect",
@@ -17815,7 +17860,7 @@ var AuthProvider = function AuthProvider(param) {
                     link.rel = rel;
                     link.href = origin;
                     if (crossorigin && rel === "preconnect") link.crossOrigin = "anonymous";
-                    link.setAttribute("data-moonkey-preconnect", origin);
+                    link.setAttribute("data-moonx-preconnect", origin);
                     document.head.appendChild(link);
                     added.push(link);
                 }
@@ -18539,7 +18584,7 @@ var AuthProvider = function AuthProvider(param) {
             value: sdkInstance,
             children: [
                 isMounted && /* @__PURE__ */ jsx72("iframe", {
-                    id: "moonkey-auth-iframe",
+                    id: "moonx-auth-iframe",
                     ref: iframeRef,
                     src: finalUrl,
                     style: iframeStyles,
@@ -18574,7 +18619,7 @@ var WalletConnectContext = createContext({
     isInitializing: false
 });
 var MoonKeyContext = createContext(null);
-var MoonKeyProvider = function MoonKeyProvider(param) {
+var MoonXProvider = function MoonXProvider(param) {
     var publishableKey = param.publishableKey, embeddableId = param.embeddableId, config = param.config, children = param.children;
     var _config_walletConnect, _config_emailConfig, _config_emailConfig1, _config_emailConfig2, _config_emailConfig3, _config_emailConfig4;
     if ((config === null || config === void 0 ? void 0 : config.chains) || (config === null || config === void 0 ? void 0 : config.defaultChain)) {
@@ -18759,4 +18804,4 @@ var getReconnectionInfo = function getReconnectionInfo(error) {
 import { buildChainIndex, estimateEvmGas, estimateEvmGasReserve, getChainById, getEvmGasPrice, getEvmMaxPriorityFeePerGas, getEvmNonce, getRpcUrl, isChainSupported, isEvmEntry, normalizeChainKey, resolveChainEntry, resolveRpcUrl, resolveSolanaChainEntry, resolveWsUrl, validateChainConfig as validateChainConfig2 } from "@moon-x/core/lib";
 import { Network } from "@moon-x/core/types";
 import { arbitrum, arbitrumSepolia, avalanche, avalancheFuji, base, baseSepolia, bsc, bscTestnet, goerli, holesky, mainnet, optimism, optimismSepolia, polygon, polygonAmoy, sepolia } from "viem/chains";
-export { MoonKeyProvider, Network, SessionExpiredError, SessionNotFoundError, appearanceToComponentVars, appearanceToCssVars, appearanceToMoonxVars, appearanceToTheme, arbitrum, arbitrumSepolia, avalanche, avalancheFuji, base, baseSepolia, bsc, bscTestnet, buildChainIndex, darkTheme, definedOnly, estimateEvmGas, estimateEvmGasReserve, ethereum_exports as ethereum, getChainById, getEvmGasPrice, getEvmMaxPriorityFeePerGas, getEvmNonce, getReconnectionInfo, getRpcUrl, goerli, holesky, isChainSupported, isColorDark, isDarkAppearance, isDarkMode, isEvmEntry, lightTheme, mainnet, normalizeChainKey, optimism, optimismSepolia, polygon, polygonAmoy, requiresReconnection, resolveAppearanceTokens, resolveChainEntry, resolveFontUrls, resolveLogo, resolveRpcUrl, resolveSolanaChainEntry, resolveWsUrl, sepolia, solana_exports as solana, themeToCSS, useAddPasskey, useAttachOAuth, useConnectWallet, useDetachOAuth, useEphemeralSigner, useLoginWithEmail, useLoginWithOAuth, useMoonKey, useOAuthCompletion, usePasskeyStatus, useRegisterPasskey, useRemovePasskey, useUser, validateChainConfig2 as validateChainConfig };
+export { MoonXProvider, Network, SessionExpiredError, SessionNotFoundError, appearanceToComponentVars, appearanceToCssVars, appearanceToMoonxVars, appearanceToTheme, arbitrum, arbitrumSepolia, avalanche, avalancheFuji, base, baseSepolia, bsc, bscTestnet, buildChainIndex, darkTheme, definedOnly, estimateEvmGas, estimateEvmGasReserve, ethereum_exports as ethereum, getChainById, getEvmGasPrice, getEvmMaxPriorityFeePerGas, getEvmNonce, getReconnectionInfo, getRpcUrl, goerli, holesky, isChainSupported, isColorDark, isDarkAppearance, isDarkMode, isEvmEntry, lightTheme, mainnet, normalizeChainKey, optimism, optimismSepolia, polygon, polygonAmoy, requiresReconnection, resolveAppearanceTokens, resolveChainEntry, resolveFontUrls, resolveLogo, resolveRpcUrl, resolveSolanaChainEntry, resolveWsUrl, sepolia, solana_exports as solana, themeToCSS, useAddPasskey, useAttachOAuth, useConnectWallet, useDetachOAuth, useEphemeralSigner, useLoginWithEmail, useLoginWithOAuth, useMoonX, useOAuthCompletion, usePasskeyStatus, useRegisterPasskey, useRemovePasskey, useUser, validateChainConfig2 as validateChainConfig };