@coinlist-co/react 0.11.1-rc.e102bdb → 0.12.0

package/dist/client/index.js

@@ -4,7 +4,7 @@ import {
   PINO_LEVEL,
   SDK_LOGGER_NAME,
   loggerOverPino
-} from "../chunk-UZUQALFY.js";
+} from "../chunk-F6WGUKZC.js";
 import {
   AuthorizationCode,
   CodeVerifier,
@@ -36,9 +36,9 @@ import {
   formattedPricePerShare,
   generatePKCEParams,
   isStopped,
-  ondoSwapContractAddress,
-  superstateSwapContractAddress
-} from "../chunk-LSPZETDH.js";
+  superstateSwapContractAddress,
+  swapSpender
+} from "../chunk-ZFBEI3BW.js";
 import {
   API_VERSION,
   AssetDecimals,
@@ -85,7 +85,7 @@ import {
   shortenAddress,
   txExplorerUrl,
   usdAmount
-} from "../chunk-7CTH4KPU.js";
+} from "../chunk-6CQHDASY.js";
 
 // src/client/CoinListProvider.tsx
 import {
@@ -233,7 +233,7 @@ var ClientAuthNamespaceImpl = class {
   }
 };
 
-// src/client/core/blockchain/wallet-error.ts
+// src/client/core/shared/blockchain/wallet-error.ts
 import {
   BaseError,
   ContractFunctionRevertedError,
@@ -268,7 +268,7 @@ function revertReason(error) {
   return error.reason ?? error.data?.errorName ?? error.signature ?? null;
 }
 
-// src/client/core/blockchain/erc20/approval.ts
+// src/client/core/shared/blockchain/erc20/approval.ts
 async function ensureErc20Allowance({
   erc20,
   chain,
@@ -445,7 +445,7 @@ async function executeTokenSale(params) {
   return { type: "success", participation, approvalTxHash };
 }
 
-// src/client/core/observability/flow-logging.ts
+// src/client/core/shared/observability/flow-logging.ts
 async function withFlowLogging(log, flow, fields, onProgress, run) {
   const flowLog = log.child({ flow });
   flowLog.info(() => ({ msg: "flow started", fields }));
@@ -537,16 +537,6 @@ var ClientCoinListTokenSaleNamespaceImpl = class extends CoinListTokenSaleNamesp
   }
 };
 
-// src/shared/core/blockchain/address.ts
-import { isAddressEqual } from "viem";
-function isSameEvmAddress(a, b) {
-  try {
-    return isAddressEqual(a, b);
-  } catch {
-    return false;
-  }
-}
-
 // src/client/core/checkout/ondo/ondo-flows.ts
 async function prepareOndoBuy(params) {
   const { ondo, symbol, chain, wallet, amount } = params;
@@ -573,9 +563,17 @@ async function prepareOndoSell(params) {
   );
 }
 async function prepare(params, build) {
-  const { erc20, wallet, chain, tokenAddress, amount, onProgress } = params;
+  const {
+    erc20,
+    wallet,
+    chain,
+    swapContracts,
+    tokenAddress,
+    amount,
+    onProgress
+  } = params;
   const emit = (phase) => onProgress?.(phase);
-  const spender = ondoSwapContractAddress(chain);
+  const spender = swapSpender(swapContracts, chain);
   if (spender === null) {
     return { type: "error", error: { step: "unsupported-chain", chain } };
   }
@@ -606,16 +604,6 @@ async function executeOndoSwap(params) {
   if (now.getTime() >= transaction.expiresAt.getTime()) {
     return { type: "error", error: { step: "quote-expired" } };
   }
-  const spender = ondoSwapContractAddress(chain);
-  if (spender === null || !isSameEvmAddress(transaction.tx.to, spender)) {
-    return {
-      type: "error",
-      error: {
-        step: "spender-mismatch",
-        expected: spender ?? transaction.tx.to
-      }
-    };
-  }
   emit("broadcasting-swap");
   let txHash;
   try {
@@ -907,7 +895,7 @@ var ClientSuperstateSwapNamespaceImpl = class extends SuperstateSwapNamespaceImp
   }
 };
 
-// src/client/core/utils/open-in-new-tab.ts
+// src/client/core/shared/utils/open-in-new-tab.ts
 function openInNewTab(url) {
   window.open(url, "_blank", "noopener,noreferrer");
 }
@@ -1100,7 +1088,7 @@ var CoinListProvider = CoinListContextProvider;
 import { createContext as createContext4, useContext as useContext3 } from "react";
 
 // src/client/generated/sdk-styles.gen.ts
-var sdkStyles = '/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer theme{:root,:host{--clcosdk-font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--clcosdk-color-red-400:oklch(70.4% .191 22.216);--clcosdk-color-red-500:oklch(63.7% .237 25.331);--clcosdk-color-amber-500:oklch(76.9% .188 70.08);--clcosdk-color-gray-400:oklch(70.7% .022 261.325);--clcosdk-color-gray-500:oklch(55.1% .027 264.364);--clcosdk-color-black:#000;--clcosdk-spacing:.25rem;--clcosdk-container-sm:24rem;--clcosdk-container-md:28rem;--clcosdk-container-xl:36rem;--clcosdk-text-xs:.75rem;--clcosdk-text-xs--line-height:calc(1 / .75);--clcosdk-text-sm:.875rem;--clcosdk-text-sm--line-height:calc(1.25 / .875);--clcosdk-text-base:1rem;--clcosdk-text-base--line-height:calc(1.5 / 1);--clcosdk-text-lg:1.125rem;--clcosdk-text-lg--line-height:calc(1.75 / 1.125);--clcosdk-font-weight-normal:400;--clcosdk-font-weight-medium:500;--clcosdk-font-weight-semibold:600;--clcosdk-radius-md:.375rem;--clcosdk-radius-lg:.5rem;--clcosdk-radius-xl:.75rem;--clcosdk-radius-2xl:1rem;--clcosdk-ease-out:cubic-bezier(0, 0, .2, 1);--clcosdk-ease-in-out:cubic-bezier(.4, 0, .2, 1);--clcosdk-animate-spin:spin 1s linear infinite;--clcosdk-animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--clcosdk-color-brand-primary:var(--color-brand-primary)}}@layer base{.clco-sdk-root{--color-brand-primary:#171717;--color-brand-primary-hover:#000;--color-brand-primary-active:#262626;--color-accent:#2b3a67;--color-accent-hover:#243057;--color-accent-active:#1d2647;--color-accent-focus:#c7d2fe;--color-accent-subtle:#eef1f8;--color-text-primary:#171717;--color-text-secondary:#8c8c8c;--color-text-disabled:#d1d1d1;--color-text-inverse:#fff;--color-background:#fff;--color-surface:#fafafa;--color-section:#f3f3f3;--color-border:#e5e5e5;--color-divider:#ececec;--color-overlay:#00000080;--color-positive:#15803d;--color-positive-subtle:#dcfce7;--color-negative:#dc2626;--color-negative-subtle:#fee2e2;--color-success:#2c8c5e;--color-success-subtle:#e6f4ec;--color-success-border:#cfe9db;--color-warning:#e08a1a;--color-warning-subtle:#fff7ed;--color-warning-border:#fdead7;--color-error:#b42318;--color-error-subtle:#feeceb;--color-error-border:#fbd5d2;--shadow-step-active:0px 0px 10px 0px #0000001a;--shadow-dialog:0px 8px 32px 0px #0000001a;--btn-primary-gradient:linear-gradient(180deg, #262626 0%, #1c1c1c 50%, #0f0f0f 100%);--btn-primary-shadow:inset 0px -1px 3px 0px #00000059, inset 0px 1px 2px 0px #ffffff2e, inset 0px 1px 0px 0px #ffffff1a;--sale-card-surface:linear-gradient(to top, #0a0a0a 0%, #1a1a1a 100%);--color-sale-card-text:#f4f4f5;--color-sale-card-text-muted:#a1a1aa;--color-sale-card-text-strong:#fff;--color-sale-card-border:#ffffff40;--color-sale-card-chrome-border:#ffffff4d;--color-sale-card-chrome-bg:#ffffff26;--color-sale-card-chrome-emphasis-border:#fff6;--color-sale-card-chrome-emphasis-bg:#ffffff40;--color-sale-card-focus-ring:#ffffff80}@media (prefers-color-scheme:dark){.clco-sdk-root:not(:where(.light,.light *)){--color-brand-primary:#f4f4f5;--color-brand-primary-hover:#fff;--color-brand-primary-active:#e4e4e7;--color-accent:#6f82c9;--color-accent-hover:#8799e4;--color-accent-active:#5b6fcf;--color-accent-focus:#6f82c959;--color-accent-subtle:#6f82c91f;--color-text-primary:#f4f4f5;--color-text-secondary:#a1a1aa;--color-text-disabled:#71717a;--color-text-inverse:#171717;--color-background:#0f1115;--color-surface:#161a20;--color-section:#20242c;--color-border:#2a2e35;--color-divider:#323741;--color-overlay:#000000b3;--color-positive:#22c55e;--color-positive-subtle:#22c55e1f;--color-negative:#ef4444;--color-negative-subtle:#ef44441f;--color-success:#34d399;--color-success-subtle:#34d3991f;--color-success-border:#34d39940;--color-warning:#f59e0b;--color-warning-subtle:#f59e0b1f;--color-warning-border:#f59e0b40;--color-error:#f87171;--color-error-subtle:#f871711f;--color-error-border:#f8717140;--shadow-step-active:0px 0px 10px 0px #00000080;--shadow-dialog:0px 8px 32px 0px #0009;--btn-primary-gradient:linear-gradient(180deg, #fafafa 0%, #f0f0f0 50%, #e4e4e7 100%);--btn-primary-shadow:inset 0px -1px 3px 0px #0000001f, inset 0px 1px 2px 0px #fff9, inset 0px 1px 0px 0px #fff6}}:where(.dark,.dark *) .clco-sdk-root{--color-brand-primary:#f4f4f5;--color-brand-primary-hover:#fff;--color-brand-primary-active:#e4e4e7;--color-accent:#6f82c9;--color-accent-hover:#8799e4;--color-accent-active:#5b6fcf;--color-accent-focus:#6f82c959;--color-accent-subtle:#6f82c91f;--color-text-primary:#f4f4f5;--color-text-secondary:#a1a1aa;--color-text-disabled:#71717a;--color-text-inverse:#171717;--color-background:#0f1115;--color-surface:#161a20;--color-section:#20242c;--color-border:#2a2e35;--color-divider:#323741;--color-overlay:#000000b3;--color-positive:#22c55e;--color-positive-subtle:#22c55e1f;--color-negative:#ef4444;--color-negative-subtle:#ef44441f;--color-success:#34d399;--color-success-subtle:#34d3991f;--color-success-border:#34d39940;--color-warning:#f59e0b;--color-warning-subtle:#f59e0b1f;--color-warning-border:#f59e0b40;--color-error:#f87171;--color-error-subtle:#f871711f;--color-error-border:#f8717140;--shadow-step-active:0px 0px 10px 0px #00000080;--shadow-dialog:0px 8px 32px 0px #0009;--btn-primary-gradient:linear-gradient(180deg, #fafafa 0%, #f0f0f0 50%, #e4e4e7 100%);--btn-primary-shadow:inset 0px -1px 3px 0px #0000001f, inset 0px 1px 2px 0px #fff9, inset 0px 1px 0px 0px #fff6}.clco-sdk-root{color:var(--color-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.clco-sdk-root *,.clco-sdk-root :before,.clco-sdk-root :after{box-sizing:border-box}.clco-sdk-root button{appearance:none;cursor:pointer;font:inherit;color:inherit;background:0 0;border:none;padding:0}.clco-sdk-root input,.clco-sdk-root textarea,.clco-sdk-root select{font:inherit;color:inherit;background:0 0;border:none;border-radius:0;padding:0}.clco-sdk-root a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}.clco-sdk-root ul,.clco-sdk-root ol{margin:0;padding:0;list-style:none}.clco-sdk-root h1,.clco-sdk-root h2,.clco-sdk-root h3,.clco-sdk-root h4,.clco-sdk-root h5,.clco-sdk-root h6,.clco-sdk-root p,.clco-sdk-root figure,.clco-sdk-root blockquote,.clco-sdk-root dl,.clco-sdk-root dd,.clco-sdk-root pre{margin:0}.clco-sdk-root img,.clco-sdk-root svg{max-width:100%;display:block}@keyframes clco-status-ping{0%{opacity:.7;transform:scale(1)}75%,to{opacity:0;transform:scale(3.25)}}.clco-sdk-root .clcosdk-status-dot-ping{animation:1.6s cubic-bezier(0,0,.2,1) infinite clco-status-ping}@media (prefers-reduced-motion:reduce){.clco-sdk-root .clcosdk-status-dot-ping{opacity:0;animation:none}}}@layer components;@layer utilities{.clcosdk\\:pointer-events-none{pointer-events:none}.clcosdk\\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.clcosdk\\:absolute{position:absolute}.clcosdk\\:fixed{position:fixed}.clcosdk\\:relative{position:relative}.clcosdk\\:inset-0{inset:calc(var(--clcosdk-spacing) * 0)}.clcosdk\\:top-1\\/2{top:50%}.clcosdk\\:top-4{top:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:top-full{top:100%}.clcosdk\\:-right-0\\.5{right:calc(var(--clcosdk-spacing) * -.5)}.clcosdk\\:right-4{right:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:right-\\[-14\\%\\]{right:-14%}.clcosdk\\:-bottom-0\\.5{bottom:calc(var(--clcosdk-spacing) * -.5)}.clcosdk\\:bottom-full{bottom:100%}.clcosdk\\:left-1\\/2{left:50%}.clcosdk\\:z-0{z-index:0}.clcosdk\\:z-10{z-index:10}.clcosdk\\:z-50{z-index:50}.clcosdk\\:order-1{order:1}.clcosdk\\:order-2{order:2}.clcosdk\\:mt-2{margin-top:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:mt-4{margin-top:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:mt-auto{margin-top:auto}.clcosdk\\:mb-2{margin-bottom:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:flex{display:flex}.clcosdk\\:grid{display:grid}.clcosdk\\:inline-flex{display:inline-flex}.clcosdk\\:size-2{width:calc(var(--clcosdk-spacing) * 2);height:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:size-3{width:calc(var(--clcosdk-spacing) * 3);height:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:size-3\\.5{width:calc(var(--clcosdk-spacing) * 3.5);height:calc(var(--clcosdk-spacing) * 3.5)}.clcosdk\\:size-4{width:calc(var(--clcosdk-spacing) * 4);height:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:size-5{width:calc(var(--clcosdk-spacing) * 5);height:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:size-10{width:calc(var(--clcosdk-spacing) * 10);height:calc(var(--clcosdk-spacing) * 10)}.clcosdk\\:size-16{width:calc(var(--clcosdk-spacing) * 16);height:calc(var(--clcosdk-spacing) * 16)}.clcosdk\\:size-24{width:calc(var(--clcosdk-spacing) * 24);height:calc(var(--clcosdk-spacing) * 24)}.clcosdk\\:size-\\[15rem\\]{width:15rem;height:15rem}.clcosdk\\:size-full{width:100%;height:100%}.clcosdk\\:h-1{height:calc(var(--clcosdk-spacing) * 1)}.clcosdk\\:h-3{height:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:h-4{height:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:h-5{height:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:h-6{height:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:h-8{height:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:h-9{height:calc(var(--clcosdk-spacing) * 9)}.clcosdk\\:h-10{height:calc(var(--clcosdk-spacing) * 10)}.clcosdk\\:h-11{height:calc(var(--clcosdk-spacing) * 11)}.clcosdk\\:h-12{height:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:h-14{height:calc(var(--clcosdk-spacing) * 14)}.clcosdk\\:h-\\[18px\\]{height:18px}.clcosdk\\:h-\\[54px\\]{height:54px}.clcosdk\\:h-\\[71px\\]{height:71px}.clcosdk\\:h-auto{height:auto}.clcosdk\\:h-full{height:100%}.clcosdk\\:h-px{height:1px}.clcosdk\\:max-h-\\[92vh\\]{max-height:92vh}.clcosdk\\:max-h-full{max-height:100%}.clcosdk\\:min-h-0{min-height:calc(var(--clcosdk-spacing) * 0)}.clcosdk\\:min-h-9{min-height:calc(var(--clcosdk-spacing) * 9)}.clcosdk\\:min-h-40{min-height:calc(var(--clcosdk-spacing) * 40)}.clcosdk\\:min-h-screen{min-height:100vh}.clcosdk\\:w-1{width:calc(var(--clcosdk-spacing) * 1)}.clcosdk\\:w-4{width:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:w-5{width:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:w-6{width:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:w-8{width:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:w-10{width:calc(var(--clcosdk-spacing) * 10)}.clcosdk\\:w-12{width:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:w-16{width:calc(var(--clcosdk-spacing) * 16)}.clcosdk\\:w-20{width:calc(var(--clcosdk-spacing) * 20)}.clcosdk\\:w-24{width:calc(var(--clcosdk-spacing) * 24)}.clcosdk\\:w-28{width:calc(var(--clcosdk-spacing) * 28)}.clcosdk\\:w-32{width:calc(var(--clcosdk-spacing) * 32)}.clcosdk\\:w-40{width:calc(var(--clcosdk-spacing) * 40)}.clcosdk\\:w-48{width:calc(var(--clcosdk-spacing) * 48)}.clcosdk\\:w-80{width:calc(var(--clcosdk-spacing) * 80)}.clcosdk\\:w-96{width:calc(var(--clcosdk-spacing) * 96)}.clcosdk\\:w-\\[16px\\]{width:16px}.clcosdk\\:w-\\[28rem\\]{width:28rem}.clcosdk\\:w-\\[448px\\]{width:448px}.clcosdk\\:w-auto{width:auto}.clcosdk\\:w-component{width:448px}.clcosdk\\:w-fit{width:fit-content}.clcosdk\\:w-full{width:100%}.clcosdk\\:w-max{width:max-content}.clcosdk\\:max-w-\\[16rem\\]{max-width:16rem}.clcosdk\\:max-w-\\[28rem\\]{max-width:28rem}.clcosdk\\:max-w-\\[30rem\\]{max-width:30rem}.clcosdk\\:max-w-\\[40rem\\]{max-width:40rem}.clcosdk\\:max-w-\\[56rem\\]{max-width:56rem}.clcosdk\\:max-w-\\[64rem\\]{max-width:64rem}.clcosdk\\:max-w-\\[760px\\]{max-width:760px}.clcosdk\\:max-w-full{max-width:100%}.clcosdk\\:max-w-md{max-width:var(--clcosdk-container-md)}.clcosdk\\:max-w-sm{max-width:var(--clcosdk-container-sm)}.clcosdk\\:max-w-xl{max-width:var(--clcosdk-container-xl)}.clcosdk\\:min-w-0{min-width:calc(var(--clcosdk-spacing) * 0)}.clcosdk\\:flex-1{flex:1}.clcosdk\\:shrink-0{flex-shrink:0}.clcosdk\\:-translate-x-1\\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.clcosdk\\:-translate-y-1\\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.clcosdk\\:rotate-90{rotate:90deg}.clcosdk\\:rotate-180{rotate:180deg}.clcosdk\\:animate-pulse{animation:var(--clcosdk-animate-pulse)}.clcosdk\\:animate-spin{animation:var(--clcosdk-animate-spin)}.clcosdk\\:cursor-pointer{cursor:pointer}.clcosdk\\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.clcosdk\\:grid-rows-\\[0fr\\]{grid-template-rows:0fr}.clcosdk\\:grid-rows-\\[1fr\\]{grid-template-rows:1fr}.clcosdk\\:flex-col{flex-direction:column}.clcosdk\\:flex-wrap{flex-wrap:wrap}.clcosdk\\:items-center{align-items:center}.clcosdk\\:items-end{align-items:flex-end}.clcosdk\\:items-start{align-items:flex-start}.clcosdk\\:justify-between{justify-content:space-between}.clcosdk\\:justify-center{justify-content:center}.clcosdk\\:justify-end{justify-content:flex-end}.clcosdk\\:gap-1{gap:calc(var(--clcosdk-spacing) * 1)}.clcosdk\\:gap-1\\.5{gap:calc(var(--clcosdk-spacing) * 1.5)}.clcosdk\\:gap-2{gap:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:gap-2\\.5{gap:calc(var(--clcosdk-spacing) * 2.5)}.clcosdk\\:gap-3{gap:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:gap-4{gap:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:gap-6{gap:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:gap-\\[5px\\]{gap:5px}:where(.clcosdk\\:space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--clcosdk-spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--clcosdk-spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.clcosdk\\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--clcosdk-spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--clcosdk-spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.clcosdk\\:divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.clcosdk\\:divide-border>:not(:last-child)){border-color:var(--color-border)}:where(.clcosdk\\:divide-divider>:not(:last-child)){border-color:var(--color-divider)}.clcosdk\\:self-start{align-self:flex-start}.clcosdk\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.clcosdk\\:overflow-hidden{overflow:hidden}.clcosdk\\:overflow-y-auto{overflow-y:auto}.clcosdk\\:rounded{border-radius:.25rem}.clcosdk\\:rounded-2xl{border-radius:var(--clcosdk-radius-2xl)}.clcosdk\\:rounded-\\[20px\\]{border-radius:20px}.clcosdk\\:rounded-\\[28px\\]{border-radius:28px}.clcosdk\\:rounded-btn{border-radius:12px}.clcosdk\\:rounded-card{border-radius:24px}.clcosdk\\:rounded-full{border-radius:3.40282e38px}.clcosdk\\:rounded-lg{border-radius:var(--clcosdk-radius-lg)}.clcosdk\\:rounded-md{border-radius:var(--clcosdk-radius-md)}.clcosdk\\:rounded-xl{border-radius:var(--clcosdk-radius-xl)}.clcosdk\\:border{border-style:var(--tw-border-style);border-width:1px}.clcosdk\\:border-2{border-style:var(--tw-border-style);border-width:2px}.clcosdk\\:border-\\[1\\.5px\\]{border-style:var(--tw-border-style);border-width:1.5px}.clcosdk\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.clcosdk\\:border-accent\\/60{border-color:var(--color-accent)}@supports (color:color-mix(in lab, red, red)){.clcosdk\\:border-accent\\/60{border-color:color-mix(in oklab, var(--color-accent) 60%, transparent)}}.clcosdk\\:border-amber-500{border-color:var(--clcosdk-color-amber-500)}.clcosdk\\:border-background{border-color:var(--color-background)}.clcosdk\\:border-border{border-color:var(--color-border)}.clcosdk\\:border-brand-primary{border-color:var(--color-brand-primary)}.clcosdk\\:border-current{border-color:currentColor}.clcosdk\\:border-divider{border-color:var(--color-divider)}.clcosdk\\:border-error-border{border-color:var(--color-error-border)}.clcosdk\\:border-sale-card-border{border-color:var(--color-sale-card-border)}.clcosdk\\:border-sale-card-chrome-border{border-color:var(--color-sale-card-chrome-border)}.clcosdk\\:border-success-border{border-color:var(--color-success-border)}.clcosdk\\:border-warning-border{border-color:var(--color-warning-border)}.clcosdk\\:border-t-transparent{border-top-color:#0000}.clcosdk\\:bg-background{background-color:var(--color-background)}.clcosdk\\:bg-black\\/50{background-color:var(--clcosdk-color-black)}@supports (color:color-mix(in lab, red, red)){.clcosdk\\:bg-black\\/50{background-color:color-mix(in oklab, var(--clcosdk-color-black) 50%, transparent)}}.clcosdk\\:bg-brand-primary{background-color:var(--color-brand-primary)}.clcosdk\\:bg-divider{background-color:var(--color-divider)}.clcosdk\\:bg-error-subtle{background-color:var(--color-error-subtle)}.clcosdk\\:bg-overlay{background-color:var(--color-overlay)}.clcosdk\\:bg-positive{background-color:var(--color-positive)}.clcosdk\\:bg-positive-subtle{background-color:var(--color-positive-subtle)}.clcosdk\\:bg-sale-card-chrome-bg{background-color:var(--color-sale-card-chrome-bg)}.clcosdk\\:bg-section{background-color:var(--color-section)}.clcosdk\\:bg-success-subtle{background-color:var(--color-success-subtle)}.clcosdk\\:bg-surface{background-color:var(--color-surface)}.clcosdk\\:bg-text-disabled{background-color:var(--color-text-disabled)}.clcosdk\\:bg-text-primary{background-color:var(--color-text-primary)}.clcosdk\\:bg-transparent{background-color:#0000}.clcosdk\\:bg-warning-subtle{background-color:var(--color-warning-subtle)}.clcosdk\\:bg-\\[image\\:var\\(--btn-primary-gradient\\)\\]{background-image:var(--btn-primary-gradient)}.clcosdk\\:bg-\\[image\\:var\\(--sale-card-surface\\)\\]{background-image:var(--sale-card-surface)}.clcosdk\\:object-contain{object-fit:contain}.clcosdk\\:object-cover{object-fit:cover}.clcosdk\\:p-0{padding:calc(var(--clcosdk-spacing) * 0)}.clcosdk\\:p-1\\.5{padding:calc(var(--clcosdk-spacing) * 1.5)}.clcosdk\\:p-3{padding:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:p-3\\.5{padding:calc(var(--clcosdk-spacing) * 3.5)}.clcosdk\\:p-4{padding:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:p-5{padding:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:p-6{padding:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:p-8{padding:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:p-16{padding:calc(var(--clcosdk-spacing) * 16)}.clcosdk\\:px-2{padding-inline:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:px-3{padding-inline:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:px-4{padding-inline:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:px-5{padding-inline:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:px-6{padding-inline:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:py-1\\.5{padding-block:calc(var(--clcosdk-spacing) * 1.5)}.clcosdk\\:py-2{padding-block:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:py-3{padding-block:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:py-8{padding-block:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:py-12{padding-block:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:pt-1{padding-top:calc(var(--clcosdk-spacing) * 1)}.clcosdk\\:pt-4{padding-top:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:pt-14{padding-top:calc(var(--clcosdk-spacing) * 14)}.clcosdk\\:pr-1\\.5{padding-right:calc(var(--clcosdk-spacing) * 1.5)}.clcosdk\\:pr-3{padding-right:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:pr-4{padding-right:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:pb-4{padding-bottom:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:pl-3{padding-left:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:text-center{text-align:center}.clcosdk\\:text-left{text-align:left}.clcosdk\\:text-right{text-align:right}.clcosdk\\:font-mono{font-family:var(--clcosdk-font-mono)}.clcosdk\\:text-base{font-size:var(--clcosdk-text-base);line-height:var(--tw-leading,var(--clcosdk-text-base--line-height))}.clcosdk\\:text-lg{font-size:var(--clcosdk-text-lg);line-height:var(--tw-leading,var(--clcosdk-text-lg--line-height))}.clcosdk\\:text-sm{font-size:var(--clcosdk-text-sm);line-height:var(--tw-leading,var(--clcosdk-text-sm--line-height))}.clcosdk\\:text-xs{font-size:var(--clcosdk-text-xs);line-height:var(--tw-leading,var(--clcosdk-text-xs--line-height))}.clcosdk\\:text-\\[11px\\]{font-size:11px}.clcosdk\\:text-\\[12px\\]{font-size:12px}.clcosdk\\:text-\\[13px\\]{font-size:13px}.clcosdk\\:text-\\[14px\\]{font-size:14px}.clcosdk\\:text-\\[15px\\]{font-size:15px}.clcosdk\\:text-\\[16px\\]{font-size:16px}.clcosdk\\:text-\\[18px\\]{font-size:18px}.clcosdk\\:text-\\[22px\\]{font-size:22px}.clcosdk\\:text-\\[28px\\]{font-size:28px}.clcosdk\\:text-\\[36px\\]{font-size:36px}.clcosdk\\:text-\\[48px\\]{font-size:48px}.clcosdk\\:text-\\[64px\\]{font-size:64px}.clcosdk\\:leading-\\[105\\%\\]{--tw-leading:105%;line-height:105%}.clcosdk\\:leading-\\[108\\%\\]{--tw-leading:108%;line-height:108%}.clcosdk\\:leading-\\[110\\%\\]{--tw-leading:110%;line-height:110%}.clcosdk\\:leading-\\[120\\%\\]{--tw-leading:120%;line-height:120%}.clcosdk\\:leading-\\[130\\%\\]{--tw-leading:130%;line-height:130%}.clcosdk\\:leading-\\[140\\%\\]{--tw-leading:140%;line-height:140%}.clcosdk\\:leading-\\[150\\%\\]{--tw-leading:150%;line-height:150%}.clcosdk\\:leading-\\[160\\%\\]{--tw-leading:160%;line-height:160%}.clcosdk\\:font-medium{--tw-font-weight:var(--clcosdk-font-weight-medium);font-weight:var(--clcosdk-font-weight-medium)}.clcosdk\\:font-normal{--tw-font-weight:var(--clcosdk-font-weight-normal);font-weight:var(--clcosdk-font-weight-normal)}.clcosdk\\:font-semibold{--tw-font-weight:var(--clcosdk-font-weight-semibold);font-weight:var(--clcosdk-font-weight-semibold)}.clcosdk\\:tracking-\\[0\\.12px\\]{--tw-tracking:.12px;letter-spacing:.12px}.clcosdk\\:tracking-\\[0\\.28px\\]{--tw-tracking:.28px;letter-spacing:.28px}.clcosdk\\:break-words{overflow-wrap:break-word}.clcosdk\\:whitespace-nowrap{white-space:nowrap}.clcosdk\\:text-background{color:var(--color-background)}.clcosdk\\:text-brand-primary{color:var(--color-brand-primary)}.clcosdk\\:text-error{color:var(--color-error)}.clcosdk\\:text-positive{color:var(--color-positive)}.clcosdk\\:text-sale-card-text{color:var(--color-sale-card-text)}.clcosdk\\:text-sale-card-text-muted{color:var(--color-sale-card-text-muted)}.clcosdk\\:text-sale-card-text-strong{color:var(--color-sale-card-text-strong)}.clcosdk\\:text-success{color:var(--color-success)}.clcosdk\\:text-text-disabled{color:var(--color-text-disabled)}.clcosdk\\:text-text-inverse{color:var(--color-text-inverse)}.clcosdk\\:text-text-primary{color:var(--color-text-primary)}.clcosdk\\:text-text-secondary{color:var(--color-text-secondary)}.clcosdk\\:text-warning{color:var(--color-warning)}.clcosdk\\:capitalize{text-transform:capitalize}.clcosdk\\:lining-nums{--tw-numeric-figure:lining-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.clcosdk\\:tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.clcosdk\\:no-underline{text-decoration-line:none}.clcosdk\\:underline{text-decoration-line:underline}.clcosdk\\:underline-offset-2{text-underline-offset:2px}.clcosdk\\:underline-offset-4{text-underline-offset:4px}.clcosdk\\:opacity-0{opacity:0}.clcosdk\\:opacity-60{opacity:.6}.clcosdk\\:shadow-\\[0_0_0_3px_rgba\\(59\\,130\\,246\\,0\\.2\\)\\]{--tw-shadow:0 0 0 3px var(--tw-shadow-color,#3b82f633);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-\\[0px_1px_1px_0px_rgba\\(10\\,10\\,10\\,0\\.04\\)\\,0px_8px_12px_0px_rgba\\(10\\,10\\,10\\,0\\.08\\)\\]{--tw-shadow:0px 1px 1px 0px var(--tw-shadow-color,#0a0a0a0a), 0px 8px 12px 0px var(--tw-shadow-color,#0a0a0a14);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-\\[0px_4px_12px_0px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\,0px_12px_28px_0px_rgba\\(0\\,0\\,0\\,0\\.13\\)\\]{--tw-shadow:0px 4px 12px 0px var(--tw-shadow-color,#00000014), 0px 12px 28px 0px var(--tw-shadow-color,#00000021);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-\\[var\\(--btn-primary-shadow\\)\\]{--tw-shadow:var(--btn-primary-shadow);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-card{--tw-shadow:0px 4px 6px -2px var(--tw-shadow-color,#0000000d), 0px 12px 24px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-dialog{--tw-shadow:var(--shadow-dialog);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-step-active{--tw-shadow:var(--shadow-step-active);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:transition-\\[background-color\\,border-color\\]{transition-property:background-color,border-color;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:transition-\\[grid-template-rows\\]{transition-property:grid-template-rows;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:duration-200{--tw-duration:.2s;transition-duration:.2s}.clcosdk\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.clcosdk\\:duration-500{--tw-duration:.5s;transition-duration:.5s}.clcosdk\\:ease-in-out{--tw-ease:var(--clcosdk-ease-in-out);transition-timing-function:var(--clcosdk-ease-in-out)}.clcosdk\\:ease-out{--tw-ease:var(--clcosdk-ease-out);transition-timing-function:var(--clcosdk-ease-out)}.clcosdk\\:outline-none{--tw-outline-style:none;outline-style:none}.clcosdk\\:group-focus-within\\:opacity-100:is(:where(.clcosdk\\:group):focus-within *){opacity:1}@media (hover:hover){.clcosdk\\:group-hover\\:border-sale-card-chrome-emphasis-border:is(:where(.clcosdk\\:group):hover *){border-color:var(--color-sale-card-chrome-emphasis-border)}.clcosdk\\:group-hover\\:bg-sale-card-chrome-emphasis-bg:is(:where(.clcosdk\\:group):hover *){background-color:var(--color-sale-card-chrome-emphasis-bg)}.clcosdk\\:group-hover\\:opacity-100:is(:where(.clcosdk\\:group):hover *){opacity:1}}.clcosdk\\:group-focus-visible\\:border-sale-card-chrome-emphasis-border:is(:where(.clcosdk\\:group):focus-visible *){border-color:var(--color-sale-card-chrome-emphasis-border)}.clcosdk\\:group-focus-visible\\:bg-sale-card-chrome-emphasis-bg:is(:where(.clcosdk\\:group):focus-visible *){background-color:var(--color-sale-card-chrome-emphasis-bg)}.clcosdk\\:placeholder\\:text-text-disabled::placeholder{color:var(--color-text-disabled)}@media (hover:hover){.clcosdk\\:hover\\:scale-\\[1\\.02\\]:hover{scale:1.02}.clcosdk\\:hover\\:border-text-disabled:hover{border-color:var(--color-text-disabled)}.clcosdk\\:hover\\:bg-\\[\\#fcdcd8\\]:hover{background-color:#fcdcd8}.clcosdk\\:hover\\:bg-border:hover{background-color:var(--color-border)}.clcosdk\\:hover\\:bg-brand-primary:hover{background-color:var(--color-brand-primary)}.clcosdk\\:hover\\:bg-brand-primary-hover:hover{background-color:var(--color-brand-primary-hover)}.clcosdk\\:hover\\:bg-section:hover{background-color:var(--color-section)}.clcosdk\\:hover\\:bg-surface:hover{background-color:var(--color-surface)}.clcosdk\\:hover\\:text-\\[\\#8b1a13\\]:hover{color:#8b1a13}.clcosdk\\:hover\\:text-text-primary:hover{color:var(--color-text-primary)}.clcosdk\\:hover\\:underline:hover{text-decoration-line:underline}.clcosdk\\:hover\\:opacity-80:hover{opacity:.8}.clcosdk\\:hover\\:opacity-90:hover{opacity:.9}}.clcosdk\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:focus-visible\\:ring-gray-400:focus-visible{--tw-ring-color:var(--clcosdk-color-gray-400)}.clcosdk\\:focus-visible\\:ring-gray-500:focus-visible{--tw-ring-color:var(--clcosdk-color-gray-500)}.clcosdk\\:focus-visible\\:ring-red-400:focus-visible{--tw-ring-color:var(--clcosdk-color-red-400)}.clcosdk\\:focus-visible\\:ring-red-500:focus-visible{--tw-ring-color:var(--clcosdk-color-red-500)}.clcosdk\\:focus-visible\\:ring-sale-card-focus-ring:focus-visible{--tw-ring-color:var(--color-sale-card-focus-ring)}.clcosdk\\:focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.clcosdk\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.clcosdk\\:active\\:bg-\\[\\#d9d9d9\\]:active{background-color:#d9d9d9}.clcosdk\\:active\\:bg-\\[\\#f9c9c4\\]:active{background-color:#f9c9c4}.clcosdk\\:active\\:bg-border:active{background-color:var(--color-border)}.clcosdk\\:active\\:bg-brand-primary-active:active{background-color:var(--color-brand-primary-active)}.clcosdk\\:active\\:text-\\[\\#6d1510\\]:active{color:#6d1510}.clcosdk\\:active\\:opacity-80:active{opacity:.8}.clcosdk\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.clcosdk\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.clcosdk\\:disabled\\:opacity-40:disabled{opacity:.4}.clcosdk\\:disabled\\:opacity-50:disabled{opacity:.5}.clcosdk\\:aria-disabled\\:cursor-not-allowed[aria-disabled=true]{cursor:not-allowed}.clcosdk\\:aria-disabled\\:opacity-50[aria-disabled=true]{opacity:.5}@media not all and (min-width:48rem){.clcosdk\\:max-md\\:hidden{display:none}.clcosdk\\:max-md\\:w-full{width:100%}.clcosdk\\:max-md\\:justify-start{justify-content:flex-start}.clcosdk\\:max-md\\:gap-4{gap:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:max-md\\:rounded-none{border-radius:0}.clcosdk\\:max-md\\:border-0{border-style:var(--tw-border-style);border-width:0}.clcosdk\\:max-md\\:bg-transparent{background-color:#0000}.clcosdk\\:max-md\\:p-0{padding:calc(var(--clcosdk-spacing) * 0)}@media (hover:hover){.clcosdk\\:max-md\\:hover\\:scale-100:hover{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}}}@media (min-width:40rem){.clcosdk\\:sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:48rem){.clcosdk\\:md\\:right-\\[-10\\%\\]{right:-10%}.clcosdk\\:md\\:order-1{order:1}.clcosdk\\:md\\:order-2{order:2}.clcosdk\\:md\\:hidden{display:none}.clcosdk\\:md\\:size-\\[20rem\\]{width:20rem;height:20rem}.clcosdk\\:md\\:h-9{height:calc(var(--clcosdk-spacing) * 9)}.clcosdk\\:md\\:h-12{height:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:md\\:h-\\[54px\\]{height:54px}.clcosdk\\:md\\:w-9{width:calc(var(--clcosdk-spacing) * 9)}.clcosdk\\:md\\:w-12{width:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.clcosdk\\:md\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.clcosdk\\:md\\:grid-cols-\\[minmax\\(0\\,11fr\\)_minmax\\(0\\,8fr\\)\\]{grid-template-columns:minmax(0,11fr) minmax(0,8fr)}.clcosdk\\:md\\:flex-row{flex-direction:row}.clcosdk\\:md\\:items-center{align-items:center}.clcosdk\\:md\\:items-end{align-items:flex-end}.clcosdk\\:md\\:justify-between{justify-content:space-between}.clcosdk\\:md\\:justify-end{justify-content:flex-end}.clcosdk\\:md\\:gap-3{gap:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:md\\:gap-6{gap:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:md\\:gap-x-12{column-gap:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:md\\:self-end{align-self:flex-end}.clcosdk\\:md\\:rounded-\\[40px\\]{border-radius:40px}.clcosdk\\:md\\:rounded-card{border-radius:24px}.clcosdk\\:md\\:rounded-dialog{border-radius:32px}.clcosdk\\:md\\:p-4{padding:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:md\\:p-6{padding:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:md\\:p-8{padding:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:md\\:px-6{padding-inline:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:md\\:px-8{padding-inline:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:md\\:py-2{padding-block:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:md\\:pr-2{padding-right:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:md\\:pr-4{padding-right:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:md\\:pl-4{padding-left:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:md\\:text-base{font-size:var(--clcosdk-text-base);line-height:var(--tw-leading,var(--clcosdk-text-base--line-height))}.clcosdk\\:md\\:text-\\[14px\\]{font-size:14px}.clcosdk\\:md\\:text-\\[16px\\]{font-size:16px}.clcosdk\\:md\\:text-\\[18px\\]{font-size:18px}.clcosdk\\:md\\:text-\\[28px\\]{font-size:28px}.clcosdk\\:md\\:leading-\\[120\\%\\]{--tw-leading:120%;line-height:120%}.clcosdk\\:md\\:leading-\\[160\\%\\]{--tw-leading:160%;line-height:160%}}@media (prefers-color-scheme:dark){@media (hover:hover){.clcosdk\\:dark\\:hover\\:bg-\\[rgba\\(248\\,113\\,113\\,0\\.20\\)\\]:not(:where(.light,.light *)):hover{background-color:#f8717133}}}@media (hover:hover){.clcosdk\\:dark\\:hover\\:bg-\\[rgba\\(248\\,113\\,113\\,0\\.20\\)\\]:where(.dark,.dark *):hover{background-color:#f8717133}}@media (prefers-color-scheme:dark){@media (hover:hover){.clcosdk\\:dark\\:hover\\:text-\\[\\#fca5a5\\]:not(:where(.light,.light *)):hover{color:#fca5a5}}}@media (hover:hover){.clcosdk\\:dark\\:hover\\:text-\\[\\#fca5a5\\]:where(.dark,.dark *):hover{color:#fca5a5}}@media (prefers-color-scheme:dark){.clcosdk\\:dark\\:active\\:bg-\\[rgba\\(248\\,113\\,113\\,0\\.30\\)\\]:not(:where(.light,.light *)):active{background-color:#f871714d}}.clcosdk\\:dark\\:active\\:bg-\\[rgba\\(248\\,113\\,113\\,0\\.30\\)\\]:where(.dark,.dark *):active{background-color:#f871714d}@media (prefers-color-scheme:dark){.clcosdk\\:dark\\:active\\:bg-divider:not(:where(.light,.light *)):active{background-color:var(--color-divider)}}.clcosdk\\:dark\\:active\\:bg-divider:where(.dark,.dark *):active{background-color:var(--color-divider)}@media (prefers-color-scheme:dark){.clcosdk\\:dark\\:active\\:text-\\[\\#f87171\\]:not(:where(.light,.light *)):active{color:#f87171}}.clcosdk\\:dark\\:active\\:text-\\[\\#f87171\\]:where(.dark,.dark *):active{color:#f87171}.clcosdk\\:\\[\\&_circle\\]\\:fill-error-subtle circle{fill:var(--color-error-subtle)}.clcosdk\\:\\[\\&_circle\\]\\:fill-success-subtle circle{fill:var(--color-success-subtle)}.clcosdk\\:\\[\\&_circle\\]\\:fill-warning-subtle circle{fill:var(--color-warning-subtle)}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}';
+var sdkStyles = '/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer theme{:root,:host{--clcosdk-font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--clcosdk-color-red-400:oklch(70.4% .191 22.216);--clcosdk-color-red-500:oklch(63.7% .237 25.331);--clcosdk-color-amber-500:oklch(76.9% .188 70.08);--clcosdk-color-gray-400:oklch(70.7% .022 261.325);--clcosdk-color-gray-500:oklch(55.1% .027 264.364);--clcosdk-color-black:#000;--clcosdk-spacing:.25rem;--clcosdk-container-sm:24rem;--clcosdk-container-md:28rem;--clcosdk-container-xl:36rem;--clcosdk-text-xs:.75rem;--clcosdk-text-xs--line-height:calc(1 / .75);--clcosdk-text-sm:.875rem;--clcosdk-text-sm--line-height:calc(1.25 / .875);--clcosdk-text-base:1rem;--clcosdk-text-base--line-height:calc(1.5 / 1);--clcosdk-text-lg:1.125rem;--clcosdk-text-lg--line-height:calc(1.75 / 1.125);--clcosdk-font-weight-normal:400;--clcosdk-font-weight-medium:500;--clcosdk-font-weight-semibold:600;--clcosdk-radius-md:.375rem;--clcosdk-radius-lg:.5rem;--clcosdk-radius-xl:.75rem;--clcosdk-radius-2xl:1rem;--clcosdk-ease-out:cubic-bezier(0, 0, .2, 1);--clcosdk-ease-in-out:cubic-bezier(.4, 0, .2, 1);--clcosdk-animate-spin:spin 1s linear infinite;--clcosdk-animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--clcosdk-color-brand-primary:var(--color-brand-primary)}}@layer base{.clco-sdk-root{--color-brand-primary:#171717;--color-brand-primary-hover:#000;--color-brand-primary-active:#262626;--color-accent:#2b3a67;--color-accent-hover:#243057;--color-accent-active:#1d2647;--color-accent-focus:#c7d2fe;--color-accent-subtle:#eef1f8;--color-text-primary:#171717;--color-text-secondary:#8c8c8c;--color-text-disabled:#d1d1d1;--color-text-inverse:#fff;--color-background:#fff;--color-surface:#fafafa;--color-section:#f3f3f3;--color-border:#e5e5e5;--color-divider:#ececec;--color-overlay:#00000080;--color-positive:#15803d;--color-positive-subtle:#dcfce7;--color-negative:#dc2626;--color-negative-subtle:#fee2e2;--color-success:#2c8c5e;--color-success-subtle:#e6f4ec;--color-success-border:#cfe9db;--color-warning:#e08a1a;--color-warning-subtle:#fff7ed;--color-warning-border:#fdead7;--color-error:#b42318;--color-error-subtle:#feeceb;--color-error-border:#fbd5d2;--shadow-step-active:0px 0px 10px 0px #0000001a;--shadow-dialog:0px 8px 32px 0px #0000001a;--btn-primary-gradient:linear-gradient(180deg, #262626 0%, #1c1c1c 50%, #0f0f0f 100%);--btn-primary-shadow:inset 0px -1px 3px 0px #00000059, inset 0px 1px 2px 0px #ffffff2e, inset 0px 1px 0px 0px #ffffff1a;--sale-card-surface:linear-gradient(to top, #0a0a0a 0%, #1a1a1a 100%);--color-sale-card-text:#f4f4f5;--color-sale-card-text-muted:#a1a1aa;--color-sale-card-text-strong:#fff;--color-sale-card-border:#ffffff40;--color-sale-card-chrome-border:#ffffff4d;--color-sale-card-chrome-bg:#ffffff26;--color-sale-card-chrome-emphasis-border:#fff6;--color-sale-card-chrome-emphasis-bg:#ffffff40;--color-sale-card-focus-ring:#ffffff80}@media (prefers-color-scheme:dark){.clco-sdk-root:not(:where(.light,.light *)){--color-brand-primary:#f4f4f5;--color-brand-primary-hover:#fff;--color-brand-primary-active:#e4e4e7;--color-accent:#6f82c9;--color-accent-hover:#8799e4;--color-accent-active:#5b6fcf;--color-accent-focus:#6f82c959;--color-accent-subtle:#6f82c91f;--color-text-primary:#f4f4f5;--color-text-secondary:#a1a1aa;--color-text-disabled:#71717a;--color-text-inverse:#171717;--color-background:#0f1115;--color-surface:#161a20;--color-section:#20242c;--color-border:#2a2e35;--color-divider:#323741;--color-overlay:#000000b3;--color-positive:#22c55e;--color-positive-subtle:#22c55e1f;--color-negative:#ef4444;--color-negative-subtle:#ef44441f;--color-success:#34d399;--color-success-subtle:#34d3991f;--color-success-border:#34d39940;--color-warning:#f59e0b;--color-warning-subtle:#f59e0b1f;--color-warning-border:#f59e0b40;--color-error:#f87171;--color-error-subtle:#f871711f;--color-error-border:#f8717140;--shadow-step-active:0px 0px 10px 0px #00000080;--shadow-dialog:0px 8px 32px 0px #0009;--btn-primary-gradient:linear-gradient(180deg, #fafafa 0%, #f0f0f0 50%, #e4e4e7 100%);--btn-primary-shadow:inset 0px -1px 3px 0px #0000001f, inset 0px 1px 2px 0px #fff9, inset 0px 1px 0px 0px #fff6}}:where(.dark,.dark *) .clco-sdk-root{--color-brand-primary:#f4f4f5;--color-brand-primary-hover:#fff;--color-brand-primary-active:#e4e4e7;--color-accent:#6f82c9;--color-accent-hover:#8799e4;--color-accent-active:#5b6fcf;--color-accent-focus:#6f82c959;--color-accent-subtle:#6f82c91f;--color-text-primary:#f4f4f5;--color-text-secondary:#a1a1aa;--color-text-disabled:#71717a;--color-text-inverse:#171717;--color-background:#0f1115;--color-surface:#161a20;--color-section:#20242c;--color-border:#2a2e35;--color-divider:#323741;--color-overlay:#000000b3;--color-positive:#22c55e;--color-positive-subtle:#22c55e1f;--color-negative:#ef4444;--color-negative-subtle:#ef44441f;--color-success:#34d399;--color-success-subtle:#34d3991f;--color-success-border:#34d39940;--color-warning:#f59e0b;--color-warning-subtle:#f59e0b1f;--color-warning-border:#f59e0b40;--color-error:#f87171;--color-error-subtle:#f871711f;--color-error-border:#f8717140;--shadow-step-active:0px 0px 10px 0px #00000080;--shadow-dialog:0px 8px 32px 0px #0009;--btn-primary-gradient:linear-gradient(180deg, #fafafa 0%, #f0f0f0 50%, #e4e4e7 100%);--btn-primary-shadow:inset 0px -1px 3px 0px #0000001f, inset 0px 1px 2px 0px #fff9, inset 0px 1px 0px 0px #fff6}.clco-sdk-root{color:var(--color-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.clco-sdk-root *,.clco-sdk-root :before,.clco-sdk-root :after{box-sizing:border-box}.clco-sdk-root button{appearance:none;cursor:pointer;font:inherit;color:inherit;background:0 0;border:none;padding:0}.clco-sdk-root input,.clco-sdk-root textarea,.clco-sdk-root select{font:inherit;color:inherit;background:0 0;border:none;border-radius:0;padding:0}.clco-sdk-root a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}.clco-sdk-root ul,.clco-sdk-root ol{margin:0;padding:0;list-style:none}.clco-sdk-root h1,.clco-sdk-root h2,.clco-sdk-root h3,.clco-sdk-root h4,.clco-sdk-root h5,.clco-sdk-root h6,.clco-sdk-root p,.clco-sdk-root figure,.clco-sdk-root blockquote,.clco-sdk-root dl,.clco-sdk-root dd,.clco-sdk-root pre{margin:0}.clco-sdk-root img,.clco-sdk-root svg{max-width:100%;display:block}@keyframes clco-status-ping{0%{opacity:.7;transform:scale(1)}75%,to{opacity:0;transform:scale(3.25)}}.clco-sdk-root .clcosdk-status-dot-ping{animation:1.6s cubic-bezier(0,0,.2,1) infinite clco-status-ping}@media (prefers-reduced-motion:reduce){.clco-sdk-root .clcosdk-status-dot-ping{opacity:0;animation:none}}}@layer components;@layer utilities{.clcosdk\\:pointer-events-none{pointer-events:none}.clcosdk\\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.clcosdk\\:absolute{position:absolute}.clcosdk\\:fixed{position:fixed}.clcosdk\\:relative{position:relative}.clcosdk\\:inset-0{inset:0}.clcosdk\\:top-1\\/2{top:50%}.clcosdk\\:top-4{top:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:top-full{top:100%}.clcosdk\\:-right-0\\.5{right:calc(var(--clcosdk-spacing) * -.5)}.clcosdk\\:right-4{right:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:right-\\[-14\\%\\]{right:-14%}.clcosdk\\:-bottom-0\\.5{bottom:calc(var(--clcosdk-spacing) * -.5)}.clcosdk\\:bottom-full{bottom:100%}.clcosdk\\:left-1\\/2{left:50%}.clcosdk\\:z-0{z-index:0}.clcosdk\\:z-10{z-index:10}.clcosdk\\:z-50{z-index:50}.clcosdk\\:order-1{order:1}.clcosdk\\:order-2{order:2}.clcosdk\\:mt-2{margin-top:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:mt-4{margin-top:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:mt-auto{margin-top:auto}.clcosdk\\:mb-2{margin-bottom:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:flex{display:flex}.clcosdk\\:grid{display:grid}.clcosdk\\:inline-flex{display:inline-flex}.clcosdk\\:size-2{width:calc(var(--clcosdk-spacing) * 2);height:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:size-3{width:calc(var(--clcosdk-spacing) * 3);height:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:size-3\\.5{width:calc(var(--clcosdk-spacing) * 3.5);height:calc(var(--clcosdk-spacing) * 3.5)}.clcosdk\\:size-4{width:calc(var(--clcosdk-spacing) * 4);height:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:size-5{width:calc(var(--clcosdk-spacing) * 5);height:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:size-10{width:calc(var(--clcosdk-spacing) * 10);height:calc(var(--clcosdk-spacing) * 10)}.clcosdk\\:size-16{width:calc(var(--clcosdk-spacing) * 16);height:calc(var(--clcosdk-spacing) * 16)}.clcosdk\\:size-24{width:calc(var(--clcosdk-spacing) * 24);height:calc(var(--clcosdk-spacing) * 24)}.clcosdk\\:size-\\[15rem\\]{width:15rem;height:15rem}.clcosdk\\:size-full{width:100%;height:100%}.clcosdk\\:h-1{height:var(--clcosdk-spacing)}.clcosdk\\:h-3{height:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:h-4{height:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:h-5{height:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:h-6{height:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:h-8{height:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:h-9{height:calc(var(--clcosdk-spacing) * 9)}.clcosdk\\:h-10{height:calc(var(--clcosdk-spacing) * 10)}.clcosdk\\:h-11{height:calc(var(--clcosdk-spacing) * 11)}.clcosdk\\:h-12{height:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:h-14{height:calc(var(--clcosdk-spacing) * 14)}.clcosdk\\:h-\\[18px\\]{height:18px}.clcosdk\\:h-\\[54px\\]{height:54px}.clcosdk\\:h-\\[71px\\]{height:71px}.clcosdk\\:h-auto{height:auto}.clcosdk\\:h-full{height:100%}.clcosdk\\:h-px{height:1px}.clcosdk\\:max-h-\\[92vh\\]{max-height:92vh}.clcosdk\\:max-h-full{max-height:100%}.clcosdk\\:min-h-0{min-height:0}.clcosdk\\:min-h-9{min-height:calc(var(--clcosdk-spacing) * 9)}.clcosdk\\:min-h-40{min-height:calc(var(--clcosdk-spacing) * 40)}.clcosdk\\:min-h-screen{min-height:100vh}.clcosdk\\:w-1{width:var(--clcosdk-spacing)}.clcosdk\\:w-4{width:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:w-5{width:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:w-6{width:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:w-8{width:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:w-10{width:calc(var(--clcosdk-spacing) * 10)}.clcosdk\\:w-12{width:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:w-16{width:calc(var(--clcosdk-spacing) * 16)}.clcosdk\\:w-20{width:calc(var(--clcosdk-spacing) * 20)}.clcosdk\\:w-24{width:calc(var(--clcosdk-spacing) * 24)}.clcosdk\\:w-28{width:calc(var(--clcosdk-spacing) * 28)}.clcosdk\\:w-32{width:calc(var(--clcosdk-spacing) * 32)}.clcosdk\\:w-40{width:calc(var(--clcosdk-spacing) * 40)}.clcosdk\\:w-48{width:calc(var(--clcosdk-spacing) * 48)}.clcosdk\\:w-80{width:calc(var(--clcosdk-spacing) * 80)}.clcosdk\\:w-96{width:calc(var(--clcosdk-spacing) * 96)}.clcosdk\\:w-\\[16px\\]{width:16px}.clcosdk\\:w-\\[28rem\\]{width:28rem}.clcosdk\\:w-\\[448px\\]{width:448px}.clcosdk\\:w-auto{width:auto}.clcosdk\\:w-component{width:448px}.clcosdk\\:w-fit{width:fit-content}.clcosdk\\:w-full{width:100%}.clcosdk\\:w-max{width:max-content}.clcosdk\\:max-w-\\[16rem\\]{max-width:16rem}.clcosdk\\:max-w-\\[28rem\\]{max-width:28rem}.clcosdk\\:max-w-\\[30rem\\]{max-width:30rem}.clcosdk\\:max-w-\\[40rem\\]{max-width:40rem}.clcosdk\\:max-w-\\[56rem\\]{max-width:56rem}.clcosdk\\:max-w-\\[64rem\\]{max-width:64rem}.clcosdk\\:max-w-\\[760px\\]{max-width:760px}.clcosdk\\:max-w-full{max-width:100%}.clcosdk\\:max-w-md{max-width:var(--clcosdk-container-md)}.clcosdk\\:max-w-sm{max-width:var(--clcosdk-container-sm)}.clcosdk\\:max-w-xl{max-width:var(--clcosdk-container-xl)}.clcosdk\\:min-w-0{min-width:0}.clcosdk\\:flex-1{flex:1}.clcosdk\\:shrink-0{flex-shrink:0}.clcosdk\\:-translate-x-1\\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.clcosdk\\:-translate-y-1\\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.clcosdk\\:rotate-90{rotate:90deg}.clcosdk\\:rotate-180{rotate:180deg}.clcosdk\\:animate-pulse{animation:var(--clcosdk-animate-pulse)}.clcosdk\\:animate-spin{animation:var(--clcosdk-animate-spin)}.clcosdk\\:cursor-pointer{cursor:pointer}.clcosdk\\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.clcosdk\\:grid-rows-\\[0fr\\]{grid-template-rows:0fr}.clcosdk\\:grid-rows-\\[1fr\\]{grid-template-rows:1fr}.clcosdk\\:flex-col{flex-direction:column}.clcosdk\\:flex-wrap{flex-wrap:wrap}.clcosdk\\:items-center{align-items:center}.clcosdk\\:items-end{align-items:flex-end}.clcosdk\\:items-start{align-items:flex-start}.clcosdk\\:justify-between{justify-content:space-between}.clcosdk\\:justify-center{justify-content:center}.clcosdk\\:justify-end{justify-content:flex-end}.clcosdk\\:gap-1{gap:var(--clcosdk-spacing)}.clcosdk\\:gap-1\\.5{gap:calc(var(--clcosdk-spacing) * 1.5)}.clcosdk\\:gap-2{gap:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:gap-2\\.5{gap:calc(var(--clcosdk-spacing) * 2.5)}.clcosdk\\:gap-3{gap:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:gap-4{gap:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:gap-6{gap:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:gap-\\[5px\\]{gap:5px}:where(.clcosdk\\:space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--clcosdk-spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--clcosdk-spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.clcosdk\\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--clcosdk-spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--clcosdk-spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.clcosdk\\:divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.clcosdk\\:divide-border>:not(:last-child)){border-color:var(--color-border)}:where(.clcosdk\\:divide-divider>:not(:last-child)){border-color:var(--color-divider)}.clcosdk\\:self-start{align-self:flex-start}.clcosdk\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.clcosdk\\:overflow-hidden{overflow:hidden}.clcosdk\\:overflow-y-auto{overflow-y:auto}.clcosdk\\:rounded{border-radius:.25rem}.clcosdk\\:rounded-2xl{border-radius:var(--clcosdk-radius-2xl)}.clcosdk\\:rounded-\\[20px\\]{border-radius:20px}.clcosdk\\:rounded-\\[28px\\]{border-radius:28px}.clcosdk\\:rounded-btn{border-radius:12px}.clcosdk\\:rounded-card{border-radius:24px}.clcosdk\\:rounded-full{border-radius:3.40282e38px}.clcosdk\\:rounded-lg{border-radius:var(--clcosdk-radius-lg)}.clcosdk\\:rounded-md{border-radius:var(--clcosdk-radius-md)}.clcosdk\\:rounded-xl{border-radius:var(--clcosdk-radius-xl)}.clcosdk\\:border{border-style:var(--tw-border-style);border-width:1px}.clcosdk\\:border-2{border-style:var(--tw-border-style);border-width:2px}.clcosdk\\:border-\\[1\\.5px\\]{border-style:var(--tw-border-style);border-width:1.5px}.clcosdk\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.clcosdk\\:border-accent\\/60{border-color:var(--color-accent)}@supports (color:color-mix(in lab, red, red)){.clcosdk\\:border-accent\\/60{border-color:color-mix(in oklab, var(--color-accent) 60%, transparent)}}.clcosdk\\:border-amber-500{border-color:var(--clcosdk-color-amber-500)}.clcosdk\\:border-background{border-color:var(--color-background)}.clcosdk\\:border-border{border-color:var(--color-border)}.clcosdk\\:border-brand-primary{border-color:var(--color-brand-primary)}.clcosdk\\:border-current{border-color:currentColor}.clcosdk\\:border-divider{border-color:var(--color-divider)}.clcosdk\\:border-error-border{border-color:var(--color-error-border)}.clcosdk\\:border-sale-card-border{border-color:var(--color-sale-card-border)}.clcosdk\\:border-sale-card-chrome-border{border-color:var(--color-sale-card-chrome-border)}.clcosdk\\:border-success-border{border-color:var(--color-success-border)}.clcosdk\\:border-warning-border{border-color:var(--color-warning-border)}.clcosdk\\:border-t-transparent{border-top-color:#0000}.clcosdk\\:bg-background{background-color:var(--color-background)}.clcosdk\\:bg-black\\/50{background-color:var(--clcosdk-color-black)}@supports (color:color-mix(in lab, red, red)){.clcosdk\\:bg-black\\/50{background-color:color-mix(in oklab, var(--clcosdk-color-black) 50%, transparent)}}.clcosdk\\:bg-brand-primary{background-color:var(--color-brand-primary)}.clcosdk\\:bg-divider{background-color:var(--color-divider)}.clcosdk\\:bg-error-subtle{background-color:var(--color-error-subtle)}.clcosdk\\:bg-overlay{background-color:var(--color-overlay)}.clcosdk\\:bg-positive{background-color:var(--color-positive)}.clcosdk\\:bg-positive-subtle{background-color:var(--color-positive-subtle)}.clcosdk\\:bg-sale-card-chrome-bg{background-color:var(--color-sale-card-chrome-bg)}.clcosdk\\:bg-section{background-color:var(--color-section)}.clcosdk\\:bg-success-subtle{background-color:var(--color-success-subtle)}.clcosdk\\:bg-surface{background-color:var(--color-surface)}.clcosdk\\:bg-text-disabled{background-color:var(--color-text-disabled)}.clcosdk\\:bg-text-primary{background-color:var(--color-text-primary)}.clcosdk\\:bg-transparent{background-color:#0000}.clcosdk\\:bg-warning-subtle{background-color:var(--color-warning-subtle)}.clcosdk\\:bg-\\[image\\:var\\(--btn-primary-gradient\\)\\]{background-image:var(--btn-primary-gradient)}.clcosdk\\:bg-\\[image\\:var\\(--sale-card-surface\\)\\]{background-image:var(--sale-card-surface)}.clcosdk\\:object-contain{object-fit:contain}.clcosdk\\:object-cover{object-fit:cover}.clcosdk\\:p-0{padding:0}.clcosdk\\:p-1\\.5{padding:calc(var(--clcosdk-spacing) * 1.5)}.clcosdk\\:p-3{padding:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:p-3\\.5{padding:calc(var(--clcosdk-spacing) * 3.5)}.clcosdk\\:p-4{padding:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:p-5{padding:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:p-6{padding:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:p-8{padding:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:p-16{padding:calc(var(--clcosdk-spacing) * 16)}.clcosdk\\:px-2{padding-inline:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:px-3{padding-inline:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:px-4{padding-inline:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:px-5{padding-inline:calc(var(--clcosdk-spacing) * 5)}.clcosdk\\:px-6{padding-inline:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:py-1\\.5{padding-block:calc(var(--clcosdk-spacing) * 1.5)}.clcosdk\\:py-2{padding-block:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:py-3{padding-block:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:py-8{padding-block:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:py-12{padding-block:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:pt-1{padding-top:var(--clcosdk-spacing)}.clcosdk\\:pt-4{padding-top:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:pt-14{padding-top:calc(var(--clcosdk-spacing) * 14)}.clcosdk\\:pr-1\\.5{padding-right:calc(var(--clcosdk-spacing) * 1.5)}.clcosdk\\:pr-3{padding-right:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:pr-4{padding-right:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:pb-4{padding-bottom:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:pl-3{padding-left:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:text-center{text-align:center}.clcosdk\\:text-left{text-align:left}.clcosdk\\:text-right{text-align:right}.clcosdk\\:font-mono{font-family:var(--clcosdk-font-mono)}.clcosdk\\:text-base{font-size:var(--clcosdk-text-base);line-height:var(--tw-leading,var(--clcosdk-text-base--line-height))}.clcosdk\\:text-lg{font-size:var(--clcosdk-text-lg);line-height:var(--tw-leading,var(--clcosdk-text-lg--line-height))}.clcosdk\\:text-sm{font-size:var(--clcosdk-text-sm);line-height:var(--tw-leading,var(--clcosdk-text-sm--line-height))}.clcosdk\\:text-xs{font-size:var(--clcosdk-text-xs);line-height:var(--tw-leading,var(--clcosdk-text-xs--line-height))}.clcosdk\\:text-\\[11px\\]{font-size:11px}.clcosdk\\:text-\\[12px\\]{font-size:12px}.clcosdk\\:text-\\[13px\\]{font-size:13px}.clcosdk\\:text-\\[14px\\]{font-size:14px}.clcosdk\\:text-\\[15px\\]{font-size:15px}.clcosdk\\:text-\\[16px\\]{font-size:16px}.clcosdk\\:text-\\[18px\\]{font-size:18px}.clcosdk\\:text-\\[22px\\]{font-size:22px}.clcosdk\\:text-\\[28px\\]{font-size:28px}.clcosdk\\:text-\\[36px\\]{font-size:36px}.clcosdk\\:text-\\[48px\\]{font-size:48px}.clcosdk\\:text-\\[64px\\]{font-size:64px}.clcosdk\\:leading-\\[105\\%\\]{--tw-leading:105%;line-height:105%}.clcosdk\\:leading-\\[108\\%\\]{--tw-leading:108%;line-height:108%}.clcosdk\\:leading-\\[110\\%\\]{--tw-leading:110%;line-height:110%}.clcosdk\\:leading-\\[120\\%\\]{--tw-leading:120%;line-height:120%}.clcosdk\\:leading-\\[130\\%\\]{--tw-leading:130%;line-height:130%}.clcosdk\\:leading-\\[140\\%\\]{--tw-leading:140%;line-height:140%}.clcosdk\\:leading-\\[150\\%\\]{--tw-leading:150%;line-height:150%}.clcosdk\\:leading-\\[160\\%\\]{--tw-leading:160%;line-height:160%}.clcosdk\\:font-medium{--tw-font-weight:var(--clcosdk-font-weight-medium);font-weight:var(--clcosdk-font-weight-medium)}.clcosdk\\:font-normal{--tw-font-weight:var(--clcosdk-font-weight-normal);font-weight:var(--clcosdk-font-weight-normal)}.clcosdk\\:font-semibold{--tw-font-weight:var(--clcosdk-font-weight-semibold);font-weight:var(--clcosdk-font-weight-semibold)}.clcosdk\\:tracking-\\[0\\.12px\\]{--tw-tracking:.12px;letter-spacing:.12px}.clcosdk\\:tracking-\\[0\\.28px\\]{--tw-tracking:.28px;letter-spacing:.28px}.clcosdk\\:break-words{overflow-wrap:break-word}.clcosdk\\:whitespace-nowrap{white-space:nowrap}.clcosdk\\:text-background{color:var(--color-background)}.clcosdk\\:text-brand-primary{color:var(--color-brand-primary)}.clcosdk\\:text-error{color:var(--color-error)}.clcosdk\\:text-positive{color:var(--color-positive)}.clcosdk\\:text-sale-card-text{color:var(--color-sale-card-text)}.clcosdk\\:text-sale-card-text-muted{color:var(--color-sale-card-text-muted)}.clcosdk\\:text-sale-card-text-strong{color:var(--color-sale-card-text-strong)}.clcosdk\\:text-success{color:var(--color-success)}.clcosdk\\:text-text-disabled{color:var(--color-text-disabled)}.clcosdk\\:text-text-inverse{color:var(--color-text-inverse)}.clcosdk\\:text-text-primary{color:var(--color-text-primary)}.clcosdk\\:text-text-secondary{color:var(--color-text-secondary)}.clcosdk\\:text-warning{color:var(--color-warning)}.clcosdk\\:capitalize{text-transform:capitalize}.clcosdk\\:lining-nums{--tw-numeric-figure:lining-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.clcosdk\\:tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.clcosdk\\:no-underline{text-decoration-line:none}.clcosdk\\:underline{text-decoration-line:underline}.clcosdk\\:underline-offset-2{text-underline-offset:2px}.clcosdk\\:underline-offset-4{text-underline-offset:4px}.clcosdk\\:opacity-0{opacity:0}.clcosdk\\:opacity-60{opacity:.6}.clcosdk\\:shadow-\\[0_0_0_3px_rgba\\(59\\,130\\,246\\,0\\.2\\)\\]{--tw-shadow:0 0 0 3px var(--tw-shadow-color,#3b82f633);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-\\[0px_1px_1px_0px_rgba\\(10\\,10\\,10\\,0\\.04\\)\\,0px_8px_12px_0px_rgba\\(10\\,10\\,10\\,0\\.08\\)\\]{--tw-shadow:0px 1px 1px 0px var(--tw-shadow-color,#0a0a0a0a), 0px 8px 12px 0px var(--tw-shadow-color,#0a0a0a14);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-\\[0px_4px_12px_0px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\,0px_12px_28px_0px_rgba\\(0\\,0\\,0\\,0\\.13\\)\\]{--tw-shadow:0px 4px 12px 0px var(--tw-shadow-color,#00000014), 0px 12px 28px 0px var(--tw-shadow-color,#00000021);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-\\[var\\(--btn-primary-shadow\\)\\]{--tw-shadow:var(--btn-primary-shadow);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-card{--tw-shadow:0px 4px 6px -2px var(--tw-shadow-color,#0000000d), 0px 12px 24px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-dialog{--tw-shadow:var(--shadow-dialog);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:shadow-step-active{--tw-shadow:var(--shadow-step-active);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:transition-\\[background-color\\,border-color\\]{transition-property:background-color,border-color;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:transition-\\[grid-template-rows\\]{transition-property:grid-template-rows;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.clcosdk\\:duration-200{--tw-duration:.2s;transition-duration:.2s}.clcosdk\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.clcosdk\\:duration-500{--tw-duration:.5s;transition-duration:.5s}.clcosdk\\:ease-in-out{--tw-ease:var(--clcosdk-ease-in-out);transition-timing-function:var(--clcosdk-ease-in-out)}.clcosdk\\:ease-out{--tw-ease:var(--clcosdk-ease-out);transition-timing-function:var(--clcosdk-ease-out)}.clcosdk\\:outline-none{--tw-outline-style:none;outline-style:none}.clcosdk\\:group-focus-within\\:opacity-100:is(:where(.clcosdk\\:group):focus-within *){opacity:1}@media (hover:hover){.clcosdk\\:group-hover\\:border-sale-card-chrome-emphasis-border:is(:where(.clcosdk\\:group):hover *){border-color:var(--color-sale-card-chrome-emphasis-border)}.clcosdk\\:group-hover\\:bg-sale-card-chrome-emphasis-bg:is(:where(.clcosdk\\:group):hover *){background-color:var(--color-sale-card-chrome-emphasis-bg)}.clcosdk\\:group-hover\\:opacity-100:is(:where(.clcosdk\\:group):hover *){opacity:1}}.clcosdk\\:group-focus-visible\\:border-sale-card-chrome-emphasis-border:is(:where(.clcosdk\\:group):focus-visible *){border-color:var(--color-sale-card-chrome-emphasis-border)}.clcosdk\\:group-focus-visible\\:bg-sale-card-chrome-emphasis-bg:is(:where(.clcosdk\\:group):focus-visible *){background-color:var(--color-sale-card-chrome-emphasis-bg)}.clcosdk\\:placeholder\\:text-text-disabled::placeholder{color:var(--color-text-disabled)}@media (hover:hover){.clcosdk\\:hover\\:scale-\\[1\\.02\\]:hover{scale:1.02}.clcosdk\\:hover\\:border-text-disabled:hover{border-color:var(--color-text-disabled)}.clcosdk\\:hover\\:bg-\\[\\#fcdcd8\\]:hover{background-color:#fcdcd8}.clcosdk\\:hover\\:bg-border:hover{background-color:var(--color-border)}.clcosdk\\:hover\\:bg-brand-primary:hover{background-color:var(--color-brand-primary)}.clcosdk\\:hover\\:bg-brand-primary-hover:hover{background-color:var(--color-brand-primary-hover)}.clcosdk\\:hover\\:bg-section:hover{background-color:var(--color-section)}.clcosdk\\:hover\\:bg-surface:hover{background-color:var(--color-surface)}.clcosdk\\:hover\\:text-\\[\\#8b1a13\\]:hover{color:#8b1a13}.clcosdk\\:hover\\:text-text-primary:hover{color:var(--color-text-primary)}.clcosdk\\:hover\\:underline:hover{text-decoration-line:underline}.clcosdk\\:hover\\:opacity-80:hover{opacity:.8}.clcosdk\\:hover\\:opacity-90:hover{opacity:.9}}.clcosdk\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.clcosdk\\:focus-visible\\:ring-gray-400:focus-visible{--tw-ring-color:var(--clcosdk-color-gray-400)}.clcosdk\\:focus-visible\\:ring-gray-500:focus-visible{--tw-ring-color:var(--clcosdk-color-gray-500)}.clcosdk\\:focus-visible\\:ring-red-400:focus-visible{--tw-ring-color:var(--clcosdk-color-red-400)}.clcosdk\\:focus-visible\\:ring-red-500:focus-visible{--tw-ring-color:var(--clcosdk-color-red-500)}.clcosdk\\:focus-visible\\:ring-sale-card-focus-ring:focus-visible{--tw-ring-color:var(--color-sale-card-focus-ring)}.clcosdk\\:focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.clcosdk\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.clcosdk\\:active\\:bg-\\[\\#d9d9d9\\]:active{background-color:#d9d9d9}.clcosdk\\:active\\:bg-\\[\\#f9c9c4\\]:active{background-color:#f9c9c4}.clcosdk\\:active\\:bg-border:active{background-color:var(--color-border)}.clcosdk\\:active\\:bg-brand-primary-active:active{background-color:var(--color-brand-primary-active)}.clcosdk\\:active\\:text-\\[\\#6d1510\\]:active{color:#6d1510}.clcosdk\\:active\\:opacity-80:active{opacity:.8}.clcosdk\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.clcosdk\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.clcosdk\\:disabled\\:opacity-40:disabled{opacity:.4}.clcosdk\\:disabled\\:opacity-50:disabled{opacity:.5}.clcosdk\\:aria-disabled\\:cursor-not-allowed[aria-disabled=true]{cursor:not-allowed}.clcosdk\\:aria-disabled\\:opacity-50[aria-disabled=true]{opacity:.5}@media not all and (min-width:48rem){.clcosdk\\:max-md\\:hidden{display:none}.clcosdk\\:max-md\\:w-full{width:100%}.clcosdk\\:max-md\\:justify-start{justify-content:flex-start}.clcosdk\\:max-md\\:gap-4{gap:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:max-md\\:rounded-none{border-radius:0}.clcosdk\\:max-md\\:border-0{border-style:var(--tw-border-style);border-width:0}.clcosdk\\:max-md\\:bg-transparent{background-color:#0000}.clcosdk\\:max-md\\:p-0{padding:0}@media (hover:hover){.clcosdk\\:max-md\\:hover\\:scale-100:hover{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}}}@media (min-width:40rem){.clcosdk\\:sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:48rem){.clcosdk\\:md\\:right-\\[-10\\%\\]{right:-10%}.clcosdk\\:md\\:order-1{order:1}.clcosdk\\:md\\:order-2{order:2}.clcosdk\\:md\\:hidden{display:none}.clcosdk\\:md\\:size-\\[20rem\\]{width:20rem;height:20rem}.clcosdk\\:md\\:h-9{height:calc(var(--clcosdk-spacing) * 9)}.clcosdk\\:md\\:h-12{height:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:md\\:h-\\[54px\\]{height:54px}.clcosdk\\:md\\:w-9{width:calc(var(--clcosdk-spacing) * 9)}.clcosdk\\:md\\:w-12{width:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.clcosdk\\:md\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.clcosdk\\:md\\:grid-cols-\\[minmax\\(0\\,11fr\\)_minmax\\(0\\,8fr\\)\\]{grid-template-columns:minmax(0,11fr) minmax(0,8fr)}.clcosdk\\:md\\:flex-row{flex-direction:row}.clcosdk\\:md\\:items-center{align-items:center}.clcosdk\\:md\\:items-end{align-items:flex-end}.clcosdk\\:md\\:justify-between{justify-content:space-between}.clcosdk\\:md\\:justify-end{justify-content:flex-end}.clcosdk\\:md\\:gap-3{gap:calc(var(--clcosdk-spacing) * 3)}.clcosdk\\:md\\:gap-6{gap:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:md\\:gap-x-12{column-gap:calc(var(--clcosdk-spacing) * 12)}.clcosdk\\:md\\:self-end{align-self:flex-end}.clcosdk\\:md\\:rounded-\\[40px\\]{border-radius:40px}.clcosdk\\:md\\:rounded-card{border-radius:24px}.clcosdk\\:md\\:rounded-dialog{border-radius:32px}.clcosdk\\:md\\:p-4{padding:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:md\\:p-6{padding:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:md\\:p-8{padding:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:md\\:px-6{padding-inline:calc(var(--clcosdk-spacing) * 6)}.clcosdk\\:md\\:px-8{padding-inline:calc(var(--clcosdk-spacing) * 8)}.clcosdk\\:md\\:py-2{padding-block:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:md\\:pr-2{padding-right:calc(var(--clcosdk-spacing) * 2)}.clcosdk\\:md\\:pr-4{padding-right:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:md\\:pl-4{padding-left:calc(var(--clcosdk-spacing) * 4)}.clcosdk\\:md\\:text-base{font-size:var(--clcosdk-text-base);line-height:var(--tw-leading,var(--clcosdk-text-base--line-height))}.clcosdk\\:md\\:text-\\[14px\\]{font-size:14px}.clcosdk\\:md\\:text-\\[16px\\]{font-size:16px}.clcosdk\\:md\\:text-\\[18px\\]{font-size:18px}.clcosdk\\:md\\:text-\\[28px\\]{font-size:28px}.clcosdk\\:md\\:leading-\\[120\\%\\]{--tw-leading:120%;line-height:120%}.clcosdk\\:md\\:leading-\\[160\\%\\]{--tw-leading:160%;line-height:160%}}@media (prefers-color-scheme:dark){@media (hover:hover){.clcosdk\\:dark\\:hover\\:bg-\\[rgba\\(248\\,113\\,113\\,0\\.20\\)\\]:not(:where(.light,.light *)):hover{background-color:#f8717133}}}@media (hover:hover){.clcosdk\\:dark\\:hover\\:bg-\\[rgba\\(248\\,113\\,113\\,0\\.20\\)\\]:where(.dark,.dark *):hover{background-color:#f8717133}}@media (prefers-color-scheme:dark){@media (hover:hover){.clcosdk\\:dark\\:hover\\:text-\\[\\#fca5a5\\]:not(:where(.light,.light *)):hover{color:#fca5a5}}}@media (hover:hover){.clcosdk\\:dark\\:hover\\:text-\\[\\#fca5a5\\]:where(.dark,.dark *):hover{color:#fca5a5}}@media (prefers-color-scheme:dark){.clcosdk\\:dark\\:active\\:bg-\\[rgba\\(248\\,113\\,113\\,0\\.30\\)\\]:not(:where(.light,.light *)):active{background-color:#f871714d}}.clcosdk\\:dark\\:active\\:bg-\\[rgba\\(248\\,113\\,113\\,0\\.30\\)\\]:where(.dark,.dark *):active{background-color:#f871714d}@media (prefers-color-scheme:dark){.clcosdk\\:dark\\:active\\:bg-divider:not(:where(.light,.light *)):active{background-color:var(--color-divider)}}.clcosdk\\:dark\\:active\\:bg-divider:where(.dark,.dark *):active{background-color:var(--color-divider)}@media (prefers-color-scheme:dark){.clcosdk\\:dark\\:active\\:text-\\[\\#f87171\\]:not(:where(.light,.light *)):active{color:#f87171}}.clcosdk\\:dark\\:active\\:text-\\[\\#f87171\\]:where(.dark,.dark *):active{color:#f87171}.clcosdk\\:\\[\\&_circle\\]\\:fill-error-subtle circle{fill:var(--color-error-subtle)}.clcosdk\\:\\[\\&_circle\\]\\:fill-success-subtle circle{fill:var(--color-success-subtle)}.clcosdk\\:\\[\\&_circle\\]\\:fill-warning-subtle circle{fill:var(--color-warning-subtle)}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}';
 
 // src/client/CoinListStyleScope.tsx
 import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
@@ -1633,7 +1621,7 @@ function CoinListSignInCardContainer({
 }
 
 // src/client/components/checkout/CheckoutContainer.tsx
-import { useState as useState22 } from "react";
+import { useState as useState23 } from "react";
 
 // src/client/components/checkout/shared/amount/CheckoutAmountInput.tsx
 import { useId } from "react";
@@ -5431,7 +5419,7 @@ function ErrorView4({
 }
 
 // src/client/hooks/checkout/ondo/buy/useOndoBuyCheckoutViewModel.ts
-import { useState as useState10 } from "react";
+import { useState as useState11 } from "react";
 
 // src/client/hooks/checkout/ondo/buy/amount/useOndoBuyAmountViewModel.ts
 import { useEffect as useEffect4, useRef as useRef3, useState as useState4 } from "react";
@@ -5458,6 +5446,26 @@ function stablecoinIconUrl(symbol) {
 function offerIconUrl(offer) {
   return offer.logoUrl === "" ? null : AssetIconUrl(offer.logoUrl);
 }
+function tokenLogoUrl(logo, minWidth = 40) {
+  switch (logo.kind) {
+    case "VECTOR":
+      return AssetIconUrl(logo.url);
+    case "RASTER": {
+      const chosen = logo.variants.reduce(
+        (smallest, variant) => variant.width >= minWidth && (smallest === null || variant.width < smallest.width) ? variant : smallest,
+        null
+      );
+      return AssetIconUrl((chosen ?? logo.original).url);
+    }
+    default: {
+      const exhaustive = logo;
+      return exhaustive;
+    }
+  }
+}
+function offerAssetIconUrl(offer, tokenMetadata) {
+  return (tokenMetadata ? tokenLogoUrl(tokenMetadata.logo) : null) ?? offerIconUrl(offer);
+}
 
 // src/client/hooks/checkout/shared/checkout-ui.types.ts
 var CheckoutAssetUi = {
@@ -5466,10 +5474,10 @@ var CheckoutAssetUi = {
    * name and symbol, the caller supplies the chain it is being traded on and
    * whatever icon it has for it.
    *
-   * `iconUrl` is a caller's parameter rather than the token's own because a
-   * token does not carry one - the SDK ships no icon registry, and the only
-   * source is the offer being bought. Which is also why it defaults to `null`:
-   * the input asset a user pays with has no offer behind it.
+   * `iconUrl` is a caller's parameter rather than the token's own because an
+   * `Erc20Asset` does not carry one, and which source supplies it is the
+   * caller's to decide. Which is also why it defaults to `null`: the input
+   * asset a user pays with has no offer behind it.
    *
    * An asset sourced from the offer rather than from a token has its own
    * companion, {@link fromOffer}. One companion per source, not one per call
@@ -5486,7 +5494,7 @@ var CheckoutAssetUi = {
   }),
   /**
    * The view of the asset an offer sells: the offer supplies its name and the
-   * only icon the SDK has, the caller supplies the symbol and the chain.
+   * fallback artwork, the caller supplies the symbol and the chain.
    *
    * `symbol` is a parameter rather than `offer.asset.code` because the symbol a
    * provider trades under is the provider's, not the catalogue's - Ondo's
@@ -5494,14 +5502,26 @@ var CheckoutAssetUi = {
    * asset stands in. Keeping it out here is what lets one companion serve every
    * provider instead of forking per provider.
    *
+   * The icon is resolved from the public token registry when `tokenMetadata`
+   * carries a listed token — `useCheckoutOfferTokenMetadata` fetches it,
+   * keyed by the token `OfferDetail.tokens` lists for this chain — and falls
+   * back to the offer's own logo otherwise. `null` covers every way the
+   * registry answer can be absent (unlisted, not settled, lookup failed);
+   * which one it is stays the concern of the hook's state machine, not of
+   * this model, because the icon is the same either way.
+   *
    * Deliberately no decimals. An offer names an asset; it does not answer for
    * the scale of any particular quantity, and every amount a checkout renders
    * arrives as a `BlockchainAmount` carrying its own.
    */
-  fromOffer: (offer, { symbol, networkName }) => ({
+  fromOffer: (offer, {
+    symbol,
+    networkName,
+    tokenMetadata
+  }) => ({
     name: offer.name,
     symbol,
-    iconUrl: offerIconUrl(offer),
+    iconUrl: offerAssetIconUrl(offer, tokenMetadata),
     network: { name: networkName, iconUrl: null }
   })
 };
@@ -5586,6 +5606,7 @@ function useOndoBuyAmountViewModel({
   stepInput,
   ondoSymbol,
   chain,
+  swapContracts,
   enabled = true,
   onComplete,
   onEdit
@@ -5690,6 +5711,7 @@ function useOndoBuyAmountViewModel({
       wallet: stepInput.wallet,
       symbol: ondoSymbol,
       chain,
+      swapContracts,
       // The input asset is USDC on every chain the SDK models (it is the
       // only member of `ONDO_SUPPORTED_INPUT_ASSETS`), and its registry
       // table is total, so the address is never null.
@@ -6020,6 +6042,7 @@ function useOndoBuyReviewViewModel({
   ondoSymbol,
   chain,
   offer,
+  outputTokenMetadata,
   enabled = true,
   onComplete
 }) {
@@ -6072,7 +6095,8 @@ function useOndoBuyReviewViewModel({
       type: "active",
       outputAsset: CheckoutAssetUi.fromOffer(offer, {
         symbol: ondoSymbol,
-        networkName: getNetworkName(chain)
+        networkName: getNetworkName(chain),
+        tokenMetadata: outputTokenMetadata
       }),
       outputAmount: assetAmount(
         formatAmount(built.receiveOutputAmount, locale),
@@ -6210,8 +6234,6 @@ function executionErrorMessage(error) {
   switch (error.step) {
     case "quote-expired":
       return "That quote expired. Get a new one to place your order.";
-    case "spender-mismatch":
-      return "This quote does not match the approval you gave. Get a new one.";
     case "swap":
       switch (error.cause.type) {
         case "user_rejected":
@@ -6405,6 +6427,7 @@ function useOndoSidebarViewModel({
   offer,
   ondoSymbol,
   chain,
+  tokenMetadata,
   priceState,
   tradingStatusState
 }) {
@@ -6412,7 +6435,8 @@ function useOndoSidebarViewModel({
   const state = {
     asset: CheckoutAssetUi.fromOffer(offer, {
       symbol: ondoSymbol,
-      networkName: getNetworkName(chain)
+      networkName: getNetworkName(chain),
+      tokenMetadata
     }),
     // No frontline endpoint carries any of these today, and the detail list
     // drops a null row rather than dashing it.
@@ -6602,6 +6626,99 @@ function toConfirmedWalletUi(wallets, wallet) {
   };
 }
 
+// src/client/hooks/shared/useTokenMetadata.ts
+import { useCallback as useCallback3, useEffect as useEffect10, useState as useState10 } from "react";
+var DISABLED_STATE = { type: "DISABLED" };
+var LOADING_STATE = { type: "LOADING" };
+function useTokenMetadata(options) {
+  const { chain, address, data, enabled = true } = options;
+  const { coinlist, isReady } = useCoinList();
+  const log = useLogger("useTokenMetadata");
+  const [state, setState] = useState10(
+    () => data !== void 0 ? { type: "CONTENT", tokenMetadata: data } : LOADING_STATE
+  );
+  const [refetchCount, setRefetchCount] = useState10(0);
+  const refetch = useCallback3(() => {
+    setRefetchCount((count) => count + 1);
+  }, []);
+  useEffect10(() => {
+    let isCancelled = false;
+    const seedActive = data !== void 0 && refetchCount === 0;
+    if (!isReady || !enabled || seedActive) {
+      return () => {
+        isCancelled = true;
+      };
+    }
+    setState(LOADING_STATE);
+    coinlist.tokens.get({ chain, address }).then((tokenMetadata) => {
+      if (!isCancelled) {
+        log.debug(() => ({
+          msg: "settled",
+          fields: {
+            state: "CONTENT",
+            listed: tokenMetadata !== null,
+            symbol: tokenMetadata?.symbol ?? null
+          }
+        }));
+        setState({ type: "CONTENT", tokenMetadata });
+      }
+    }).catch((error) => {
+      if (!isCancelled) {
+        log.failure(
+          () => ({
+            msg: "settled",
+            fields: { state: "ERROR", reason: "generic-error" }
+          }),
+          error
+        );
+        setState({ type: "ERROR", reason: "generic-error" });
+      }
+    });
+    return () => {
+      isCancelled = true;
+    };
+  }, [coinlist, isReady, enabled, chain, address, data, refetchCount, log]);
+  return {
+    // LOADING would be a lie while disabled: nothing is in flight and nothing
+    // will replace it. Settled states (a seed, a previous answer) survive.
+    state: !enabled && state.type === "LOADING" ? DISABLED_STATE : state,
+    refetch
+  };
+}
+
+// src/client/hooks/checkout/shared/data/useCheckoutOfferTokenMetadata.ts
+var NO_TOKEN_ADDRESS = EvmContractAddress(
+  "0x0000000000000000000000000000000000000000"
+);
+function offerTokenIdentifier(offer, chain) {
+  const byChain = offer.tokens.filter((token) => token.chain === chain);
+  const asset = byChain.find((token) => token.role === "swap") ?? byChain.find((token) => token.role === "distribution");
+  return asset === void 0 ? null : { chain, address: asset.address };
+}
+function tokenMetadataOf(state) {
+  return state.type === "CONTENT" ? state.tokenMetadata : null;
+}
+function useCheckoutOfferTokenMetadata({
+  offer,
+  chain,
+  data,
+  enabled = true
+}) {
+  const identifier = offerTokenIdentifier(offer, chain);
+  const { state } = useTokenMetadata({
+    // Primitive keys, not the identifier object: the underlying hook re-fetches
+    // only when `(chain, address)` changes, so a host that rebuilds the offer
+    // object per render does not refetch the registry per render.
+    chain: identifier?.chain ?? chain,
+    address: identifier?.address ?? NO_TOKEN_ADDRESS,
+    // Nothing to look up when the offer lists no token here: seed "not
+    // listed" and never fire a request against the placeholder address.
+    enabled: enabled && identifier !== null,
+    data: data !== void 0 ? data : identifier === null ? null : void 0
+  });
+  return { state };
+}
+
 // src/client/hooks/checkout/ondo/buy/useOndoBuyCheckoutViewModel.ts
 function useOndoBuyCheckoutViewModel({
   offer,
@@ -6612,9 +6729,10 @@ function useOndoBuyCheckoutViewModel({
   onOrderConfirmed
 }) {
   const locale = useLocale();
-  const [step, setStep] = useState10({ type: "wallet" });
-  const [orderConfirmed, setOrderConfirmed] = useState10({ type: "hidden" });
-  const live = enabled && ondoSwapContractAddress(chain) !== null;
+  const [step, setStep] = useState11({ type: "wallet" });
+  const [orderConfirmed, setOrderConfirmed] = useState11(null);
+  const swappableHere = swapSpender(offer.swapContracts, chain) !== null;
+  const live = enabled && swappableHere;
   const { state: priceState } = useOndoPrice({
     symbol: ondoSymbol,
     side: "buy",
@@ -6628,6 +6746,20 @@ function useOndoBuyCheckoutViewModel({
     pollIntervalMs: ONDO_POLL_INTERVAL_MS,
     enabled: live
   });
+  const { state: outputTokenMetadataState } = useCheckoutOfferTokenMetadata({
+    offer,
+    chain,
+    enabled: live
+  });
+  const outputTokenMetadata = tokenMetadataOf(outputTokenMetadataState);
+  const orderConfirmedUi = (order) => order === null ? { type: "hidden" } : toOrderConfirmedUi({
+    order,
+    chain,
+    locale,
+    offer,
+    ondoSymbol,
+    outputTokenMetadata
+  });
   const { state: walletState, onEvent: onWalletEvent } = useOndoWalletSelectViewModel({
     stepInput: walletStepInput(step),
     wallets,
@@ -6642,6 +6774,7 @@ function useOndoBuyCheckoutViewModel({
     }),
     ondoSymbol,
     chain,
+    swapContracts: offer.swapContracts,
     enabled: live,
     // Both transitions read the step through the updater rather than the one
     // this render closed over. Preparing an amount takes an approval to mine,
@@ -6673,11 +6806,10 @@ function useOndoBuyCheckoutViewModel({
     ondoSymbol,
     chain,
     offer,
+    outputTokenMetadata,
     enabled: live,
     onComplete: (order) => {
-      setOrderConfirmed(
-        toOrderConfirmedUi({ order, chain, locale, offer, ondoSymbol })
-      );
+      setOrderConfirmed(order);
       setStep({ type: "wallet" });
       onOrderConfirmed?.(order);
     }
@@ -6686,16 +6818,17 @@ function useOndoBuyCheckoutViewModel({
     offer,
     ondoSymbol,
     chain,
+    tokenMetadata: outputTokenMetadata,
     priceState,
     tradingStatusState
   });
-  const state = ondoSwapContractAddress(chain) === null ? { type: "error", reason: "unsupported-chain" } : {
+  const state = !swappableHere ? { type: "error", reason: "unsupported-chain" } : {
     type: "content",
     wallet: walletState,
     amount: amountState,
     review: reviewState,
     sidebar: sidebarState,
-    orderConfirmed
+    orderConfirmed: orderConfirmedUi(orderConfirmed)
   };
   const onEvent = (event) => {
     switch (event.type) {
@@ -6719,7 +6852,7 @@ function useOndoBuyCheckoutViewModel({
         onReviewEvent(event);
         return;
       case "ON_CLOSE_ORDER_CONFIRMED":
-        setOrderConfirmed({ type: "hidden" });
+        setOrderConfirmed(null);
         return;
       default: {
         const exhaustive = event;
@@ -6773,14 +6906,16 @@ function toOrderConfirmedUi({
   chain,
   locale,
   offer,
-  ondoSymbol
+  ondoSymbol,
+  outputTokenMetadata
 }) {
   const inputSymbol = TOKEN_REGISTRY.erc20(order.inputAsset).symbol;
   return {
     type: "visible",
     outputAsset: CheckoutAssetUi.fromOffer(offer, {
       symbol: ondoSymbol,
-      networkName: getNetworkName(chain)
+      networkName: getNetworkName(chain),
+      tokenMetadata: outputTokenMetadata
     }),
     outputAmount: assetAmount(
       formatAmount(order.transaction.receiveOutputAmount, locale),
@@ -6800,13 +6935,13 @@ function toOrderConfirmedUi({
 }
 
 // src/client/hooks/checkout/ondo/sell/useOndoSellCheckoutViewModel.ts
-import { useState as useState15 } from "react";
+import { useState as useState16 } from "react";
 
 // src/client/hooks/checkout/ondo/sell/amount/useOndoSellAmountViewModel.ts
-import { useEffect as useEffect11, useRef as useRef9, useState as useState12 } from "react";
+import { useEffect as useEffect12, useRef as useRef9, useState as useState13 } from "react";
 
 // src/client/hooks/shared/erc20/useErc20Balance.ts
-import { useEffect as useEffect10, useRef as useRef8, useState as useState11 } from "react";
+import { useEffect as useEffect11, useRef as useRef8, useState as useState12 } from "react";
 function useErc20Balance(options) {
   const {
     tokenAddress,
@@ -6817,12 +6952,12 @@ function useErc20Balance(options) {
   } = options;
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useErc20Balance");
-  const [balance, setBalance] = useState11(null);
-  const [isLoading, setIsLoading] = useState11(true);
+  const [balance, setBalance] = useState12(null);
+  const [isLoading, setIsLoading] = useState12(true);
   const fetchIdRef = useRef8(0);
   const isFetchingRef = useRef8(false);
   const hasReadRef = useRef8(false);
-  useEffect10(() => {
+  useEffect11(() => {
     if (!isReady) return;
     setBalance(null);
     hasReadRef.current = false;
@@ -6899,15 +7034,16 @@ function useOndoSellAmountViewModel({
   ondoSymbol,
   chain,
   offer,
+  inputTokenMetadata,
   enabled = true,
   onComplete,
   onEdit
 }) {
   const { coinlist } = useCoinList();
   const locale = useLocale();
-  const [amountInput, setAmountInput] = useState12("");
-  const [error, setError] = useState12(null);
-  const [phase, setPhase] = useState12(null);
+  const [amountInput, setAmountInput] = useState13("");
+  const [error, setError] = useState13(null);
+  const [phase, setPhase] = useState13(null);
   const preparationIdRef = useRef9(0);
   const isActive = stepInput.type === "active";
   const networkName = getNetworkName(chain);
@@ -6919,7 +7055,7 @@ function useOndoSellAmountViewModel({
     chain,
     enabled: enabled && isActive && sellAsset2 !== null
   });
-  useEffect11(() => {
+  useEffect12(() => {
     if (stepInput.type === "incomplete") {
       ++preparationIdRef.current;
       setAmountInput("");
@@ -6945,7 +7081,8 @@ function useOndoSellAmountViewModel({
           type: "complete",
           asset: CheckoutAssetUi.fromOffer(offer, {
             symbol: stepInput.inputAsset,
-            networkName
+            networkName,
+            tokenMetadata: inputTokenMetadata
           }),
           amountFormatted: assetAmount(
             formatAmount(stepInput.amount, locale),
@@ -6967,7 +7104,8 @@ function useOndoSellAmountViewModel({
     return {
       asset: CheckoutAssetUi.fromOffer(offer, {
         symbol: ondoSymbol,
-        networkName
+        networkName,
+        tokenMetadata: inputTokenMetadata
       }),
       balance: assetAmount(formatAmount(amount, locale), ondoSymbol),
       rawBalance: balance
@@ -7003,6 +7141,7 @@ function useOndoSellAmountViewModel({
       wallet: stepInput.wallet,
       symbol: ondoSymbol,
       chain,
+      swapContracts: offer.swapContracts,
       // The asset, not a stablecoin: a sell spends what it is selling, so this
       // is the contract the swap contract has to be allowed to pull from.
       tokenAddress: asset.address,
@@ -7153,15 +7292,15 @@ function preparationErrorMessage2(error) {
 }
 
 // src/client/hooks/checkout/ondo/sell/review/useOndoSellReviewViewModel.ts
-import { useEffect as useEffect13, useRef as useRef11, useState as useState14 } from "react";
+import { useEffect as useEffect14, useRef as useRef11, useState as useState15 } from "react";
 
 // src/client/hooks/checkout/ondo/sell/data/useOndoSellTransaction.ts
-import { useCallback as useCallback3, useEffect as useEffect12, useRef as useRef10, useState as useState13 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect13, useRef as useRef10, useState as useState14 } from "react";
 function useOndoSellTransaction(options) {
   const { request, data, enabled } = options;
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useOndoSellTransaction");
-  const [state, setState] = useState13(
+  const [state, setState] = useState14(
     () => data === void 0 ? { type: "LOADING" } : {
       type: "CONTENT",
       transaction: data,
@@ -7174,7 +7313,7 @@ function useOndoSellTransaction(options) {
   const requestKey = request === null ? null : stableKey2(request);
   const requestRef = useRef10(request);
   requestRef.current = request;
-  const build = useCallback3(async () => {
+  const build = useCallback4(async () => {
     const params = requestRef.current;
     if (!isReady || !enabled || params === null) return;
     if (isFetchingRef.current) return;
@@ -7210,7 +7349,7 @@ function useOndoSellTransaction(options) {
       isFetchingRef.current = false;
     }
   }, [coinlist, isReady, enabled, log]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (data === void 0) return;
     ++fetchIdRef.current;
     setState({
@@ -7221,14 +7360,14 @@ function useOndoSellTransaction(options) {
     });
   }, [data]);
   const hasSeed = data !== void 0;
-  useEffect12(() => {
+  useEffect13(() => {
     if (hasSeed || requestKey === null) return;
     build();
     return () => {
       ++fetchIdRef.current;
     };
   }, [build, requestKey, hasSeed]);
-  const refetch = useCallback3(() => {
+  const refetch = useCallback4(() => {
     build();
   }, [build]);
   return { state, refetch };
@@ -7253,8 +7392,8 @@ function useOndoSellReviewViewModel({
 }) {
   const { coinlist } = useCoinList();
   const locale = useLocale();
-  const [phase, setPhase] = useState14(null);
-  const [error, setError] = useState14(null);
+  const [phase, setPhase] = useState15(null);
+  const [error, setError] = useState15(null);
   const isActive = stepInput.type === "active";
   const { state: transactionState, refetch } = useOndoSellTransaction({
     request: isActive ? {
@@ -7267,7 +7406,7 @@ function useOndoSellReviewViewModel({
     enabled: enabled && isActive
   });
   const executionIdRef = useRef11(0);
-  useEffect13(() => {
+  useEffect14(() => {
     if (stepInput.type === "incomplete") {
       ++executionIdRef.current;
       setError(null);
@@ -7444,8 +7583,6 @@ function executionErrorMessage2(error) {
   switch (error.step) {
     case "quote-expired":
       return "That quote expired. Get a new one to place your order.";
-    case "spender-mismatch":
-      return "This quote does not match the approval you gave. Get a new one.";
     case "swap":
       switch (error.cause.type) {
         case "user_rejected":
@@ -7479,13 +7616,14 @@ function useOndoSellCheckoutViewModel({
   onOrderConfirmed
 }) {
   const locale = useLocale();
-  const [initialStep] = useState15(
+  const [initialStep] = useState16(
     () => wallets.preselected === null ? { type: "wallet" } : { type: "amount", wallet: wallets.preselected }
   );
-  const [step, setStep] = useState15(initialStep);
+  const [step, setStep] = useState16(initialStep);
   const hasWalletStep = initialStep.type === "wallet";
-  const [orderConfirmed, setOrderConfirmed] = useState15({ type: "hidden" });
-  const live = enabled && ondoSwapContractAddress(chain) !== null;
+  const [orderConfirmed, setOrderConfirmed] = useState16(null);
+  const swappableHere = swapSpender(offer.swapContracts, chain) !== null;
+  const live = enabled && swappableHere;
   const { state: priceState } = useOndoPrice({
     symbol: ondoSymbol,
     side: "sell",
@@ -7499,6 +7637,20 @@ function useOndoSellCheckoutViewModel({
     pollIntervalMs: ONDO_POLL_INTERVAL_MS,
     enabled: live
   });
+  const { state: inputTokenMetadataState } = useCheckoutOfferTokenMetadata({
+    offer,
+    chain,
+    enabled: live
+  });
+  const inputTokenMetadata = tokenMetadataOf(inputTokenMetadataState);
+  const orderConfirmedUi = (order) => order === null ? { type: "hidden" } : toOrderConfirmedUi2({
+    order,
+    chain,
+    locale,
+    offer,
+    ondoSymbol,
+    inputTokenMetadata
+  });
   const { state: walletState, onEvent: onWalletEvent } = useOndoWalletSelectViewModel({
     stepInput: walletStepInput2(step),
     wallets,
@@ -7515,6 +7667,7 @@ function useOndoSellCheckoutViewModel({
     ondoSymbol,
     chain,
     offer,
+    inputTokenMetadata,
     enabled: live,
     // Both transitions read the step through the updater rather than the one
     // this render closed over. Preparing an amount takes an approval to mine,
@@ -7547,9 +7700,7 @@ function useOndoSellCheckoutViewModel({
     chain,
     enabled: live,
     onComplete: (order) => {
-      setOrderConfirmed(
-        toOrderConfirmedUi2({ order, chain, locale, offer, ondoSymbol })
-      );
+      setOrderConfirmed(order);
       setStep(initialStep);
       onOrderConfirmed?.(order);
     }
@@ -7558,16 +7709,17 @@ function useOndoSellCheckoutViewModel({
     offer,
     ondoSymbol,
     chain,
+    tokenMetadata: inputTokenMetadata,
     priceState,
     tradingStatusState
   });
-  const state = ondoSwapContractAddress(chain) === null ? { type: "error", reason: "unsupported-chain" } : {
+  const state = !swappableHere ? { type: "error", reason: "unsupported-chain" } : {
     type: "content",
     wallet: hasWalletStep ? walletState : null,
     amount: amountState,
     review: reviewState,
     sidebar: sidebarState,
-    orderConfirmed
+    orderConfirmed: orderConfirmedUi(orderConfirmed)
   };
   const onEvent = (event) => {
     switch (event.type) {
@@ -7591,7 +7743,7 @@ function useOndoSellCheckoutViewModel({
         onReviewEvent(event);
         return;
       case "ON_CLOSE_SELL_ORDER_CONFIRMED":
-        setOrderConfirmed({ type: "hidden" });
+        setOrderConfirmed(null);
         return;
       default: {
         const exhaustive = event;
@@ -7659,14 +7811,16 @@ function toOrderConfirmedUi2({
   chain,
   locale,
   offer,
-  ondoSymbol
+  ondoSymbol,
+  inputTokenMetadata
 }) {
   const settlementSymbol = TOKEN_REGISTRY.erc20(ONDO_SETTLEMENT_ASSET).symbol;
   return {
     type: "visible",
     soldAsset: CheckoutAssetUi.fromOffer(offer, {
       symbol: ondoSymbol,
-      networkName: getNetworkName(chain)
+      networkName: getNetworkName(chain),
+      tokenMetadata: inputTokenMetadata
     }),
     soldAmount: assetAmount(
       formatAmount(order.transaction.spendInputAmount, locale),
@@ -7690,10 +7844,10 @@ function toOrderConfirmedUi2({
 }
 
 // src/client/hooks/checkout/superstate/swap/useSuperstateSwapCheckoutViewModel.ts
-import { useState as useState21 } from "react";
+import { useState as useState22 } from "react";
 
 // src/client/hooks/checkout/superstate/swap/amount/useSuperstateAmountViewModel.ts
-import { useEffect as useEffect14, useState as useState16 } from "react";
+import { useEffect as useEffect15, useState as useState17 } from "react";
 var NO_WALLET3 = EvmWalletAddress(
   "0x0000000000000000000000000000000000000000"
 );
@@ -7707,11 +7861,11 @@ function useSuperstateAmountViewModel({
   enabled = true
 }) {
   const locale = useLocale();
-  const [amountInput, setAmountInput] = useState16("");
-  const [selectedAsset, setSelectedAsset] = useState16(
+  const [amountInput, setAmountInput] = useState17("");
+  const [selectedAsset, setSelectedAsset] = useState17(
     SUPERSTATE_SUPPORTED_INPUT_ASSETS[0]
   );
-  const [error, setError] = useState16(null);
+  const [error, setError] = useState17(null);
   const isActive = stepInput.type === "active";
   const networkName = getNetworkName(chain);
   const { balances, isLoading: balancesLoading } = useErc20TokenBalances({
@@ -7724,7 +7878,7 @@ function useSuperstateAmountViewModel({
     // on this step satisfies the first and not the second.
     enabled: enabled && isActive
   });
-  useEffect14(() => {
+  useEffect15(() => {
     if (stepInput.type === "incomplete") {
       setAmountInput("");
       setSelectedAsset(SUPERSTATE_SUPPORTED_INPUT_ASSETS[0]);
@@ -7895,20 +8049,20 @@ function toInputAssetUi2({
 }
 
 // src/client/hooks/checkout/superstate/swap/data/useSwapOutputToken.ts
-import { useCallback as useCallback4, useEffect as useEffect15, useRef as useRef12, useState as useState17 } from "react";
-var LOADING_STATE = { type: "LOADING" };
+import { useCallback as useCallback5, useEffect as useEffect16, useRef as useRef12, useState as useState18 } from "react";
+var LOADING_STATE2 = { type: "LOADING" };
 function useSwapOutputToken(options) {
   const { contractAddress, chain, enabled } = options;
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useSwapOutputToken");
-  const [outputTokenState, setOutputTokenState] = useState17(LOADING_STATE);
-  const [retryCount, setRetryCount] = useState17(0);
+  const [outputTokenState, setOutputTokenState] = useState18(LOADING_STATE2);
+  const [retryCount, setRetryCount] = useState18(0);
   const fetchIdRef = useRef12(0);
-  const refetch = useCallback4(() => {
-    setOutputTokenState(LOADING_STATE);
+  const refetch = useCallback5(() => {
+    setOutputTokenState(LOADING_STATE2);
     setRetryCount((count) => count + 1);
   }, []);
-  useEffect15(() => {
+  useEffect16(() => {
     if (!enabled || !isReady) return;
     const currentFetchId = ++fetchIdRef.current;
     const load = async () => {
@@ -7941,7 +8095,7 @@ function useSwapOutputToken(options) {
 }
 
 // src/client/hooks/checkout/superstate/swap/data/useSwapQuote.ts
-import { useEffect as useEffect16, useRef as useRef13, useState as useState18 } from "react";
+import { useEffect as useEffect17, useRef as useRef13, useState as useState19 } from "react";
 function useSwapQuote(options) {
   const {
     contractAddress,
@@ -7954,13 +8108,13 @@ function useSwapQuote(options) {
   } = options;
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useSwapQuote");
-  const [quote, setQuote] = useState18(null);
-  const [isLoading, setIsLoading] = useState18(true);
-  const [isRefreshing, setIsRefreshing] = useState18(false);
+  const [quote, setQuote] = useState19(null);
+  const [isLoading, setIsLoading] = useState19(true);
+  const [isRefreshing, setIsRefreshing] = useState19(false);
   const isFetchingRef = useRef13(false);
   const hasQuoteRef = useRef13(false);
   const fetchIdRef = useRef13(0);
-  useEffect16(() => {
+  useEffect17(() => {
     if (!isReady) return;
     if (!enabled) {
       setIsLoading(false);
@@ -8030,7 +8184,7 @@ function useSwapQuote(options) {
 }
 
 // src/client/hooks/checkout/superstate/swap/review/useSuperstateReviewViewModel.ts
-import { useEffect as useEffect17, useState as useState19 } from "react";
+import { useEffect as useEffect18, useState as useState20 } from "react";
 function useSuperstateReviewViewModel({
   stepInput,
   contractAddress,
@@ -8040,11 +8194,11 @@ function useSuperstateReviewViewModel({
 }) {
   const { coinlist, isReady } = useCoinList();
   const locale = useLocale();
-  const [slippageBps, setSlippageBps] = useState19(DEFAULT_SLIPPAGE_BPS);
-  const [slippageExpanded, setSlippageExpanded] = useState19(false);
-  const [phase, setPhase] = useState19(null);
-  const [error, setError] = useState19(null);
-  useEffect17(() => {
+  const [slippageBps, setSlippageBps] = useState20(DEFAULT_SLIPPAGE_BPS);
+  const [slippageExpanded, setSlippageExpanded] = useState20(false);
+  const [phase, setPhase] = useState20(null);
+  const [error, setError] = useState20(null);
+  useEffect18(() => {
     if (stepInput.type === "incomplete") {
       setSlippageBps(DEFAULT_SLIPPAGE_BPS);
       setSlippageExpanded(false);
@@ -8373,7 +8527,7 @@ function priceUi(quote, outputToken, locale) {
 }
 
 // src/client/hooks/checkout/superstate/swap/wallet/useSuperstateWalletViewModel.ts
-import { useEffect as useEffect18, useState as useState20 } from "react";
+import { useEffect as useEffect19, useState as useState21 } from "react";
 var CONNECT_FAILED2 = "Could not connect that wallet. Please try again.";
 function useSuperstateWalletViewModel({
   stepInput,
@@ -8386,12 +8540,12 @@ function useSuperstateWalletViewModel({
 }) {
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useSuperstateWalletViewModel");
-  const [selected, setSelected] = useState20(null);
-  const [phase, setPhase] = useState20(null);
-  const [error, setError] = useState20(null);
+  const [selected, setSelected] = useState21(null);
+  const [phase, setPhase] = useState21(null);
+  const [error, setError] = useState21(null);
   const networkName = getNetworkName(chain);
   const selectedWallet = resolveWallet2(wallets, selected);
-  useEffect18(() => {
+  useEffect19(() => {
     if (stepInput.type === "completed") {
       setPhase(null);
       setError(null);
@@ -8610,12 +8764,20 @@ function useSuperstateSwapCheckoutViewModel({
 }) {
   const locale = useLocale();
   const contractAddress = superstateSwapContractAddress(chain);
-  const assetIconUrl = offerIconUrl(offer);
-  const [step, setStep] = useState21({ type: "wallet" });
-  const [orderConfirmed, setOrderConfirmed] = useState21({ type: "hidden" });
+  const [step, setStep] = useState22({ type: "wallet" });
+  const [orderConfirmed, setOrderConfirmed] = useState22(null);
   const { inputAmount, inputTokenAddress } = quoteInput(step, chain);
   const live = enabled && contractAddress !== null;
   const contract = contractAddress ?? NO_CONTRACT;
+  const { state: offerTokenMetadataState } = useCheckoutOfferTokenMetadata({
+    offer,
+    chain,
+    enabled: live
+  });
+  const assetIconUrl = offerAssetIconUrl(
+    offer,
+    tokenMetadataOf(offerTokenMetadataState)
+  );
   const { outputTokenState, refetch: refetchOutputToken } = useSwapOutputToken({
     contractAddress: contract,
     chain,
@@ -8672,9 +8834,7 @@ function useSuperstateSwapCheckoutViewModel({
     chain,
     assetIconUrl,
     onComplete: (order) => {
-      setOrderConfirmed(
-        toOrderConfirmedUi3({ order, chain, locale, assetIconUrl })
-      );
+      setOrderConfirmed(order);
       setStep({ type: "wallet" });
       onOrderConfirmed?.(order);
     }
@@ -8700,7 +8860,15 @@ function useSuperstateSwapCheckoutViewModel({
       amount: amountState,
       review: reviewState,
       sidebar: sidebarState,
-      orderConfirmed
+      // Derived here rather than in the review completion callback, so a
+      // registry lookup that settles while the order is being placed still
+      // reaches the dialog instead of the fallback icon that closure captured.
+      orderConfirmed: orderConfirmed === null ? { type: "hidden" } : toOrderConfirmedUi3({
+        order: orderConfirmed,
+        chain,
+        locale,
+        assetIconUrl
+      })
     };
   };
   const onEvent = (event) => {
@@ -8725,7 +8893,7 @@ function useSuperstateSwapCheckoutViewModel({
         onReviewEvent(event);
         return;
       case "ON_CLOSE_ORDER_CONFIRMED":
-        setOrderConfirmed({ type: "hidden" });
+        setOrderConfirmed(null);
         return;
       case "ON_RETRY_LOAD":
         refetchOutputToken();
@@ -8840,7 +9008,7 @@ function CheckoutContainer({
   enabled = true,
   className
 }) {
-  const [side] = useState22(() => config["ondo::swap"].side());
+  const [side] = useState23(() => config["ondo::swap"].side());
   const isOndo = offer.type === "ondo::swap";
   const ondoSymbol = config["ondo::swap"].symbol(offer);
   const ondoBuy = useOndoBuyCheckoutViewModel({
@@ -9413,23 +9581,23 @@ function EmptyState() {
 }
 
 // src/client/hooks/offers/grid/useOffersGridViewModel.ts
-import { useCallback as useCallback5, useMemo as useMemo4 } from "react";
+import { useCallback as useCallback6, useMemo as useMemo4 } from "react";
 
 // src/client/hooks/offers/data/useOffers.ts
-import { useEffect as useEffect19, useState as useState23 } from "react";
-var LOADING_STATE2 = { type: "LOADING" };
+import { useEffect as useEffect20, useState as useState24 } from "react";
+var LOADING_STATE3 = { type: "LOADING" };
 function useOffers(options = {}) {
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useOffers");
   const { data: serverOffers } = options;
-  const [offersState, setOffersState] = useState23(
-    serverOffers !== void 0 ? { type: "CONTENT", offers: serverOffers } : LOADING_STATE2
+  const [offersState, setOffersState] = useState24(
+    serverOffers !== void 0 ? { type: "CONTENT", offers: serverOffers } : LOADING_STATE3
   );
-  useEffect19(() => {
+  useEffect20(() => {
     let isCancelled = false;
     if (!isReady) {
       if (serverOffers === void 0) {
-        setOffersState(LOADING_STATE2);
+        setOffersState(LOADING_STATE3);
       }
       return () => {
         isCancelled = true;
@@ -9440,7 +9608,7 @@ function useOffers(options = {}) {
         isCancelled = true;
       };
     }
-    setOffersState(LOADING_STATE2);
+    setOffersState(LOADING_STATE3);
     coinlist.offers.list().then((offers) => {
       if (!isCancelled) {
         log.debug(() => ({
@@ -9495,7 +9663,7 @@ function useOffersGridViewModel(options = {}) {
     () => toUiState(offersState, onOfferClick !== void 0),
     [offersState, onOfferClick]
   );
-  const onEvent = useCallback5(
+  const onEvent = useCallback6(
     (event) => {
       switch (event.type) {
         case "ON_OFFER_CLICK": {
@@ -9555,14 +9723,14 @@ function OffersGridContainer({
   return /* @__PURE__ */ jsx55(OffersGridView, { state, onEvent, ...viewProps });
 }
 
-// src/client/components/requirements/checklist/ConnectedWalletList.tsx
-import { useState as useState24 } from "react";
+// src/client/components/requirements/ConnectedWalletList.tsx
+import { useState as useState25 } from "react";
 import { jsx as jsx56, jsxs as jsxs40 } from "react/jsx-runtime";
 function ConnectedWalletRow({
   wallet,
   onRemove
 }) {
-  const [state, setState] = useState24("idle");
+  const [state, setState] = useState25("idle");
   const remove = async () => {
     if (!onRemove) return;
     setState("removing");
@@ -9671,91 +9839,307 @@ function ConnectedWalletListBody({
   );
 }
 
-// src/client/components/requirements/checklist/RequirementItem.tsx
-import { ChevronRight } from "lucide-react";
-
-// src/client/components/design-system/StepStatusIcon.tsx
-import { CircleCheck as CircleCheck2, CircleX, Info as Info5 } from "lucide-react";
-import { jsx as jsx57 } from "react/jsx-runtime";
-var statusConfig = {
-  required: {
-    Icon: Info5,
-    colorClass: "clcosdk:text-warning",
-    fillClass: "clcosdk:[&_circle]:fill-warning-subtle"
-  },
-  pending: {
-    Icon: Info5,
-    colorClass: "clcosdk:text-warning",
-    fillClass: "clcosdk:[&_circle]:fill-warning-subtle"
-  },
-  completed: {
-    Icon: CircleCheck2,
-    colorClass: "clcosdk:text-success",
-    fillClass: "clcosdk:[&_circle]:fill-success-subtle"
-  },
-  rejected: {
-    Icon: CircleX,
-    colorClass: "clcosdk:text-error",
-    fillClass: "clcosdk:[&_circle]:fill-error-subtle"
-  }
-};
-function StepStatusIcon({ status, className }) {
-  const { Icon, colorClass, fillClass } = statusConfig[status];
-  return /* @__PURE__ */ jsx57(
-    Icon,
-    {
-      className: cn(
-        "clcosdk:h-6 clcosdk:w-6 clcosdk:shrink-0",
-        colorClass,
-        fillClass,
-        className
-      ),
-      "aria-hidden": "true"
-    }
-  );
+// src/client/components/requirements/identity-verification/IdentityVerificationView.tsx
+import SumsubWebSdk from "@sumsub/websdk-react";
+import { jsx as jsx57, jsxs as jsxs41 } from "react/jsx-runtime";
+function IdentityVerificationView(props) {
+  return /* @__PURE__ */ jsx57(CoinListStyleScope, { children: /* @__PURE__ */ jsx57(IdentityVerificationViewBody, { ...props }) });
 }
-
-// src/client/components/requirements/checklist/RequirementItem.tsx
-import { Fragment as Fragment9, jsx as jsx58, jsxs as jsxs41 } from "react/jsx-runtime";
-function VerificationActionZone({
-  status,
-  onAction,
-  onContactSupport
+function IdentityVerificationViewBody({
+  state,
+  onEvent,
+  className
 }) {
-  switch (status) {
-    case "required":
-      if (onAction === null) return null;
-      return /* @__PURE__ */ jsx58(ClButton, { size: "sm", onClick: onAction, children: "Continue" });
-    case "pending":
-      return /* @__PURE__ */ jsx58(
-        AlertBanner,
+  switch (state.type) {
+    case "loading":
+      return /* @__PURE__ */ jsx57(
+        "output",
         {
-          variant: "warning",
-          content: "Under review. We'll notify you when complete."
+          "aria-live": "polite",
+          className: cn(
+            "clcosdk:flex clcosdk:min-h-40 clcosdk:items-center clcosdk:justify-center",
+            className
+          ),
+          children: /* @__PURE__ */ jsx57("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: "Loading identity verification..." })
         }
       );
-    case "completed":
-      return /* @__PURE__ */ jsx58(AlertBanner, { variant: "success", content: "Identity verified." });
-    case "rejected":
-      return /* @__PURE__ */ jsx58(
-        AlertBanner,
+    case "error":
+      return /* @__PURE__ */ jsxs41(
+        "div",
         {
-          variant: "error",
-          content: onContactSupport === null ? "Verification rejected." : /* @__PURE__ */ jsxs41(Fragment9, { children: [
-            "Verification rejected.",
-            " ",
-            /* @__PURE__ */ jsx58(
-              "button",
-              {
-                type: "button",
-                onClick: onContactSupport,
-                className: "clcosdk:underline",
-                children: "Contact support"
-              }
-            ),
-            "."
-          ] })
-        }
+          className: cn(
+            "clcosdk:flex clcosdk:flex-col clcosdk:gap-4",
+            className
+          ),
+          children: [
+            /* @__PURE__ */ jsx57(AlertBanner, { variant: "error", icon: true, content: state.message }),
+            state.retryable && /* @__PURE__ */ jsx57(ClButton, { size: "sm", onClick: () => onEvent({ type: "ON_RETRY" }), children: "Try again" })
+          ]
+        }
+      );
+    case "ready":
+      return /* @__PURE__ */ jsx57("div", { className: cn("clcosdk:w-full", className), children: /* @__PURE__ */ jsx57(
+        SumsubWebSdk,
+        {
+          accessToken: state.accessToken,
+          expirationHandler: state.refreshToken,
+          config: state.locale === void 0 ? {} : { lang: state.locale },
+          options: { addViewportTag: false, adaptIframeHeight: true },
+          onMessage: (type, payload) => {
+            onSumsubMessage(type, payload, onEvent);
+          },
+          onError: (error) => {
+            onEvent({ type: "ON_ERROR", error: toError(error) });
+          }
+        }
+      ) });
+    default: {
+      const exhaustive = state;
+      return exhaustive;
+    }
+  }
+}
+function onSumsubMessage(type, payload, onEvent) {
+  switch (type) {
+    case "idCheck.onApplicantSubmitted":
+      onEvent({ type: "ON_SUBMITTED" });
+      return;
+    case "idCheck.onError": {
+      const message = payload?.message ?? "Verification error";
+      onEvent({ type: "ON_ERROR", error: new Error(message) });
+      return;
+    }
+    default:
+      return;
+  }
+}
+function toError(error) {
+  return error instanceof Error ? error : new Error("Verification error");
+}
+
+// src/client/hooks/requirements/identity-verification/useIdentityVerificationViewModel.ts
+import { useCallback as useCallback8, useEffect as useEffect22, useMemo as useMemo5, useRef as useRef15 } from "react";
+
+// src/client/hooks/requirements/data/useKycToken.ts
+import { useCallback as useCallback7, useEffect as useEffect21, useRef as useRef14, useState as useState26 } from "react";
+var IDLE_STATE = { type: "IDLE" };
+var LOADING_STATE4 = { type: "LOADING" };
+function useKycToken(levelName, reset) {
+  const { coinlist } = useCoinList();
+  const log = useLogger("useKycToken");
+  const [kycTokenState, setKycTokenState] = useState26(IDLE_STATE);
+  const resetPendingRef = useRef14(reset === true);
+  const tokenIssuedRef = useRef14(false);
+  useEffect21(() => {
+    if (!tokenIssuedRef.current) {
+      resetPendingRef.current = reset === true;
+    }
+  }, [reset]);
+  const fetchToken = useCallback7(async () => {
+    setKycTokenState(LOADING_STATE4);
+    try {
+      const kycToken = await coinlist.requirements.createKycToken({
+        levelName,
+        reset: resetPendingRef.current
+      });
+      resetPendingRef.current = false;
+      tokenIssuedRef.current = true;
+      log.debug(() => ({
+        msg: "settled",
+        fields: { state: "CONTENT" }
+      }));
+      setKycTokenState({ type: "CONTENT", token: kycToken.token });
+      return kycToken.token;
+    } catch (error) {
+      const reason = error instanceof NotAuthenticatedError ? "not-authenticated" : "generic-error";
+      log.failure(
+        () => ({ msg: "settled", fields: { state: "ERROR", reason } }),
+        error
+      );
+      setKycTokenState({ type: "ERROR", reason });
+      throw error;
+    }
+  }, [coinlist, levelName, log]);
+  return { kycTokenState, fetchToken };
+}
+
+// src/client/hooks/requirements/identity-verification/useIdentityVerificationViewModel.ts
+var NOT_AUTHENTICATED_MESSAGE2 = "Sign in to verify your identity.";
+var GENERIC_ERROR_MESSAGE2 = "Unable to start identity verification right now. Please try again.";
+function useIdentityVerificationViewModel(options = {}) {
+  const { levelName, reset, locale, onSubmitted, onError } = options;
+  const { kycTokenState, fetchToken } = useKycToken(levelName, reset);
+  const fetchedRef = useRef15(false);
+  useEffect22(() => {
+    if (fetchedRef.current) {
+      return;
+    }
+    fetchedRef.current = true;
+    fetchToken().catch(() => {
+    });
+  }, [fetchToken]);
+  const state = useMemo5(() => {
+    switch (kycTokenState.type) {
+      case "IDLE":
+      case "LOADING":
+        return { type: "loading" };
+      case "ERROR": {
+        const notAuthenticated = kycTokenState.reason === "not-authenticated";
+        return {
+          type: "error",
+          message: notAuthenticated ? NOT_AUTHENTICATED_MESSAGE2 : GENERIC_ERROR_MESSAGE2,
+          retryable: !notAuthenticated
+        };
+      }
+      case "CONTENT":
+        return {
+          type: "ready",
+          accessToken: kycTokenState.token,
+          locale,
+          refreshToken: fetchToken
+        };
+      default: {
+        const exhaustive = kycTokenState;
+        return exhaustive;
+      }
+    }
+  }, [kycTokenState, locale, fetchToken]);
+  const onEvent = useCallback8(
+    (event) => {
+      switch (event.type) {
+        case "ON_RETRY":
+          fetchToken().catch(() => {
+          });
+          return;
+        case "ON_SUBMITTED":
+          onSubmitted?.();
+          return;
+        case "ON_ERROR":
+          onError?.(event.error);
+          return;
+        default: {
+          const exhaustive = event;
+          return exhaustive;
+        }
+      }
+    },
+    [fetchToken, onSubmitted, onError]
+  );
+  return { state, onEvent };
+}
+
+// src/client/components/requirements/identity-verification/IdentityVerificationContainer.tsx
+import { jsx as jsx58 } from "react/jsx-runtime";
+function IdentityVerificationContainer({
+  levelName,
+  reset,
+  locale,
+  onSubmitted,
+  onError,
+  className
+}) {
+  const { state, onEvent } = useIdentityVerificationViewModel({
+    levelName,
+    reset,
+    locale,
+    onSubmitted,
+    onError
+  });
+  return /* @__PURE__ */ jsx58(
+    IdentityVerificationView,
+    {
+      state,
+      onEvent,
+      className
+    }
+  );
+}
+
+// src/client/components/requirements/RequirementItem.tsx
+import { ChevronRight } from "lucide-react";
+
+// src/client/components/design-system/StepStatusIcon.tsx
+import { CircleCheck as CircleCheck2, CircleX, Info as Info5 } from "lucide-react";
+import { jsx as jsx59 } from "react/jsx-runtime";
+var statusConfig = {
+  required: {
+    Icon: Info5,
+    colorClass: "clcosdk:text-warning",
+    fillClass: "clcosdk:[&_circle]:fill-warning-subtle"
+  },
+  pending: {
+    Icon: Info5,
+    colorClass: "clcosdk:text-warning",
+    fillClass: "clcosdk:[&_circle]:fill-warning-subtle"
+  },
+  completed: {
+    Icon: CircleCheck2,
+    colorClass: "clcosdk:text-success",
+    fillClass: "clcosdk:[&_circle]:fill-success-subtle"
+  },
+  rejected: {
+    Icon: CircleX,
+    colorClass: "clcosdk:text-error",
+    fillClass: "clcosdk:[&_circle]:fill-error-subtle"
+  }
+};
+function StepStatusIcon({ status, className }) {
+  const { Icon, colorClass, fillClass } = statusConfig[status];
+  return /* @__PURE__ */ jsx59(
+    Icon,
+    {
+      className: cn(
+        "clcosdk:h-6 clcosdk:w-6 clcosdk:shrink-0",
+        colorClass,
+        fillClass,
+        className
+      ),
+      "aria-hidden": "true"
+    }
+  );
+}
+
+// src/client/components/requirements/RequirementItem.tsx
+import { Fragment as Fragment9, jsx as jsx60, jsxs as jsxs42 } from "react/jsx-runtime";
+function VerificationActionZone({
+  status,
+  onAction,
+  onContactSupport
+}) {
+  switch (status) {
+    case "required":
+      if (onAction === null) return null;
+      return /* @__PURE__ */ jsx60(ClButton, { size: "sm", onClick: onAction, children: "Continue" });
+    case "pending":
+      return /* @__PURE__ */ jsx60(
+        AlertBanner,
+        {
+          variant: "warning",
+          content: "Under review. We'll notify you when complete."
+        }
+      );
+    case "completed":
+      return /* @__PURE__ */ jsx60(AlertBanner, { variant: "success", content: "Identity verified." });
+    case "rejected":
+      return /* @__PURE__ */ jsx60(
+        AlertBanner,
+        {
+          variant: "error",
+          content: onContactSupport === null ? "Verification rejected." : /* @__PURE__ */ jsxs42(Fragment9, { children: [
+            "Verification rejected.",
+            " ",
+            /* @__PURE__ */ jsx60(
+              "button",
+              {
+                type: "button",
+                onClick: onContactSupport,
+                className: "clcosdk:underline",
+                children: "Contact support"
+              }
+            ),
+            "."
+          ] })
+        }
       );
   }
 }
@@ -9768,8 +10152,8 @@ function WalletActionZone({
   onRemoveWallet
 }) {
   if (multiWallet) {
-    return /* @__PURE__ */ jsxs41(Fragment9, { children: [
-      /* @__PURE__ */ jsx58(
+    return /* @__PURE__ */ jsxs42(Fragment9, { children: [
+      /* @__PURE__ */ jsx60(
         ConnectedWalletList,
         {
           wallets: connectedWallets,
@@ -9778,7 +10162,7 @@ function WalletActionZone({
           status: walletsStatus
         }
       ),
-      status === "rejected" && /* @__PURE__ */ jsx58(
+      status === "rejected" && /* @__PURE__ */ jsx60(
         AlertBanner,
         {
           variant: "error",
@@ -9789,21 +10173,21 @@ function WalletActionZone({
   }
   if (status === "completed") {
     const connected = connectedWallets[0];
-    return /* @__PURE__ */ jsxs41(Fragment9, { children: [
-      onAction !== null && /* @__PURE__ */ jsx58(ClButton, { size: "sm", variant: "secondary", onClick: onAction, children: "Change wallet" }),
-      walletsStatus === "loading" ? /* @__PURE__ */ jsx58(
+    return /* @__PURE__ */ jsxs42(Fragment9, { children: [
+      onAction !== null && /* @__PURE__ */ jsx60(ClButton, { size: "sm", variant: "secondary", onClick: onAction, children: "Change wallet" }),
+      walletsStatus === "loading" ? /* @__PURE__ */ jsx60(
         AlertBanner,
         {
           variant: "info",
           content: "Loading your connected wallet\u2026"
         }
-      ) : walletsStatus === "error" ? /* @__PURE__ */ jsx58(
+      ) : walletsStatus === "error" ? /* @__PURE__ */ jsx60(
         AlertBanner,
         {
           variant: "error",
           content: "Couldn't load your connected wallet."
         }
-      ) : /* @__PURE__ */ jsx58(
+      ) : /* @__PURE__ */ jsx60(
         AlertBanner,
         {
           variant: "success",
@@ -9813,9 +10197,9 @@ function WalletActionZone({
     ] });
   }
   if (status === "rejected") {
-    return /* @__PURE__ */ jsxs41(Fragment9, { children: [
-      onAction !== null && /* @__PURE__ */ jsx58(ClButton, { size: "sm", onClick: onAction, children: "Connect wallet" }),
-      /* @__PURE__ */ jsx58(
+    return /* @__PURE__ */ jsxs42(Fragment9, { children: [
+      onAction !== null && /* @__PURE__ */ jsx60(ClButton, { size: "sm", onClick: onAction, children: "Connect wallet" }),
+      /* @__PURE__ */ jsx60(
         AlertBanner,
         {
           variant: "error",
@@ -9825,7 +10209,7 @@ function WalletActionZone({
     ] });
   }
   if (onAction === null) return null;
-  return /* @__PURE__ */ jsx58(ClButton, { size: "sm", onClick: onAction, children: "Connect wallet" });
+  return /* @__PURE__ */ jsx60(ClButton, { size: "sm", onClick: onAction, children: "Connect wallet" });
 }
 function RequirementItem({
   ui,
@@ -9837,7 +10221,7 @@ function RequirementItem({
   walletsStatus,
   onContactSupport
 }) {
-  return /* @__PURE__ */ jsx58(CoinListStyleScope, { children: /* @__PURE__ */ jsxs41(
+  return /* @__PURE__ */ jsx60(CoinListStyleScope, { children: /* @__PURE__ */ jsxs42(
     "div",
     {
       className: cn(
@@ -9845,7 +10229,7 @@ function RequirementItem({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs41(
+        /* @__PURE__ */ jsxs42(
           "button",
           {
             type: "button",
@@ -9853,9 +10237,9 @@ function RequirementItem({
             "aria-expanded": expanded,
             className: "clcosdk:flex clcosdk:h-14 clcosdk:w-full clcosdk:cursor-pointer clcosdk:items-center clcosdk:justify-between clcosdk:rounded-2xl clcosdk:px-2 clcosdk:transition-colors clcosdk:hover:bg-surface",
             children: [
-              /* @__PURE__ */ jsxs41("div", { className: "clcosdk:flex clcosdk:items-center clcosdk:gap-3", children: [
-                /* @__PURE__ */ jsx58(StepStatusIcon, { status: ui.status }),
-                /* @__PURE__ */ jsx58(
+              /* @__PURE__ */ jsxs42("div", { className: "clcosdk:flex clcosdk:items-center clcosdk:gap-3", children: [
+                /* @__PURE__ */ jsx60(StepStatusIcon, { status: ui.status }),
+                /* @__PURE__ */ jsx60(
                   "span",
                   {
                     className: cn(
@@ -9866,7 +10250,7 @@ function RequirementItem({
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsx58(
+              /* @__PURE__ */ jsx60(
                 ChevronRight,
                 {
                   className: cn(
@@ -9879,15 +10263,15 @@ function RequirementItem({
             ]
           }
         ),
-        /* @__PURE__ */ jsx58(
+        /* @__PURE__ */ jsx60(
           "div",
           {
             className: cn(
               "clcosdk:grid clcosdk:transition-[grid-template-rows] clcosdk:duration-300 clcosdk:ease-in-out",
               expanded ? "clcosdk:grid-rows-[1fr]" : "clcosdk:grid-rows-[0fr]"
             ),
-            children: /* @__PURE__ */ jsx58("div", { className: "clcosdk:min-h-0 clcosdk:overflow-hidden", children: /* @__PURE__ */ jsxs41("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-4 clcosdk:px-2 clcosdk:pb-4", children: [
-              /* @__PURE__ */ jsx58(
+            children: /* @__PURE__ */ jsx60("div", { className: "clcosdk:min-h-0 clcosdk:overflow-hidden", children: /* @__PURE__ */ jsxs42("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-4 clcosdk:px-2 clcosdk:pb-4", children: [
+              /* @__PURE__ */ jsx60(
                 "p",
                 {
                   className: cn(
@@ -9897,14 +10281,14 @@ function RequirementItem({
                   children: ui.description
                 }
               ),
-              ui.variant === "verification" ? /* @__PURE__ */ jsx58(
+              ui.variant === "verification" ? /* @__PURE__ */ jsx60(
                 VerificationActionZone,
                 {
                   status: ui.status,
                   onAction,
                   onContactSupport
                 }
-              ) : /* @__PURE__ */ jsx58(
+              ) : /* @__PURE__ */ jsx60(
                 WalletActionZone,
                 {
                   status: ui.status,
@@ -9923,10 +10307,10 @@ function RequirementItem({
   ) });
 }
 
-// src/client/components/requirements/checklist/RequirementsChecklistView.tsx
-import { jsx as jsx59, jsxs as jsxs42 } from "react/jsx-runtime";
+// src/client/components/requirements/RequirementsChecklistView.tsx
+import { jsx as jsx61, jsxs as jsxs43 } from "react/jsx-runtime";
 function RequirementsChecklistView(props) {
-  return /* @__PURE__ */ jsx59(CoinListStyleScope, { children: /* @__PURE__ */ jsx59(RequirementsChecklistViewBody, { ...props }) });
+  return /* @__PURE__ */ jsx61(CoinListStyleScope, { children: /* @__PURE__ */ jsx61(RequirementsChecklistViewBody, { ...props }) });
 }
 function RequirementsChecklistViewBody({
   state,
@@ -9938,11 +10322,11 @@ function RequirementsChecklistViewBody({
 }) {
   switch (state.type) {
     case "loading":
-      return loading ?? /* @__PURE__ */ jsx59(LoadingState2, {});
+      return loading ?? /* @__PURE__ */ jsx61(LoadingState2, {});
     case "not-authenticated":
       return unauthenticatedState ?? null;
     case "error":
-      return error ?? /* @__PURE__ */ jsx59(
+      return error ?? /* @__PURE__ */ jsx61(
         AlertBanner,
         {
           variant: "error",
@@ -9952,7 +10336,7 @@ function RequirementsChecklistViewBody({
         }
       );
     case "content":
-      return /* @__PURE__ */ jsxs42(
+      return /* @__PURE__ */ jsxs43(
         "div",
         {
           className: cn(
@@ -9960,11 +10344,11 @@ function RequirementsChecklistViewBody({
             className
           ),
           children: [
-            /* @__PURE__ */ jsxs42("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-2", children: [
-              /* @__PURE__ */ jsx59("h3", { className: cn(typeClasses.h3, "clcosdk:text-text-primary"), children: state.title }),
-              /* @__PURE__ */ jsx59("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: state.description })
+            /* @__PURE__ */ jsxs43("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-2", children: [
+              /* @__PURE__ */ jsx61("h3", { className: cn(typeClasses.h3, "clcosdk:text-text-primary"), children: state.title }),
+              /* @__PURE__ */ jsx61("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: state.description })
             ] }),
-            /* @__PURE__ */ jsx59("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:divide-y clcosdk:divide-divider", children: state.items.map((row) => /* @__PURE__ */ jsx59(
+            /* @__PURE__ */ jsx61("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:divide-y clcosdk:divide-divider", children: state.items.map((row) => /* @__PURE__ */ jsx61(
               RequirementItem,
               {
                 ui: row.item,
@@ -9983,7 +10367,7 @@ function RequirementsChecklistViewBody({
               },
               row.id
             )) }),
-            state.ineligible && /* @__PURE__ */ jsx59(
+            state.ineligible && /* @__PURE__ */ jsx61(
               AlertBanner,
               {
                 variant: "error",
@@ -9991,7 +10375,7 @@ function RequirementsChecklistViewBody({
                 content: "You are not eligible to participate."
               }
             ),
-            state.continueAction && /* @__PURE__ */ jsx59(
+            state.continueAction && /* @__PURE__ */ jsx61(
               ClButton,
               {
                 fullWidth: true,
@@ -10003,274 +10387,25 @@ function RequirementsChecklistViewBody({
           ]
         }
       );
-    default: {
-      const exhaustive = state;
-      return exhaustive;
-    }
-  }
-}
-function LoadingState2() {
-  return /* @__PURE__ */ jsx59(
-    "output",
-    {
-      "aria-live": "polite",
-      className: "clcosdk:flex clcosdk:min-h-40 clcosdk:items-center clcosdk:justify-center clcosdk:rounded-2xl clcosdk:border clcosdk:border-border clcosdk:bg-background clcosdk:p-6",
-      children: /* @__PURE__ */ jsx59("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: "Loading requirements..." })
-    }
-  );
-}
-
-// src/client/components/requirements/checklist/VerificationOverlay.tsx
-import { jsx as jsx60, jsxs as jsxs43 } from "react/jsx-runtime";
-function VerificationOverlay({
-  onClose,
-  children
-}) {
-  return /* @__PURE__ */ jsx60(CoinListStyleScope, { children: /* @__PURE__ */ jsx60(VerificationOverlayBody, { onClose, children }) });
-}
-function VerificationOverlayBody({
-  onClose,
-  children
-}) {
-  return /* @__PURE__ */ jsx60(
-    "div",
-    {
-      role: "dialog",
-      "aria-modal": "true",
-      "aria-label": "Identity verification",
-      className: "clcosdk:fixed clcosdk:inset-0 clcosdk:z-50 clcosdk:flex clcosdk:items-center clcosdk:justify-center clcosdk:bg-overlay clcosdk:p-4",
-      children: /* @__PURE__ */ jsxs43("div", { className: "clcosdk:relative clcosdk:flex clcosdk:max-h-[92vh] clcosdk:w-full clcosdk:max-w-[760px] clcosdk:flex-col clcosdk:overflow-y-auto clcosdk:rounded-2xl clcosdk:bg-background clcosdk:p-6 clcosdk:pt-14", children: [
-        /* @__PURE__ */ jsx60(
-          CloseButton,
-          {
-            onClick: onClose,
-            className: "clcosdk:absolute clcosdk:top-4 clcosdk:right-4"
-          }
-        ),
-        children
-      ] })
-    }
-  );
-}
-
-// src/client/components/requirements/identity-verification/IdentityVerificationView.tsx
-import SumsubWebSdk from "@sumsub/websdk-react";
-import { jsx as jsx61, jsxs as jsxs44 } from "react/jsx-runtime";
-function IdentityVerificationView(props) {
-  return /* @__PURE__ */ jsx61(CoinListStyleScope, { children: /* @__PURE__ */ jsx61(IdentityVerificationViewBody, { ...props }) });
-}
-function IdentityVerificationViewBody({
-  state,
-  onEvent,
-  className
-}) {
-  switch (state.type) {
-    case "loading":
-      return /* @__PURE__ */ jsx61(
-        "output",
-        {
-          "aria-live": "polite",
-          className: cn(
-            "clcosdk:flex clcosdk:min-h-40 clcosdk:items-center clcosdk:justify-center",
-            className
-          ),
-          children: /* @__PURE__ */ jsx61("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: "Loading identity verification..." })
-        }
-      );
-    case "error":
-      return /* @__PURE__ */ jsxs44(
-        "div",
-        {
-          className: cn(
-            "clcosdk:flex clcosdk:flex-col clcosdk:gap-4",
-            className
-          ),
-          children: [
-            /* @__PURE__ */ jsx61(AlertBanner, { variant: "error", icon: true, content: state.message }),
-            state.retryable && /* @__PURE__ */ jsx61(ClButton, { size: "sm", onClick: () => onEvent({ type: "ON_RETRY" }), children: "Try again" })
-          ]
-        }
-      );
-    case "ready":
-      return /* @__PURE__ */ jsx61("div", { className: cn("clcosdk:w-full", className), children: /* @__PURE__ */ jsx61(
-        SumsubWebSdk,
-        {
-          accessToken: state.accessToken,
-          expirationHandler: state.refreshToken,
-          config: state.locale === void 0 ? {} : { lang: state.locale },
-          options: { addViewportTag: false, adaptIframeHeight: true },
-          onMessage: (type, payload) => {
-            onSumsubMessage(type, payload, onEvent);
-          },
-          onError: (error) => {
-            onEvent({ type: "ON_ERROR", error: toError(error) });
-          }
-        }
-      ) });
-    default: {
-      const exhaustive = state;
-      return exhaustive;
-    }
-  }
-}
-function onSumsubMessage(type, payload, onEvent) {
-  switch (type) {
-    case "idCheck.onApplicantSubmitted":
-      onEvent({ type: "ON_SUBMITTED" });
-      return;
-    case "idCheck.onError": {
-      const message = payload?.message ?? "Verification error";
-      onEvent({ type: "ON_ERROR", error: new Error(message) });
-      return;
-    }
-    default:
-      return;
-  }
-}
-function toError(error) {
-  return error instanceof Error ? error : new Error("Verification error");
-}
-
-// src/client/hooks/requirements/identity-verification/useIdentityVerificationViewModel.ts
-import { useCallback as useCallback7, useEffect as useEffect21, useMemo as useMemo5, useRef as useRef15 } from "react";
-
-// src/client/hooks/requirements/data/useKycToken.ts
-import { useCallback as useCallback6, useEffect as useEffect20, useRef as useRef14, useState as useState25 } from "react";
-var IDLE_STATE = { type: "IDLE" };
-var LOADING_STATE3 = { type: "LOADING" };
-function useKycToken(levelName, reset) {
-  const { coinlist } = useCoinList();
-  const log = useLogger("useKycToken");
-  const [kycTokenState, setKycTokenState] = useState25(IDLE_STATE);
-  const resetPendingRef = useRef14(reset === true);
-  const tokenIssuedRef = useRef14(false);
-  useEffect20(() => {
-    if (!tokenIssuedRef.current) {
-      resetPendingRef.current = reset === true;
-    }
-  }, [reset]);
-  const fetchToken = useCallback6(async () => {
-    setKycTokenState(LOADING_STATE3);
-    try {
-      const kycToken = await coinlist.requirements.createKycToken({
-        levelName,
-        reset: resetPendingRef.current
-      });
-      resetPendingRef.current = false;
-      tokenIssuedRef.current = true;
-      log.debug(() => ({
-        msg: "settled",
-        fields: { state: "CONTENT" }
-      }));
-      setKycTokenState({ type: "CONTENT", token: kycToken.token });
-      return kycToken.token;
-    } catch (error) {
-      const reason = error instanceof NotAuthenticatedError ? "not-authenticated" : "generic-error";
-      log.failure(
-        () => ({ msg: "settled", fields: { state: "ERROR", reason } }),
-        error
-      );
-      setKycTokenState({ type: "ERROR", reason });
-      throw error;
-    }
-  }, [coinlist, levelName, log]);
-  return { kycTokenState, fetchToken };
-}
-
-// src/client/hooks/requirements/identity-verification/useIdentityVerificationViewModel.ts
-var NOT_AUTHENTICATED_MESSAGE2 = "Sign in to verify your identity.";
-var GENERIC_ERROR_MESSAGE2 = "Unable to start identity verification right now. Please try again.";
-function useIdentityVerificationViewModel(options = {}) {
-  const { levelName, reset, locale, onSubmitted, onError } = options;
-  const { kycTokenState, fetchToken } = useKycToken(levelName, reset);
-  const fetchedRef = useRef15(false);
-  useEffect21(() => {
-    if (fetchedRef.current) {
-      return;
-    }
-    fetchedRef.current = true;
-    fetchToken().catch(() => {
-    });
-  }, [fetchToken]);
-  const state = useMemo5(() => {
-    switch (kycTokenState.type) {
-      case "IDLE":
-      case "LOADING":
-        return { type: "loading" };
-      case "ERROR": {
-        const notAuthenticated = kycTokenState.reason === "not-authenticated";
-        return {
-          type: "error",
-          message: notAuthenticated ? NOT_AUTHENTICATED_MESSAGE2 : GENERIC_ERROR_MESSAGE2,
-          retryable: !notAuthenticated
-        };
-      }
-      case "CONTENT":
-        return {
-          type: "ready",
-          accessToken: kycTokenState.token,
-          locale,
-          refreshToken: fetchToken
-        };
-      default: {
-        const exhaustive = kycTokenState;
-        return exhaustive;
-      }
-    }
-  }, [kycTokenState, locale, fetchToken]);
-  const onEvent = useCallback7(
-    (event) => {
-      switch (event.type) {
-        case "ON_RETRY":
-          fetchToken().catch(() => {
-          });
-          return;
-        case "ON_SUBMITTED":
-          onSubmitted?.();
-          return;
-        case "ON_ERROR":
-          onError?.(event.error);
-          return;
-        default: {
-          const exhaustive = event;
-          return exhaustive;
-        }
-      }
-    },
-    [fetchToken, onSubmitted, onError]
-  );
-  return { state, onEvent };
+    default: {
+      const exhaustive = state;
+      return exhaustive;
+    }
+  }
 }
-
-// src/client/components/requirements/identity-verification/IdentityVerificationContainer.tsx
-import { jsx as jsx62 } from "react/jsx-runtime";
-function IdentityVerificationContainer({
-  levelName,
-  reset,
-  locale,
-  onSubmitted,
-  onError,
-  className
-}) {
-  const { state, onEvent } = useIdentityVerificationViewModel({
-    levelName,
-    reset,
-    locale,
-    onSubmitted,
-    onError
-  });
-  return /* @__PURE__ */ jsx62(
-    IdentityVerificationView,
+function LoadingState2() {
+  return /* @__PURE__ */ jsx61(
+    "output",
     {
-      state,
-      onEvent,
-      className
+      "aria-live": "polite",
+      className: "clcosdk:flex clcosdk:min-h-40 clcosdk:items-center clcosdk:justify-center clcosdk:rounded-2xl clcosdk:border clcosdk:border-border clcosdk:bg-background clcosdk:p-6",
+      children: /* @__PURE__ */ jsx61("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: "Loading requirements..." })
     }
   );
 }
 
 // src/client/components/requirements/tax-document/TaxDocumentModalView.tsx
-import { jsx as jsx63, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs44 } from "react/jsx-runtime";
 function TaxDocumentModalView({
   state,
   onEvent,
@@ -10279,7 +10414,7 @@ function TaxDocumentModalView({
   if (state.type === "hidden") {
     return null;
   }
-  return /* @__PURE__ */ jsx63(CoinListStyleScope, { children: /* @__PURE__ */ jsx63("div", { className: "clcosdk:fixed clcosdk:inset-0 clcosdk:z-50 clcosdk:flex clcosdk:items-center clcosdk:justify-center clcosdk:bg-black/50 clcosdk:p-4", children: /* @__PURE__ */ jsxs45(
+  return /* @__PURE__ */ jsx62(CoinListStyleScope, { children: /* @__PURE__ */ jsx62("div", { className: "clcosdk:fixed clcosdk:inset-0 clcosdk:z-50 clcosdk:flex clcosdk:items-center clcosdk:justify-center clcosdk:bg-black/50 clcosdk:p-4", children: /* @__PURE__ */ jsxs44(
     "div",
     {
       className: cn(
@@ -10287,11 +10422,11 @@ function TaxDocumentModalView({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs45("div", { className: "clcosdk:flex clcosdk:items-start clcosdk:justify-between clcosdk:gap-4", children: [
-          /* @__PURE__ */ jsx63("h3", { className: cn(typeClasses.h3, "clcosdk:text-text-primary"), children: state.title }),
-          /* @__PURE__ */ jsx63(CloseButton, { onClick: () => onEvent({ type: "ON_CLOSE" }) })
+        /* @__PURE__ */ jsxs44("div", { className: "clcosdk:flex clcosdk:items-start clcosdk:justify-between clcosdk:gap-4", children: [
+          /* @__PURE__ */ jsx62("h3", { className: cn(typeClasses.h3, "clcosdk:text-text-primary"), children: state.title }),
+          /* @__PURE__ */ jsx62(CloseButton, { onClick: () => onEvent({ type: "ON_CLOSE" }) })
         ] }),
-        /* @__PURE__ */ jsx63(Screen, { screen: state.screen, onEvent })
+        /* @__PURE__ */ jsx62(Screen, { screen: state.screen, onEvent })
       ]
     }
   ) }) });
@@ -10302,11 +10437,11 @@ function Screen({
 }) {
   switch (screen.type) {
     case "loading":
-      return /* @__PURE__ */ jsx63(LoadingScreen, {});
+      return /* @__PURE__ */ jsx62(LoadingScreen, {});
     case "error":
-      return /* @__PURE__ */ jsx63(AlertBanner, { variant: "error", icon: true, content: screen.message });
+      return /* @__PURE__ */ jsx62(AlertBanner, { variant: "error", icon: true, content: screen.message });
     case "review":
-      return /* @__PURE__ */ jsx63(
+      return /* @__PURE__ */ jsx62(
         ReviewScreen,
         {
           fields: screen.fields,
@@ -10317,9 +10452,9 @@ function Screen({
         }
       );
     case "editing":
-      return /* @__PURE__ */ jsx63(EditScreen, { fields: screen.fields, onEvent });
+      return /* @__PURE__ */ jsx62(EditScreen, { fields: screen.fields, onEvent });
     case "sign-only":
-      return /* @__PURE__ */ jsx63(
+      return /* @__PURE__ */ jsx62(
         SignOnlyScreen,
         {
           signing: screen.signing,
@@ -10334,14 +10469,14 @@ function Screen({
   }
 }
 function LoadingScreen() {
-  return /* @__PURE__ */ jsx63(
+  return /* @__PURE__ */ jsx62(
     "output",
     {
       "aria-live": "polite",
       className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-4",
-      children: [0, 1, 2, 3, 4].map((row) => /* @__PURE__ */ jsxs45("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-1", children: [
-        /* @__PURE__ */ jsx63("div", { className: "clcosdk:h-3 clcosdk:w-28 clcosdk:animate-pulse clcosdk:rounded clcosdk:bg-surface" }),
-        /* @__PURE__ */ jsx63("div", { className: "clcosdk:h-5 clcosdk:w-48 clcosdk:animate-pulse clcosdk:rounded clcosdk:bg-surface" })
+      children: [0, 1, 2, 3, 4].map((row) => /* @__PURE__ */ jsxs44("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-1", children: [
+        /* @__PURE__ */ jsx62("div", { className: "clcosdk:h-3 clcosdk:w-28 clcosdk:animate-pulse clcosdk:rounded clcosdk:bg-surface" }),
+        /* @__PURE__ */ jsx62("div", { className: "clcosdk:h-5 clcosdk:w-48 clcosdk:animate-pulse clcosdk:rounded clcosdk:bg-surface" })
       ] }, row))
     }
   );
@@ -10353,9 +10488,9 @@ function ReviewScreen({
   signError,
   onEvent
 }) {
-  return /* @__PURE__ */ jsxs45("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-6", children: [
-    /* @__PURE__ */ jsx63("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: "Review your information below. If anything looks incorrect, edit before signing." }),
-    piiUnavailable && /* @__PURE__ */ jsx63(
+  return /* @__PURE__ */ jsxs44("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-6", children: [
+    /* @__PURE__ */ jsx62("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: "Review your information below. If anything looks incorrect, edit before signing." }),
+    piiUnavailable && /* @__PURE__ */ jsx62(
       AlertBanner,
       {
         variant: "info",
@@ -10363,27 +10498,27 @@ function ReviewScreen({
         content: "We don't have this information on file yet \u2014 please fill it in below."
       }
     ),
-    /* @__PURE__ */ jsx63("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-4 clcosdk:border-t clcosdk:border-divider clcosdk:pt-4", children: fields.map(({ field, label, displayValue }) => /* @__PURE__ */ jsxs45(
+    /* @__PURE__ */ jsx62("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-4 clcosdk:border-t clcosdk:border-divider clcosdk:pt-4", children: fields.map(({ field, label, displayValue }) => /* @__PURE__ */ jsxs44(
       "div",
       {
         className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-1",
         children: [
-          /* @__PURE__ */ jsx63(
+          /* @__PURE__ */ jsx62(
             "span",
             {
               className: cn(typeClasses.label, "clcosdk:text-text-secondary"),
               children: label
             }
           ),
-          /* @__PURE__ */ jsx63("span", { className: cn(typeClasses.body, "clcosdk:text-text-primary"), children: displayValue })
+          /* @__PURE__ */ jsx62("span", { className: cn(typeClasses.body, "clcosdk:text-text-primary"), children: displayValue })
         ]
       },
       field
     )) }),
-    /* @__PURE__ */ jsx63("p", { className: cn(typeClasses.caption, "clcosdk:text-text-secondary"), children: "By signing, you certify that the information above is accurate and that you are the beneficial owner of the income this form relates to. This document cannot be edited once signed." }),
-    signError && /* @__PURE__ */ jsx63(AlertBanner, { variant: "error", icon: true, content: signError }),
-    /* @__PURE__ */ jsxs45("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-2", children: [
-      /* @__PURE__ */ jsx63(
+    /* @__PURE__ */ jsx62("p", { className: cn(typeClasses.caption, "clcosdk:text-text-secondary"), children: "By signing, you certify that the information above is accurate and that you are the beneficial owner of the income this form relates to. This document cannot be edited once signed." }),
+    signError && /* @__PURE__ */ jsx62(AlertBanner, { variant: "error", icon: true, content: signError }),
+    /* @__PURE__ */ jsxs44("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-2", children: [
+      /* @__PURE__ */ jsx62(
         ClButton,
         {
           fullWidth: true,
@@ -10393,7 +10528,7 @@ function ReviewScreen({
           children: "Sign W-8BEN"
         }
       ),
-      /* @__PURE__ */ jsx63(
+      /* @__PURE__ */ jsx62(
         ClButton,
         {
           fullWidth: true,
@@ -10410,20 +10545,20 @@ function EditScreen({
   fields,
   onEvent
 }) {
-  return /* @__PURE__ */ jsxs45("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-6", children: [
-    /* @__PURE__ */ jsx63("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-4 clcosdk:border-t clcosdk:border-divider clcosdk:pt-4", children: fields.map(({ field, label, placeholder, value }) => /* @__PURE__ */ jsxs45(
+  return /* @__PURE__ */ jsxs44("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-6", children: [
+    /* @__PURE__ */ jsx62("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-4 clcosdk:border-t clcosdk:border-divider clcosdk:pt-4", children: fields.map(({ field, label, placeholder, value }) => /* @__PURE__ */ jsxs44(
       "label",
       {
         className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-1",
         children: [
-          /* @__PURE__ */ jsx63(
+          /* @__PURE__ */ jsx62(
             "span",
             {
               className: cn(typeClasses.label, "clcosdk:text-text-secondary"),
               children: label
             }
           ),
-          /* @__PURE__ */ jsx63(
+          /* @__PURE__ */ jsx62(
             "input",
             {
               type: "text",
@@ -10444,9 +10579,9 @@ function EditScreen({
       },
       field
     )) }),
-    /* @__PURE__ */ jsxs45("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-2", children: [
-      /* @__PURE__ */ jsx63(ClButton, { fullWidth: true, onClick: () => onEvent({ type: "ON_SAVE_EDIT" }), children: "Save & review" }),
-      /* @__PURE__ */ jsx63(
+    /* @__PURE__ */ jsxs44("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-2", children: [
+      /* @__PURE__ */ jsx62(ClButton, { fullWidth: true, onClick: () => onEvent({ type: "ON_SAVE_EDIT" }), children: "Save & review" }),
+      /* @__PURE__ */ jsx62(
         ClButton,
         {
           fullWidth: true,
@@ -10463,10 +10598,10 @@ function SignOnlyScreen({
   signError,
   onEvent
 }) {
-  return /* @__PURE__ */ jsxs45("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-6", children: [
-    /* @__PURE__ */ jsx63("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: "As an entity investor, you must complete a W-8BEN-E to confirm your foreign tax status and claim applicable treaty benefits. You'll receive an email to complete the signing." }),
-    signError && /* @__PURE__ */ jsx63(AlertBanner, { variant: "error", icon: true, content: signError }),
-    /* @__PURE__ */ jsx63(
+  return /* @__PURE__ */ jsxs44("div", { className: "clcosdk:flex clcosdk:flex-col clcosdk:gap-6", children: [
+    /* @__PURE__ */ jsx62("p", { className: cn(typeClasses.body, "clcosdk:text-text-secondary"), children: "As an entity investor, you must complete a W-8BEN-E to confirm your foreign tax status and claim applicable treaty benefits. You'll receive an email to complete the signing." }),
+    signError && /* @__PURE__ */ jsx62(AlertBanner, { variant: "error", icon: true, content: signError }),
+    /* @__PURE__ */ jsx62(
       ClButton,
       {
         fullWidth: true,
@@ -10480,12 +10615,12 @@ function SignOnlyScreen({
 }
 
 // src/client/hooks/requirements/tax-document/useTaxDocumentModalViewModel.ts
-import { useCallback as useCallback9, useEffect as useEffect23, useMemo as useMemo6 } from "react";
+import { useCallback as useCallback10, useEffect as useEffect24, useMemo as useMemo6 } from "react";
 
 // src/client/hooks/requirements/data/useTaxDocument.ts
-import { useCallback as useCallback8, useEffect as useEffect22, useState as useState26 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect23, useState as useState27 } from "react";
 var IDLE_SIGN = { type: "idle", error: null };
-var LOADING_STATE4 = { type: "LOADING" };
+var LOADING_STATE5 = { type: "LOADING" };
 var SIGN_FAILED_MESSAGE = "Unable to sign document. Please try again.";
 var DOB_INVALID_MESSAGE = "Enter your date of birth as MM/DD/YYYY.";
 var FIELD_KEYS = {
@@ -10558,8 +10693,8 @@ function useTaxDocument({
 }) {
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useTaxDocument");
-  const [state, setState] = useState26(LOADING_STATE4);
-  useEffect22(() => {
+  const [state, setState] = useState27(LOADING_STATE5);
+  useEffect23(() => {
     let isCancelled = false;
     if (!isOpen) {
       return () => {
@@ -10567,12 +10702,12 @@ function useTaxDocument({
       };
     }
     if (!isReady) {
-      setState(LOADING_STATE4);
+      setState(LOADING_STATE5);
       return () => {
         isCancelled = true;
       };
     }
-    setState(LOADING_STATE4);
+    setState(LOADING_STATE5);
     coinlist.requirements.getPii().then((pii) => {
       if (isCancelled) return;
       if (pii.kind === "company") {
@@ -10600,7 +10735,7 @@ function useTaxDocument({
       isCancelled = true;
     };
   }, [coinlist, isReady, isOpen, log]);
-  const onEditField = useCallback8(
+  const onEditField = useCallback9(
     (field, value) => {
       setState(
         (prev) => prev.type === "EDITING" ? { ...prev, fields: { ...prev.fields, [field]: value } } : prev
@@ -10608,7 +10743,7 @@ function useTaxDocument({
     },
     []
   );
-  const onStartEdit = useCallback8(() => {
+  const onStartEdit = useCallback9(() => {
     setState(
       (prev) => prev.type === "REVIEW" ? {
         type: "EDITING",
@@ -10619,7 +10754,7 @@ function useTaxDocument({
       } : prev
     );
   }, []);
-  const onSaveEdit = useCallback8(() => {
+  const onSaveEdit = useCallback9(() => {
     setState(
       (prev) => prev.type === "EDITING" ? {
         type: "REVIEW",
@@ -10630,7 +10765,7 @@ function useTaxDocument({
       } : prev
     );
   }, []);
-  const onCancelEdit = useCallback8(() => {
+  const onCancelEdit = useCallback9(() => {
     setState(
       (prev) => prev.type === "EDITING" ? {
         type: "REVIEW",
@@ -10641,7 +10776,7 @@ function useTaxDocument({
       } : prev
     );
   }, []);
-  const onSign = useCallback8(() => {
+  const onSign = useCallback9(() => {
     if (state.type !== "REVIEW" && state.type !== "SIGN_ONLY") return;
     if (state.type === "REVIEW" && state.fields.dob.trim() !== "" && !isValidUsDate(state.fields.dob)) {
       setState({
@@ -10683,7 +10818,7 @@ function useTaxDocumentModalViewModel({
   onSubmitted
 }) {
   const { state, onEditField, onStartEdit, onSaveEdit, onCancelEdit, onSign } = useTaxDocument({ isOpen });
-  useEffect23(() => {
+  useEffect24(() => {
     if (state.type === "SUBMITTED") {
       onSubmitted?.(state.submission);
       onClose();
@@ -10695,7 +10830,7 @@ function useTaxDocumentModalViewModel({
     }
     return { type: "content", title: toTitle(state), screen: toScreen(state) };
   }, [isOpen, state]);
-  const onEvent = useCallback9(
+  const onEvent = useCallback10(
     (event) => {
       switch (event.type) {
         case "ON_CLOSE":
@@ -10778,7 +10913,7 @@ function toFieldsUi(fields) {
 }
 
 // src/client/components/requirements/tax-document/TaxDocumentModalContainer.tsx
-import { jsx as jsx64 } from "react/jsx-runtime";
+import { jsx as jsx63 } from "react/jsx-runtime";
 function TaxDocumentModalContainer({
   isOpen,
   onClose,
@@ -10790,7 +10925,7 @@ function TaxDocumentModalContainer({
     onClose,
     onSubmitted
   });
-  return /* @__PURE__ */ jsx64(
+  return /* @__PURE__ */ jsx63(
     TaxDocumentModalView,
     {
       state,
@@ -10800,6 +10935,39 @@ function TaxDocumentModalContainer({
   );
 }
 
+// src/client/components/requirements/VerificationOverlay.tsx
+import { jsx as jsx64, jsxs as jsxs45 } from "react/jsx-runtime";
+function VerificationOverlay({
+  onClose,
+  children
+}) {
+  return /* @__PURE__ */ jsx64(CoinListStyleScope, { children: /* @__PURE__ */ jsx64(VerificationOverlayBody, { onClose, children }) });
+}
+function VerificationOverlayBody({
+  onClose,
+  children
+}) {
+  return /* @__PURE__ */ jsx64(
+    "div",
+    {
+      role: "dialog",
+      "aria-modal": "true",
+      "aria-label": "Identity verification",
+      className: "clcosdk:fixed clcosdk:inset-0 clcosdk:z-50 clcosdk:flex clcosdk:items-center clcosdk:justify-center clcosdk:bg-overlay clcosdk:p-4",
+      children: /* @__PURE__ */ jsxs45("div", { className: "clcosdk:relative clcosdk:flex clcosdk:max-h-[92vh] clcosdk:w-full clcosdk:max-w-[760px] clcosdk:flex-col clcosdk:overflow-y-auto clcosdk:rounded-2xl clcosdk:bg-background clcosdk:p-6 clcosdk:pt-14", children: [
+        /* @__PURE__ */ jsx64(
+          CloseButton,
+          {
+            onClick: onClose,
+            className: "clcosdk:absolute clcosdk:top-4 clcosdk:right-4"
+          }
+        ),
+        children
+      ] })
+    }
+  );
+}
+
 // src/client/components/requirements/wallet/ConnectWalletModalView.tsx
 import { useId as useId5 } from "react";
 import { jsx as jsx65, jsxs as jsxs46 } from "react/jsx-runtime";
@@ -10911,10 +11079,10 @@ function Screen2({
 }
 
 // src/client/hooks/requirements/wallet/useConnectWalletModalViewModel.ts
-import { useCallback as useCallback11, useEffect as useEffect25, useMemo as useMemo7 } from "react";
+import { useCallback as useCallback12, useEffect as useEffect26, useMemo as useMemo7 } from "react";
 
 // src/client/hooks/requirements/data/useConnectWallet.ts
-import { useCallback as useCallback10, useEffect as useEffect24, useRef as useRef16, useState as useState27 } from "react";
+import { useCallback as useCallback11, useEffect as useEffect25, useRef as useRef16, useState as useState28 } from "react";
 
 // src/client/core/wallets/connect-external-wallet.ts
 var DEFAULT_STATEMENT = "Sign this message to prove you own this wallet. This does not cost gas or move funds.";
@@ -11045,24 +11213,24 @@ function useConnectWallet({
   statement
 }) {
   const { coinlist } = useCoinList();
-  const [state, setState] = useState27(
+  const [state, setState] = useState28(
     () => wallet ? { type: "READY", address: wallet.address, sign: IDLE_SIGN2 } : { type: "NEEDS_WALLET" }
   );
   const attempt = useRef16(0);
-  useEffect24(() => {
+  useEffect25(() => {
     attempt.current += 1;
     if (!isOpen) return;
     setState(
       wallet ? { type: "READY", address: wallet.address, sign: IDLE_SIGN2 } : { type: "NEEDS_WALLET" }
     );
   }, [isOpen, wallet?.address]);
-  useEffect24(
+  useEffect25(
     () => () => {
       attempt.current += 1;
     },
     []
   );
-  const onSign = useCallback10(() => {
+  const onSign = useCallback11(() => {
     if (!wallet || state.type !== "READY") return;
     attempt.current += 1;
     const gen = attempt.current;
@@ -11124,7 +11292,7 @@ function useConnectWalletModalViewModel({
     challengeType,
     statement
   });
-  useEffect25(() => {
+  useEffect26(() => {
     if (state.type === "CONNECTED") {
       onConnected?.(state.binding);
       onClose();
@@ -11155,7 +11323,7 @@ function useConnectWalletModalViewModel({
       canRequestConnect
     };
   }, [isOpen, state, onRequestConnect]);
-  const onEvent = useCallback11(
+  const onEvent = useCallback12(
     (event) => {
       switch (event.type) {
         case "ON_CLOSE":
@@ -11195,63 +11363,12 @@ function ConnectWalletModalContainer({
   );
 }
 
-// src/client/hooks/requirements/checklist/useRequirementsChecklistViewModel.ts
-import { useCallback as useCallback14, useEffect as useEffect28, useMemo as useMemo8, useRef as useRef17, useState as useState30 } from "react";
-
-// src/client/hooks/requirements/checklist/useRequirementsChecklistViewModel.types.ts
-var RequirementItemUi = {
-  fromDomain(req, statusInfo, label, description2, addresses = []) {
-    return {
-      variant: RequirementVariant.fromType(req.type),
-      status: statusInfo ? RequirementStatus.fromStatusValue(statusInfo.status) : "required",
-      label,
-      description: description2,
-      multiWallet: req.type === "whitelisted_wallet",
-      connectedWallets: addresses.map((address) => ({
-        id: address.id,
-        address: address.address,
-        shortAddress: shortenAddress(address.address)
-      }))
-    };
-  }
-};
-var RequirementVariant = {
-  fromType(type) {
-    switch (type) {
-      case "external_wallet":
-      case "whitelisted_wallet":
-        return "wallet";
-      default:
-        return "verification";
-    }
-  }
-};
-var RequirementStatus = {
-  fromStatusValue(status) {
-    switch (status) {
-      case "not_started":
-      case "action_needed":
-        return "required";
-      case "in_progress":
-        return "pending";
-      case "completed":
-        return "completed";
-      case "rejected":
-        return "rejected";
-    }
-  }
-};
-var ChecklistStatus = {
-  derive(statuses) {
-    if (statuses.some((s) => s.status === "rejected")) return "ineligible";
-    if (statuses.every((s) => s.status === "completed")) return "eligible";
-    return "inProgress";
-  }
-};
+// src/client/hooks/requirements/useRequirementsChecklistViewModel.ts
+import { useCallback as useCallback15, useEffect as useEffect29, useMemo as useMemo8, useRef as useRef17, useState as useState31 } from "react";
 
 // src/client/hooks/requirements/data/useOptionAddresses.ts
-import { useCallback as useCallback12, useEffect as useEffect26, useState as useState28 } from "react";
-var LOADING_STATE5 = { type: "LOADING" };
+import { useCallback as useCallback13, useEffect as useEffect27, useState as useState29 } from "react";
+var LOADING_STATE6 = { type: "LOADING" };
 var EMPTY_STATE = {
   type: "CONTENT",
   addresses: []
@@ -11260,19 +11377,19 @@ function useOptionAddresses(offerId, offerOptionId, options = {}) {
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useOptionAddresses");
   const { data, enabled = true } = options;
-  const [addressesState, setAddressesState] = useState28(
-    data !== void 0 ? { type: "CONTENT", addresses: data } : LOADING_STATE5
+  const [addressesState, setAddressesState] = useState29(
+    data !== void 0 ? { type: "CONTENT", addresses: data } : LOADING_STATE6
   );
-  const [fetchKey, setFetchKey] = useState28(0);
-  const refetch = useCallback12(() => setFetchKey((k) => k + 1), []);
-  const disconnect = useCallback12(
+  const [fetchKey, setFetchKey] = useState29(0);
+  const refetch = useCallback13(() => setFetchKey((k) => k + 1), []);
+  const disconnect = useCallback13(
     async (addressId) => {
       await coinlist.wallets.remove({ offerId, addressId });
       refetch();
     },
     [coinlist, offerId, refetch]
   );
-  useEffect26(() => {
+  useEffect27(() => {
     let isCancelled = false;
     if (!enabled) {
       setAddressesState(
@@ -11284,7 +11401,7 @@ function useOptionAddresses(offerId, offerOptionId, options = {}) {
     }
     if (!isReady) {
       if (data === void 0) {
-        setAddressesState(LOADING_STATE5);
+        setAddressesState(LOADING_STATE6);
       }
       return () => {
         isCancelled = true;
@@ -11301,7 +11418,7 @@ function useOptionAddresses(offerId, offerOptionId, options = {}) {
         isCancelled = true;
       };
     }
-    setAddressesState(LOADING_STATE5);
+    setAddressesState(LOADING_STATE6);
     coinlist.wallets.list({ offerId, offerOptionId }).then((addresses) => {
       if (!isCancelled) {
         log.debug(() => ({
@@ -11328,22 +11445,22 @@ function useOptionAddresses(offerId, offerOptionId, options = {}) {
 }
 
 // src/client/hooks/requirements/data/useRequirements.ts
-import { useCallback as useCallback13, useEffect as useEffect27, useState as useState29 } from "react";
-var LOADING_STATE6 = { type: "LOADING" };
+import { useCallback as useCallback14, useEffect as useEffect28, useState as useState30 } from "react";
+var LOADING_STATE7 = { type: "LOADING" };
 function useRequirements(offerId, options = {}) {
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useRequirements");
   const { data } = options;
-  const [requirementsState, setRequirementsState] = useState29(
-    data !== void 0 ? { type: "CONTENT", ...data } : LOADING_STATE6
+  const [requirementsState, setRequirementsState] = useState30(
+    data !== void 0 ? { type: "CONTENT", ...data } : LOADING_STATE7
   );
-  const [fetchKey, setFetchKey] = useState29(0);
-  const refetch = useCallback13(() => setFetchKey((k) => k + 1), []);
-  useEffect27(() => {
+  const [fetchKey, setFetchKey] = useState30(0);
+  const refetch = useCallback14(() => setFetchKey((k) => k + 1), []);
+  useEffect28(() => {
     let isCancelled = false;
     if (!isReady) {
       if (data === void 0) {
-        setRequirementsState(LOADING_STATE6);
+        setRequirementsState(LOADING_STATE7);
       }
       return () => {
         isCancelled = true;
@@ -11360,7 +11477,7 @@ function useRequirements(offerId, options = {}) {
         isCancelled = true;
       };
     }
-    setRequirementsState(LOADING_STATE6);
+    setRequirementsState(LOADING_STATE7);
     Promise.all([
       coinlist.requirements.forOffer(offerId),
       coinlist.requirements.statuses(offerId)
@@ -11397,7 +11514,58 @@ function useRequirements(offerId, options = {}) {
   return { requirementsState, refetch };
 }
 
-// src/client/hooks/requirements/checklist/useRequirementsChecklistViewModel.ts
+// src/client/hooks/requirements/useRequirementsChecklistViewModel.types.ts
+var RequirementItemUi = {
+  fromDomain(req, statusInfo, label, description2, addresses = []) {
+    return {
+      variant: RequirementVariant.fromType(req.type),
+      status: statusInfo ? RequirementStatus.fromStatusValue(statusInfo.status) : "required",
+      label,
+      description: description2,
+      multiWallet: req.type === "whitelisted_wallet",
+      connectedWallets: addresses.map((address) => ({
+        id: address.id,
+        address: address.address,
+        shortAddress: shortenAddress(address.address)
+      }))
+    };
+  }
+};
+var RequirementVariant = {
+  fromType(type) {
+    switch (type) {
+      case "external_wallet":
+      case "whitelisted_wallet":
+        return "wallet";
+      default:
+        return "verification";
+    }
+  }
+};
+var RequirementStatus = {
+  fromStatusValue(status) {
+    switch (status) {
+      case "not_started":
+      case "action_needed":
+        return "required";
+      case "in_progress":
+        return "pending";
+      case "completed":
+        return "completed";
+      case "rejected":
+        return "rejected";
+    }
+  }
+};
+var ChecklistStatus = {
+  derive(statuses) {
+    if (statuses.some((s) => s.status === "rejected")) return "ineligible";
+    if (statuses.every((s) => s.status === "completed")) return "eligible";
+    return "inProgress";
+  }
+};
+
+// src/client/hooks/requirements/useRequirementsChecklistViewModel.ts
 var DEFAULT_LABELS = {
   kyc_approved: "KYC Verification",
   external_wallet: "External Wallet",
@@ -11439,19 +11607,19 @@ function useRequirementsChecklistViewModel(options) {
   const log = useLogger("useRequirementsChecklistViewModel");
   const { coinlist } = useCoinList();
   const { requirementsState, refetch } = useRequirements(offerId, { data });
-  const [expandedId, setExpandedId] = useState30(null);
-  const [taxDocumentOpen, setTaxDocumentOpen] = useState30(false);
-  const [connectWalletOpen, setConnectWalletOpen] = useState30(false);
-  const [verifyingRequirementId, setVerifyingRequirementId] = useState30(null);
+  const [expandedId, setExpandedId] = useState31(null);
+  const [taxDocumentOpen, setTaxDocumentOpen] = useState31(false);
+  const [connectWalletOpen, setConnectWalletOpen] = useState31(false);
+  const [verifyingRequirementId, setVerifyingRequirementId] = useState31(null);
   const isMountedRef = useRef17(true);
-  useEffect28(() => {
+  useEffect29(() => {
     isMountedRef.current = true;
     return () => {
       isMountedRef.current = false;
     };
   }, []);
-  const [hasWalletRequirement, setHasWalletRequirement] = useState30(false);
-  useEffect28(() => {
+  const [hasWalletRequirement, setHasWalletRequirement] = useState31(false);
+  useEffect29(() => {
     if (requirementsState.type === "CONTENT") {
       setHasWalletRequirement(
         (requirementsState.requirements[optionId] ?? []).some(
@@ -11467,14 +11635,14 @@ function useRequirementsChecklistViewModel(options) {
   } = useOptionAddresses(offerId, optionId, {
     enabled: hasWalletRequirement
   });
-  const removeWallet = useCallback14(
+  const removeWallet = useCallback15(
     async (addressId) => {
       await disconnect(OfferOptionAddressId(addressId));
       refetch();
     },
     [disconnect, refetch]
   );
-  const awaitVerificationResult = useCallback14(
+  const awaitVerificationResult = useCallback15(
     (requirementId, statusBeforeSubmit) => {
       void (async () => {
         const deadline = Date.now() + VERIFICATION_POLL_TIMEOUT_MS;
@@ -11583,7 +11751,7 @@ function useRequirementsChecklistViewModel(options) {
     identityVerificationOptions,
     removeWallet
   ]);
-  const handleRequirementAction = useCallback14(
+  const handleRequirementAction = useCallback15(
     (requirement) => {
       const inlineVerification = statusById.get(requirement.id)?.kycLevel !== void 0 && onRequirementActionOverride === void 0;
       if (inlineVerification) {
@@ -11615,7 +11783,7 @@ function useRequirementsChecklistViewModel(options) {
       coinlist
     ]
   );
-  const onEvent = useCallback14(
+  const onEvent = useCallback15(
     (event) => {
       switch (event.type) {
         case "ON_TOGGLE_ITEM":
@@ -11712,7 +11880,7 @@ function toVerificationUi(verifyingRequirementId, statusById, identityVerificati
   };
 }
 
-// src/client/components/requirements/checklist/RequirementsChecklistContainer.tsx
+// src/client/components/requirements/RequirementsChecklistContainer.tsx
 import { Fragment as Fragment10, jsx as jsx67, jsxs as jsxs47 } from "react/jsx-runtime";
 function RequirementsChecklistContainer({
   loading,
@@ -11778,7 +11946,7 @@ function RequirementsChecklistContainer({
   ] });
 }
 
-// src/client/core/observability/pino-client-logger.ts
+// src/client/core/shared/observability/pino-client-logger.ts
 import { pino } from "pino";
 function pinoClientLogger(options) {
   return loggerOverPino(
@@ -11795,7 +11963,7 @@ function pinoClientLogger(options) {
 }
 
 // src/client/hooks/auth/useCompleteOAuth.ts
-import { useEffect as useEffect29, useRef as useRef18 } from "react";
+import { useEffect as useEffect30, useRef as useRef18 } from "react";
 function useCompleteOAuth(options) {
   const { coinlist } = useCoinList();
   const log = useLogger("useCompleteOAuth");
@@ -11806,7 +11974,7 @@ function useCompleteOAuth(options) {
   onFailureRef.current = options.onFailure;
   onSuccessRef.current = options.onSuccess;
   const hasStartedExchangeRef = useRef18(false);
-  useEffect29(() => {
+  useEffect30(() => {
     if (typeof window === "undefined") return;
     const params = new URLSearchParams(window.location.search);
     if (!params.has("code") && !params.has("error")) return;
@@ -11870,20 +12038,20 @@ function useCompleteOAuth(options) {
 }
 
 // src/client/hooks/checkout/coin-list/token-sale/data/useParticipations.ts
-import { useEffect as useEffect30, useState as useState31 } from "react";
-var LOADING_STATE7 = { type: "LOADING" };
+import { useEffect as useEffect31, useState as useState32 } from "react";
+var LOADING_STATE8 = { type: "LOADING" };
 function useParticipations(offerId, options = {}) {
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useParticipations");
   const { data } = options;
-  const [participationsState, setParticipationsState] = useState31(
-    data !== void 0 ? { type: "CONTENT", participations: data } : LOADING_STATE7
+  const [participationsState, setParticipationsState] = useState32(
+    data !== void 0 ? { type: "CONTENT", participations: data } : LOADING_STATE8
   );
-  useEffect30(() => {
+  useEffect31(() => {
     let isCancelled = false;
     if (!isReady) {
       if (data === void 0) {
-        setParticipationsState(LOADING_STATE7);
+        setParticipationsState(LOADING_STATE8);
       }
       return () => {
         isCancelled = true;
@@ -11894,7 +12062,7 @@ function useParticipations(offerId, options = {}) {
         isCancelled = true;
       };
     }
-    setParticipationsState(LOADING_STATE7);
+    setParticipationsState(LOADING_STATE8);
     coinlist.tokenSale.list(offerId).then((participations) => {
       if (!isCancelled) {
         log.debug(() => ({
@@ -11921,20 +12089,20 @@ function useParticipations(offerId, options = {}) {
 }
 
 // src/client/hooks/offers/data/useOfferDetails.ts
-import { useEffect as useEffect31, useState as useState32 } from "react";
-var LOADING_STATE8 = { type: "LOADING" };
+import { useEffect as useEffect32, useState as useState33 } from "react";
+var LOADING_STATE9 = { type: "LOADING" };
 function useOfferDetails(offerId, options = {}) {
   const { coinlist, isReady } = useCoinList();
   const log = useLogger("useOfferDetails");
   const { data } = options;
-  const [offerDetailsState, setOfferDetailsState] = useState32(
-    data !== void 0 ? { type: "CONTENT", offerDetail: data } : LOADING_STATE8
+  const [offerDetailsState, setOfferDetailsState] = useState33(
+    data !== void 0 ? { type: "CONTENT", offerDetail: data } : LOADING_STATE9
   );
-  useEffect31(() => {
+  useEffect32(() => {
     let isCancelled = false;
     if (!isReady) {
       if (data === void 0) {
-        setOfferDetailsState(LOADING_STATE8);
+        setOfferDetailsState(LOADING_STATE9);
       }
       return () => {
         isCancelled = true;
@@ -11945,7 +12113,7 @@ function useOfferDetails(offerId, options = {}) {
         isCancelled = true;
       };
     }
-    setOfferDetailsState(LOADING_STATE8);
+    setOfferDetailsState(LOADING_STATE9);
     coinlist.offers.get(offerId).then((offerDetail) => {
       if (!isCancelled) {
         log.debug(() => ({
@@ -11985,66 +12153,6 @@ var OfferAssetCardUi = {
   })
 };
 
-// src/client/hooks/tokens/data/useTokenMetadata.ts
-import { useCallback as useCallback15, useEffect as useEffect32, useState as useState33 } from "react";
-var DISABLED_STATE = { type: "DISABLED" };
-var LOADING_STATE9 = { type: "LOADING" };
-function useTokenMetadata(options) {
-  const { chain, address, data, enabled = true } = options;
-  const { coinlist, isReady } = useCoinList();
-  const log = useLogger("useTokenMetadata");
-  const [state, setState] = useState33(
-    () => data !== void 0 ? { type: "CONTENT", tokenMetadata: data } : LOADING_STATE9
-  );
-  const [refetchCount, setRefetchCount] = useState33(0);
-  const refetch = useCallback15(() => {
-    setRefetchCount((count) => count + 1);
-  }, []);
-  useEffect32(() => {
-    let isCancelled = false;
-    const seedActive = data !== void 0 && refetchCount === 0;
-    if (!isReady || !enabled || seedActive) {
-      return () => {
-        isCancelled = true;
-      };
-    }
-    setState(LOADING_STATE9);
-    coinlist.tokens.get({ chain, address }).then((tokenMetadata) => {
-      if (!isCancelled) {
-        log.debug(() => ({
-          msg: "settled",
-          fields: {
-            state: "CONTENT",
-            listed: tokenMetadata !== null,
-            symbol: tokenMetadata?.symbol ?? null
-          }
-        }));
-        setState({ type: "CONTENT", tokenMetadata });
-      }
-    }).catch((error) => {
-      if (!isCancelled) {
-        log.failure(
-          () => ({
-            msg: "settled",
-            fields: { state: "ERROR", reason: "generic-error" }
-          }),
-          error
-        );
-        setState({ type: "ERROR", reason: "generic-error" });
-      }
-    });
-    return () => {
-      isCancelled = true;
-    };
-  }, [coinlist, isReady, enabled, chain, address, data, refetchCount, log]);
-  return {
-    // LOADING would be a lie while disabled: nothing is in flight and nothing
-    // will replace it. Settled states (a seed, a previous answer) survive.
-    state: !enabled && state.type === "LOADING" ? DISABLED_STATE : state,
-    refetch
-  };
-}
-
 // src/client/ui/format/date.ts
 function formatMonthYear(date, locale) {
   return new Intl.DateTimeFormat(locale, {
@@ -12133,7 +12241,9 @@ export {
   formatCountdown,
   formatMonthYear,
   formatSaleCardCountdown,
+  offerAssetIconUrl,
   offerIconUrl,
+  offerTokenIdentifier,
   ondoLoadErrorReason,
   pinoClientLogger,
   prepareOndoBuy,
@@ -12142,6 +12252,9 @@ export {
   quoteOverAsks,
   stablecoinIconUrl,
   submitErc20Approval,
+  tokenLogoUrl,
+  tokenMetadataOf,
+  useCheckoutOfferTokenMetadata,
   useCoinList,
   useCoinListSignInCardViewModel,
   useCompleteOAuth,