@yieldfabric/wallet 0.2.2 → 0.2.3

package/dist/index.cjs

@@ -5370,7 +5370,7 @@ var init_SignupFlow = __esm({
               navigate("/onboarding/choose");
             },
             className: "text-[12px] text-text-muted hover:text-text-primary transition-colors text-left",
-            children: "\u2190 Try a different method"
+            children: "\u2039 Try a different method"
           }
         ) })
       ] });
@@ -5786,6 +5786,7 @@ async function fetchSnapshot() {
   return {
     profileCompleted: !!profile && !!profile.profile_completed,
     keyCount: keys.length,
+    keyDeferred: me?.id ? keyStepDeferred(me.id) : false,
     emailVerified: email.verified,
     emailSynthetic: email.is_synthetic,
     identityStatus: identity && identity.status !== "unverified" ? identity : null,
@@ -5818,6 +5819,24 @@ async function getSnapshot() {
   cache = { kind: "inflight", promise };
   return promise;
 }
+var keyDeferredKey = (userId) => `yf.onboarding.keyDeferred.${userId}`;
+var keyDeferredHere = /* @__PURE__ */ new Set();
+function keyStepDeferred(userId) {
+  if (keyDeferredHere.has(userId)) return true;
+  try {
+    return window.localStorage.getItem(keyDeferredKey(userId)) === "1";
+  } catch {
+    return false;
+  }
+}
+function deferKeyStep(userId) {
+  keyDeferredHere.add(userId);
+  try {
+    window.localStorage.setItem(keyDeferredKey(userId), "1");
+  } catch {
+  }
+  invalidateOnboardingState();
+}
 function invalidateOnboardingState() {
   cache = { kind: "empty" };
   scopedIdentity = null;
@@ -5844,10 +5863,10 @@ function decide(snapshot, ctx) {
   if (ctx.kycVerifiesEmail) {
     if (identityStep) return identityStep;
     if (!emailOk) return "email-required";
-    if (snapshot.keyCount < MIN_USER_KEYS) return "wallets-required";
+    if (snapshot.keyCount < MIN_USER_KEYS && !snapshot.keyDeferred) return "wallets-required";
   } else {
     if (!emailOk) return "email-required";
-    if (snapshot.keyCount < MIN_USER_KEYS) return "wallets-required";
+    if (snapshot.keyCount < MIN_USER_KEYS && !snapshot.keyDeferred) return "wallets-required";
     if (identityStep) return identityStep;
   }
   if (!snapshot.profileCompleted) return "profile-required";
@@ -10267,7 +10286,7 @@ var DEFAULT_MESSAGES = {
     },
     email: {
       title: "Continue with email",
-      description: "Email + password. Pick your signing wallets (passkey / MetaMask) in the next step."
+      description: "An email and a password. You can add a passkey later."
     },
     haveAccountPrompt: "Already have an account?",
     signInLinkText: "Sign in"
@@ -10278,7 +10297,7 @@ var DEFAULT_MESSAGES = {
   },
   emailSignup: {
     header: "Create your account",
-    subheader: "Your details now \u2014 signing wallets next.",
+    subheader: "An email and a password is all it takes.",
     submitButtonText: "Continue",
     submittingButtonText: "Creating account\u2026",
     backButtonText: "\u2039 Back",
@@ -10626,7 +10645,7 @@ function PlanOfferCard({
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-[8px] font-medium uppercase tracking-[0.1em] text-text-muted", children: "Pay monthly" }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mt-1 block text-[16px] font-semibold leading-none tracking-tight text-text-primary tabular-nums", children: price })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(outline.ArrowRightIcon, { className: "h-3.5 w-3.5 shrink-0 text-text-muted", strokeWidth: 1.7 }),
+          /* @__PURE__ */ jsxRuntime.jsx(outline.ChevronRightIcon, { className: "h-3.5 w-3.5 shrink-0 text-text-muted", strokeWidth: 1.7 }),
           /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-[8px] font-medium uppercase tracking-[0.1em] text-text-muted", children: "Cycle credit" }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mt-1 block text-[16px] font-semibold leading-none tracking-tight text-text-primary tabular-nums", children: allowance })
@@ -10796,7 +10815,7 @@ function OnboardingMethodCard({
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-text-primary", children: label }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[11px] text-text-secondary", children: sublabel })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-secondary", children: "\u2192" })
+        /* @__PURE__ */ jsxRuntime.jsx(outline.ChevronRightIcon, { "aria-hidden": "true", className: "h-4 w-4 text-text-secondary" })
       ]
     }
   );
@@ -14933,35 +14952,6 @@ function providerLabel(p) {
 function ProviderIcon({ provider }) {
   return /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 });
 }
-function setupCopy(args) {
-  const { keyCount, busy } = args;
-  if (keyCount >= MIN_KEYS) {
-    return {
-      title: "Ready to sign",
-      body: keyCount >= RECOMMENDED_KEYS ? "Your signing keys are ready, including a backup recovery path." : "Your signing key is ready. Adding a second key gives you a recovery path, but you can continue now.",
-      tone: "done"
-    };
-  }
-  if (busy === "passkey" || busy === "metamask") {
-    return {
-      title: "Saving your signing key",
-      body: "Complete the passkey or wallet prompt. Your smart account will be activated later, only when an on-chain action requires it.",
-      tone: "active"
-    };
-  }
-  return {
-    title: "Choose a signing key",
-    body: "Use a passkey for quick device-native signing, or connect MetaMask if you prefer an external wallet.",
-    tone: "waiting"
-  };
-}
-function StepDot({
-  state,
-  icon
-}) {
-  const className = state === "done" ? "bg-status-success-bg text-status-success-text border-status-success-text/30" : state === "active" ? "bg-status-warning-bg text-status-warning-text border-status-warning-text/30" : "bg-chip text-text-secondary border-border-default";
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-8 w-8 rounded-full border flex items-center justify-center ${className}`, children: state === "done" ? /* @__PURE__ */ jsxRuntime.jsx(outline.CheckCircleIcon, { className: "h-4 w-4", strokeWidth: 1.8 }) : state === "active" ? /* @__PURE__ */ jsxRuntime.jsx(outline.ArrowPathIcon, { className: "h-4 w-4 animate-spin", strokeWidth: 1.8 }) : icon });
-}
 function SuccessMoment({ visible }) {
   if (!visible) return null;
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -15032,65 +15022,6 @@ function RecoveryPanel({
     }
   );
 }
-function SetupStep({
-  label,
-  detail,
-  state,
-  icon
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2.5 min-w-0", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(StepDot, { state, icon }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[12px] text-text-primary truncate", children: label }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[10px] text-text-secondary truncate", children: detail })
-    ] })
-  ] });
-}
-function SetupStatusPanel({
-  keyCount,
-  busy
-}) {
-  const copy = setupCopy({ keyCount, busy });
-  const keyState = keyCount >= MIN_KEYS ? "done" : busy === "passkey" || busy === "metamask" ? "active" : "waiting";
-  const readyState = keyCount >= MIN_KEYS ? "done" : "waiting";
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "section",
-    {
-      className: "rounded-lg border border-border-default bg-input-bg px-4 py-4 space-y-4",
-      role: "status",
-      "aria-live": "polite",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1 min-w-0", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[18px] text-text-primary font-medium tracking-normal", children: copy.title }),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[12px] text-text-secondary leading-relaxed", children: copy.body })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: `shrink-0 h-9 w-9 rounded-full flex items-center justify-center ${copy.tone === "done" ? "bg-status-success-bg text-status-success-text" : copy.tone === "active" ? "bg-status-warning-bg text-status-warning-text" : "bg-chip text-text-secondary"}`, children: copy.tone === "done" ? /* @__PURE__ */ jsxRuntime.jsx(outline.CheckCircleIcon, { className: "h-5 w-5", strokeWidth: 1.8 }) : copy.tone === "active" ? /* @__PURE__ */ jsxRuntime.jsx(outline.ArrowPathIcon, { className: "h-5 w-5 animate-spin", strokeWidth: 1.8 }) : /* @__PURE__ */ jsxRuntime.jsx(outline.ShieldCheckIcon, { className: "h-5 w-5", strokeWidth: 1.8 }) })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 gap-2.5", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            SetupStep,
-            {
-              label: "Signing key",
-              detail: keyCount >= MIN_KEYS ? "Ready to authorize" : "Choose one below",
-              state: keyState,
-              icon: /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-4 w-4", strokeWidth: 1.7 })
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            SetupStep,
-            {
-              label: "Continue",
-              detail: readyState === "done" ? "Unlocked" : "Unlocks automatically",
-              state: readyState,
-              icon: /* @__PURE__ */ jsxRuntime.jsx(outline.ClockIcon, { className: "h-4 w-4", strokeWidth: 1.7 })
-            }
-          )
-        ] })
-      ]
-    }
-  );
-}
 function AddWalletsStep({ chrome } = {}) {
   const navigate = useWizardNavigate();
   const { bootstrapSession, user } = useAuth();
@@ -15104,6 +15035,7 @@ function AddWalletsStep({ chrome } = {}) {
   const [autoAdvanceArmed, setAutoAdvanceArmed] = React54.useState(false);
   const [emailDraft, setEmailDraft] = React54.useState("");
   const [showDynamic, setShowDynamic] = React54.useState(false);
+  const [walletsOpen, setWalletsOpen] = React54.useState(false);
   const hasSyntheticEmail = !!user?.email && user.email.toLowerCase().endsWith("@external.yieldfabric.local");
   const { snapshot: gateSnapshot } = useOnboardingState();
   const emailOk = !!gateSnapshot && snapshotEmailOk(gateSnapshot);
@@ -15130,7 +15062,7 @@ function AddWalletsStep({ chrome } = {}) {
   }, [refresh]);
   const keyCount = keys.length;
   const canContinue = keyCount >= MIN_KEYS;
-  const continueLabel = canContinue ? autoAdvanceArmed ? "Ready - continuing..." : "Continue" : "Add a key to continue";
+  const continueLabel = canContinue ? autoAdvanceArmed ? "Ready - continuing..." : "Continue" : "Add a passkey to continue";
   async function addMetaMask() {
     setError(null);
     setLastFailedAction(null);
@@ -15149,7 +15081,7 @@ function AddWalletsStep({ chrome } = {}) {
     await impl.directLink({
       onComplete: async () => {
         setBusy(null);
-        setStatus("Signing key saved. Refreshing\u2026");
+        setStatus("Saved. One moment\u2026");
         await refresh({ invalidate: true });
       },
       onError: (msg) => {
@@ -15205,7 +15137,7 @@ function AddWalletsStep({ chrome } = {}) {
           credential_id: created.credentialId
         }
       }, { purpose: "user" });
-      setStatus("Signing key saved. Refreshing\u2026");
+      setStatus("Saved. One moment\u2026");
       await refresh({ invalidate: true });
       const after = await listMyLoginKeys();
       const found = after.some(
@@ -15260,8 +15192,7 @@ function AddWalletsStep({ chrome } = {}) {
       setBusy(null);
     }
   }
-  const onContinue = React54.useCallback(async () => {
-    if (!canContinue) return;
+  const goOn = React54.useCallback(async () => {
     setBusy("continue");
     setLastFailedAction(null);
     try {
@@ -15288,7 +15219,16 @@ function AddWalletsStep({ chrome } = {}) {
       setError(friendlyActionError(e, "refresh"));
       setBusy(null);
     }
-  }, [bootstrapSession, canContinue, config, navigate]);
+  }, [bootstrapSession, config, navigate, user?.role]);
+  const onContinue = React54.useCallback(async () => {
+    if (!canContinue) return;
+    await goOn();
+  }, [canContinue, goOn]);
+  const onSkip = React54.useCallback(async () => {
+    if (!user?.id) return;
+    deferKeyStep(user.id);
+    await goOn();
+  }, [goOn, user?.id]);
   React54.useEffect(() => {
     if (!autoAdvanceArmed || !canContinue || busy) return;
     const timeout = window.setTimeout(() => {
@@ -15314,9 +15254,8 @@ function AddWalletsStep({ chrome } = {}) {
   }
   return /* @__PURE__ */ jsxRuntime.jsx(StepShell, { chrome, wide: true, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4 sm:space-y-5 max-w-[420px] mx-auto", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center space-y-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[10px] uppercase tracking-[0.14em] text-text-secondary", children: "Secure setup" }),
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[21px] text-text-primary font-medium leading-tight", children: "Your account is almost ready" }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[12px] leading-relaxed text-text-secondary max-w-[330px] mx-auto", children: "Add a signing key now. Your smart account is activated later, only when an on-chain action needs it." })
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-[21px] text-text-primary font-medium leading-tight", children: "Secure your account" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] leading-relaxed text-text-secondary max-w-[340px] mx-auto", children: "A passkey means only you can approve what is done in your name \u2014 one tap with Face ID, a fingerprint or your PIN. You can also do this later." })
     ] }),
     hasSyntheticEmail && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-lg bg-status-warning-bg border border-status-warning-text/20 p-3 space-y-2", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[11px] text-status-warning-text", children: "Your account email is a temporary placeholder. Set a real one so you can recover access and (if you ever want it) link Averer KYC." }),
@@ -15343,20 +15282,10 @@ function AddWalletsStep({ chrome } = {}) {
         )
       ] })
     ] }),
-    !loading && /* @__PURE__ */ jsxRuntime.jsx(
-      SetupStatusPanel,
-      {
-        keyCount,
-        busy
-      }
-    ),
     /* @__PURE__ */ jsxRuntime.jsx(SuccessMoment, { visible: canContinue && autoAdvanceArmed && !error }),
-    loading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border border-dashed border-border-default bg-input-bg px-4 py-8 text-center text-[11px] text-text-secondary", children: "Loading\u2026" }) : keys.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-lg border border-dashed border-border-default bg-input-bg px-4 py-7 flex flex-col items-center gap-2.5", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-11 h-11 rounded-full bg-chip flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-5 w-5 text-text-secondary", strokeWidth: 1.5 }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[11px] text-text-secondary", children: "No signing keys yet" })
-    ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-input-bg rounded-lg px-4 py-3.5 space-y-3", children: [
+    loading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border border-dashed border-border-default bg-input-bg px-4 py-8 text-center text-[11px] text-text-secondary", children: "Loading\u2026" }) : keys.length === 0 ? null : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-input-bg rounded-lg px-4 py-3.5 space-y-3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-[11px]", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-secondary", children: "Signing keys" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-secondary", children: "Your keys" }),
         /* @__PURE__ */ jsxRuntime.jsxs("span", { className: keyCount < RECOMMENDED_KEYS ? "text-status-warning-text" : "text-status-success-text", children: [
           keyCount === 1 && "1 key \xB7 add a backup",
           keyCount >= RECOMMENDED_KEYS && `${keyCount} keys`
@@ -15383,7 +15312,7 @@ function AddWalletsStep({ chrome } = {}) {
       }) })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[11px] text-text-secondary text-center", children: !emailOk ? "Verify your email to unlock signing keys" : "Add a key" }),
+      !emailOk ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[11px] text-text-secondary text-center", children: "Confirm your email first" }) : null,
       !emailOk && /* @__PURE__ */ jsxRuntime.jsxs(
         "button",
         {
@@ -15403,37 +15332,48 @@ function AddWalletsStep({ chrome } = {}) {
           type: "button",
           onClick: addPasskey,
           disabled: busy !== null || !emailOk,
-          className: "\n              w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n              bg-chip hover:bg-chip-hover\n              text-[12px] text-text-primary\n              transition-all duration-200\n              active:scale-[0.98]\n              disabled:opacity-40 disabled:cursor-not-allowed\n            ",
-          children: [
-            busy === "passkey" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-secondary", children: "\u2026" }) : /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Add Passkey" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        "button",
-        {
-          type: "button",
-          onClick: addMetaMask,
-          disabled: busy !== null || !emailOk,
-          className: "\n              w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n              bg-chip hover:bg-chip-hover\n              text-[12px] text-text-primary\n              transition-all duration-200\n              active:scale-[0.98]\n              disabled:opacity-40 disabled:cursor-not-allowed\n            ",
+          className: `w-full min-h-[46px] flex items-center justify-center gap-2 py-2.5 rounded-lg text-[13px] font-medium transition-colors active:scale-[0.99] disabled:opacity-40 disabled:cursor-not-allowed ${canContinue ? "bg-chip hover:bg-chip-hover text-text-primary" : "bg-cta hover:bg-cta-hover text-on-cta"}`,
           children: [
-            busy === "metamask" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-secondary", children: "\u2026" }) : /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Add MetaMask" })
+            busy === "passkey" ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u2026" }) : /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-4 w-4", strokeWidth: 1.5 }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: canContinue ? "Add another passkey" : "Add a passkey" })
           ]
         }
       ),
-      !!config?.auth.enabled.includes("dynamic") && !!config?.auth.settings.dynamic?.environment_id && /* @__PURE__ */ jsxRuntime.jsxs(
+      walletsOpen ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: addMetaMask,
+            disabled: busy !== null || !emailOk,
+            className: "\n                  w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n                  bg-chip hover:bg-chip-hover\n                  text-[12px] text-text-primary\n                  transition-all duration-200\n                  active:scale-[0.98]\n                  disabled:opacity-40 disabled:cursor-not-allowed\n                ",
+            children: [
+              busy === "metamask" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-secondary", children: "\u2026" }) : /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Add MetaMask" })
+            ]
+          }
+        ),
+        !!config?.auth.enabled.includes("dynamic") && !!config?.auth.settings.dynamic?.environment_id && /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => setShowDynamic(true),
+            disabled: busy !== null || !emailOk,
+            className: "\n                    w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n                    bg-chip hover:bg-chip-hover\n                    text-[12px] text-text-primary\n                    transition-all duration-200\n                    active:scale-[0.98]\n                    disabled:opacity-40 disabled:cursor-not-allowed\n                  ",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Add Dynamic" })
+            ]
+          }
+        )
+      ] }) : /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
           type: "button",
-          onClick: () => setShowDynamic(true),
-          disabled: busy !== null || !emailOk,
-          className: "\n                w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n                bg-chip hover:bg-chip-hover\n                text-[12px] text-text-primary\n                transition-all duration-200\n                active:scale-[0.98]\n                disabled:opacity-40 disabled:cursor-not-allowed\n              ",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(outline.KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Add Dynamic" })
-          ]
+          onClick: () => setWalletsOpen(true),
+          disabled: busy !== null,
+          className: "w-full py-1.5 text-[11px] text-text-secondary hover:text-text-primary transition-colors disabled:opacity-40",
+          children: "Use a crypto wallet instead"
         }
       )
     ] }),
@@ -15450,7 +15390,7 @@ function AddWalletsStep({ chrome } = {}) {
               registerOnChain: false,
               onComplete: async () => {
                 setShowDynamic(false);
-                setStatus("Signing key saved. Refreshing\u2026");
+                setStatus("Saved. One moment\u2026");
                 await refresh({ invalidate: true });
               },
               onError: (m) => {
@@ -15482,15 +15422,24 @@ function AddWalletsStep({ chrome } = {}) {
         onRetry: retryLastFailure
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx(
+    canContinue ? /* @__PURE__ */ jsxRuntime.jsx(
       "button",
       {
         type: "button",
         onClick: onContinue,
-        disabled: !canContinue || busy === "continue",
-        className: "\n            w-full min-h-[46px] py-3 rounded-lg\n            bg-status-success-bg hover:opacity-80 text-status-success-text\n            text-[13px] font-medium\n            transition-all duration-200 active:scale-[0.99]\n            disabled:opacity-30 disabled:cursor-not-allowed disabled:hover:bg-status-success-bg\n          ",
+        disabled: busy === "continue",
+        className: "w-full min-h-[46px] py-3 rounded-lg bg-cta hover:bg-cta-hover text-on-cta text-[13px] font-medium transition-colors active:scale-[0.99] disabled:opacity-40 disabled:cursor-not-allowed",
         children: continueLabel
       }
+    ) : /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => void onSkip(),
+        disabled: busy !== null || !user?.id,
+        className: "w-full py-2 text-[13px] text-text-secondary hover:text-text-primary transition-colors disabled:opacity-40",
+        children: "Not now"
+      }
     ),
     keyCount === 1 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[10px] text-text-secondary text-center pt-1", children: "Tip: a second key is your recovery path. If you lose your only key, the account is locked out." })
   ] }) });
@@ -23074,7 +23023,7 @@ function SecurityPage() {
                     rotateStep === "added" || rotateStep === "removing" || rotateStep === "remove-pending" || rotateStep === "done" ? "\u2713 " : "1. ",
                     "Add new key"
                   ] }),
-                  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u2192" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(outline.ChevronRightIcon, { "aria-hidden": "true", className: "h-3 w-3" }),
                   /* @__PURE__ */ jsxRuntime.jsxs("span", { className: rotateStep === "added" || rotateStep === "removing" || rotateStep === "remove-pending" ? "text-text-primary font-medium" : "", children: [
                     rotateStep === "done" ? "\u2713 " : "2. ",
                     "Remove old key"
@@ -24004,9 +23953,9 @@ var GroupsView = ({
           "aria-label": `${sourceGroup?.name ?? "Owning group"} is operating ${activeOwnedGroup?.name ?? "owned group"}`,
           children: [
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate rounded-lg border border-border-default dark:border-white/[0.08] bg-chip dark:bg-white/[0.035] px-2.5 py-1.5 text-[11px] font-semibold text-text-secondary", children: "You" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "shrink-0 text-[12px] text-azure dark:text-cyan-300/70", children: "\u2192" }),
+            /* @__PURE__ */ jsxRuntime.jsx(outline.ChevronRightIcon, { "aria-hidden": "true", className: "h-3.5 w-3.5 shrink-0 text-azure dark:text-cyan-300/70" }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate rounded-lg border border-border-default dark:border-white/[0.08] bg-chip dark:bg-white/[0.035] px-2.5 py-1.5 text-[11px] font-semibold text-text-secondary", children: sourceGroup?.name ?? compactGroupId(delegationSession.parentGroupId) }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "shrink-0 text-[12px] text-azure dark:text-cyan-300/70", children: "\u2192" }),
+            /* @__PURE__ */ jsxRuntime.jsx(outline.ChevronRightIcon, { "aria-hidden": "true", className: "h-3.5 w-3.5 shrink-0 text-azure dark:text-cyan-300/70" }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate rounded-lg border border-azure-line dark:border-cyan-300/[0.18] bg-azure-tint dark:bg-cyan-300/[0.08] px-2.5 py-1.5 text-[11px] font-semibold text-azure dark:text-cyan-200", children: activeOwnedGroup?.name ?? compactGroupId(delegationSession.currentGroupId) })
           ]
         }
@@ -24370,7 +24319,7 @@ function OwnedGroupRow({
   return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "px-3.5 py-3", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate text-[11px] font-semibold text-text-secondary", children: sourceName }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "shrink-0 text-[12px] text-azure dark:text-cyan-300/70", children: "\u2192" }),
+      /* @__PURE__ */ jsxRuntime.jsx(outline.ChevronRightIcon, { "aria-hidden": "true", className: "h-3.5 w-3.5 shrink-0 text-azure dark:text-cyan-300/70" }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate text-[12px] font-semibold text-text-primary", children: projection.group.name })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex items-center justify-between gap-3", children: [
@@ -29714,7 +29663,7 @@ var VerificationDialog = ({
             type: "button",
             onClick: () => setActiveProvider(null),
             className: "mb-3 text-[12px] text-text-secondary hover:text-text-primary",
-            children: "\u2190 Choose a different provider"
+            children: "\u2039 Choose a different provider"
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -29877,7 +29826,7 @@ function BusinessVerificationSection({
           type: "button",
           onClick: () => setFlowInstance(null),
           className: "mb-3 text-[12px] text-text-secondary hover:text-text-primary",
-          children: "\u2190 Back"
+          children: "\u2039 Back"
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(

package/dist/index.d.cts

@@ -3473,7 +3473,8 @@ groupId?: string): Promise<string>;
  *
  *   1. Email not confirmed                     → 'email-required'
  *      (Averer signups skip this; Averer is already an identity gate)
- *   2. < 1 off-chain signing key               → 'wallets-required'
+ *   2. < 1 off-chain signing key, not deferred → 'wallets-required'
+ *      ("Skip for now" defers it on this device: `deferKeyStep`)
  *   3. Identity verification required but not done → 'identity-required'
  *   4. Profile (display_name + avatar) not completed → 'profile-required'
  *   5. Billing unavailable in a direct plan context → 'service-unavailable'
@@ -3497,11 +3498,13 @@ groupId?: string): Promise<string>;
  *   already a verified-identity ceremony, so we do not add a second
  *   email-code gate on top of it.
  *
- * - **Signing key before identity.** A user without a signing key has no way to act on
- *   the platform anyway, and capturing the key first means the identity
- *   step (Stripe KYC) can stamp itself against an established signer
- *   rather than a "naked" account. Also gives the user something
- *   tangible before being asked for government-issued ID.
+ * - **Signing key before identity, and optional.** Offering the key first
+ *   gives the user something tangible before being asked for
+ *   government-issued ID. It can be skipped: an email user acts through
+ *   their platform-managed key, signing permission follows verification
+ *   (auth's capability gate), and auth stores a FIRST key for an
+ *   email-confirmed person without signing permission, so a key added
+ *   later needs no carve-out either.
  *
  * - **Identity second.** Stripe Identity returns first_name, last_name,
  *   dob, and address as `verified_outputs`, which the auth side projects
@@ -3543,6 +3546,11 @@ groupId?: string): Promise<string>;
 interface OnboardingSnapshot {
     profileCompleted: boolean;
     keyCount: number;
+    /** The person chose to add a key later (the key step's "Skip for now").
+     *  A key is optional: storing one is not an on-chain act, and signing
+     *  permission follows verification (auth's capability gate), never keys.
+     *  Absent reads as not deferred. */
+    keyDeferred?: boolean;
     /** Current auth email ownership state. Synthetic wallet-only emails
      *  must be replaced before they can be confirmed. */
     emailVerified: boolean;
@@ -3579,14 +3587,6 @@ interface OnboardingSnapshot {
      *  fetch failed (treated as NOT exempt — fail-safe). */
     role: string | null;
 }
-/** Drop the cache and notify every mounted hook instance to re-fetch.
- *  Call after any mutation that could change the user's onboarding
- *  state — wallet add/remove, profile patch, lockdown finalize,
- *  identity-verification submission, etc.
- *
- *  The subscriber fan-out is critical: without it, sibling consumers
- *  of `useOnboardingState` keep their stale React state and continue
- *  rendering against an out-of-date decision. */
 declare function invalidateOnboardingState(): void;
 /** Backwards-compatible alias for the now-removed wallet-only API.
  *  Callers don't need to know the cache covers both signals now. */

package/dist/index.d.ts

@@ -3473,7 +3473,8 @@ groupId?: string): Promise<string>;
  *
  *   1. Email not confirmed                     → 'email-required'
  *      (Averer signups skip this; Averer is already an identity gate)
- *   2. < 1 off-chain signing key               → 'wallets-required'
+ *   2. < 1 off-chain signing key, not deferred → 'wallets-required'
+ *      ("Skip for now" defers it on this device: `deferKeyStep`)
  *   3. Identity verification required but not done → 'identity-required'
  *   4. Profile (display_name + avatar) not completed → 'profile-required'
  *   5. Billing unavailable in a direct plan context → 'service-unavailable'
@@ -3497,11 +3498,13 @@ groupId?: string): Promise<string>;
  *   already a verified-identity ceremony, so we do not add a second
  *   email-code gate on top of it.
  *
- * - **Signing key before identity.** A user without a signing key has no way to act on
- *   the platform anyway, and capturing the key first means the identity
- *   step (Stripe KYC) can stamp itself against an established signer
- *   rather than a "naked" account. Also gives the user something
- *   tangible before being asked for government-issued ID.
+ * - **Signing key before identity, and optional.** Offering the key first
+ *   gives the user something tangible before being asked for
+ *   government-issued ID. It can be skipped: an email user acts through
+ *   their platform-managed key, signing permission follows verification
+ *   (auth's capability gate), and auth stores a FIRST key for an
+ *   email-confirmed person without signing permission, so a key added
+ *   later needs no carve-out either.
  *
  * - **Identity second.** Stripe Identity returns first_name, last_name,
  *   dob, and address as `verified_outputs`, which the auth side projects
@@ -3543,6 +3546,11 @@ groupId?: string): Promise<string>;
 interface OnboardingSnapshot {
     profileCompleted: boolean;
     keyCount: number;
+    /** The person chose to add a key later (the key step's "Skip for now").
+     *  A key is optional: storing one is not an on-chain act, and signing
+     *  permission follows verification (auth's capability gate), never keys.
+     *  Absent reads as not deferred. */
+    keyDeferred?: boolean;
     /** Current auth email ownership state. Synthetic wallet-only emails
      *  must be replaced before they can be confirmed. */
     emailVerified: boolean;
@@ -3579,14 +3587,6 @@ interface OnboardingSnapshot {
      *  fetch failed (treated as NOT exempt — fail-safe). */
     role: string | null;
 }
-/** Drop the cache and notify every mounted hook instance to re-fetch.
- *  Call after any mutation that could change the user's onboarding
- *  state — wallet add/remove, profile patch, lockdown finalize,
- *  identity-verification submission, etc.
- *
- *  The subscriber fan-out is critical: without it, sibling consumers
- *  of `useOnboardingState` keep their stale React state and continue
- *  rendering against an out-of-date decision. */
 declare function invalidateOnboardingState(): void;
 /** Backwards-compatible alias for the now-removed wallet-only API.
  *  Callers don't need to know the cache covers both signals now. */

package/dist/index.js

@@ -9,7 +9,7 @@ import React54, { createContext, lazy, useContext, useState, useEffect, useRef,
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { AvererSdkProvider, useAvererWallet, AvererWebSdk } from '@averer/averer-websdk';
 import sha3, { keccak256 } from 'js-sha3';
-import { XMarkIcon, IdentificationIcon, CheckCircleIcon, ExclamationTriangleIcon, SparklesIcon, EnvelopeIcon, ArrowPathIcon, KeyIcon, ShieldCheckIcon, CreditCardIcon, ArrowRightIcon, UserIcon, UserGroupIcon, ClockIcon, ChevronRightIcon } from '@heroicons/react/24/outline';
+import { ChevronRightIcon, XMarkIcon, IdentificationIcon, CheckCircleIcon, ExclamationTriangleIcon, SparklesIcon, EnvelopeIcon, ArrowPathIcon, ShieldCheckIcon, KeyIcon, CreditCardIcon, UserIcon, UserGroupIcon } from '@heroicons/react/24/outline';
 import { Avatar } from '@avatune/react';
 import theme from '@avatune/kyute-theme/react';
 import { AnimatePresence, motion } from 'framer-motion';
@@ -5362,7 +5362,7 @@ var init_SignupFlow = __esm({
               navigate("/onboarding/choose");
             },
             className: "text-[12px] text-text-muted hover:text-text-primary transition-colors text-left",
-            children: "\u2190 Try a different method"
+            children: "\u2039 Try a different method"
           }
         ) })
       ] });
@@ -5778,6 +5778,7 @@ async function fetchSnapshot() {
   return {
     profileCompleted: !!profile && !!profile.profile_completed,
     keyCount: keys.length,
+    keyDeferred: me?.id ? keyStepDeferred(me.id) : false,
     emailVerified: email.verified,
     emailSynthetic: email.is_synthetic,
     identityStatus: identity && identity.status !== "unverified" ? identity : null,
@@ -5810,6 +5811,24 @@ async function getSnapshot() {
   cache = { kind: "inflight", promise };
   return promise;
 }
+var keyDeferredKey = (userId) => `yf.onboarding.keyDeferred.${userId}`;
+var keyDeferredHere = /* @__PURE__ */ new Set();
+function keyStepDeferred(userId) {
+  if (keyDeferredHere.has(userId)) return true;
+  try {
+    return window.localStorage.getItem(keyDeferredKey(userId)) === "1";
+  } catch {
+    return false;
+  }
+}
+function deferKeyStep(userId) {
+  keyDeferredHere.add(userId);
+  try {
+    window.localStorage.setItem(keyDeferredKey(userId), "1");
+  } catch {
+  }
+  invalidateOnboardingState();
+}
 function invalidateOnboardingState() {
   cache = { kind: "empty" };
   scopedIdentity = null;
@@ -5836,10 +5855,10 @@ function decide(snapshot, ctx) {
   if (ctx.kycVerifiesEmail) {
     if (identityStep) return identityStep;
     if (!emailOk) return "email-required";
-    if (snapshot.keyCount < MIN_USER_KEYS) return "wallets-required";
+    if (snapshot.keyCount < MIN_USER_KEYS && !snapshot.keyDeferred) return "wallets-required";
   } else {
     if (!emailOk) return "email-required";
-    if (snapshot.keyCount < MIN_USER_KEYS) return "wallets-required";
+    if (snapshot.keyCount < MIN_USER_KEYS && !snapshot.keyDeferred) return "wallets-required";
     if (identityStep) return identityStep;
   }
   if (!snapshot.profileCompleted) return "profile-required";
@@ -10259,7 +10278,7 @@ var DEFAULT_MESSAGES = {
     },
     email: {
       title: "Continue with email",
-      description: "Email + password. Pick your signing wallets (passkey / MetaMask) in the next step."
+      description: "An email and a password. You can add a passkey later."
     },
     haveAccountPrompt: "Already have an account?",
     signInLinkText: "Sign in"
@@ -10270,7 +10289,7 @@ var DEFAULT_MESSAGES = {
   },
   emailSignup: {
     header: "Create your account",
-    subheader: "Your details now \u2014 signing wallets next.",
+    subheader: "An email and a password is all it takes.",
     submitButtonText: "Continue",
     submittingButtonText: "Creating account\u2026",
     backButtonText: "\u2039 Back",
@@ -10618,7 +10637,7 @@ function PlanOfferCard({
             /* @__PURE__ */ jsx("span", { className: "block text-[8px] font-medium uppercase tracking-[0.1em] text-text-muted", children: "Pay monthly" }),
             /* @__PURE__ */ jsx("span", { className: "mt-1 block text-[16px] font-semibold leading-none tracking-tight text-text-primary tabular-nums", children: price })
           ] }),
-          /* @__PURE__ */ jsx(ArrowRightIcon, { className: "h-3.5 w-3.5 shrink-0 text-text-muted", strokeWidth: 1.7 }),
+          /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-3.5 w-3.5 shrink-0 text-text-muted", strokeWidth: 1.7 }),
           /* @__PURE__ */ jsxs("span", { children: [
             /* @__PURE__ */ jsx("span", { className: "block text-[8px] font-medium uppercase tracking-[0.1em] text-text-muted", children: "Cycle credit" }),
             /* @__PURE__ */ jsx("span", { className: "mt-1 block text-[16px] font-semibold leading-none tracking-tight text-text-primary tabular-nums", children: allowance })
@@ -10788,7 +10807,7 @@ function OnboardingMethodCard({
           /* @__PURE__ */ jsx("div", { className: "text-sm text-text-primary", children: label }),
           /* @__PURE__ */ jsx("div", { className: "text-[11px] text-text-secondary", children: sublabel })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "text-text-secondary", children: "\u2192" })
+        /* @__PURE__ */ jsx(ChevronRightIcon, { "aria-hidden": "true", className: "h-4 w-4 text-text-secondary" })
       ]
     }
   );
@@ -14925,35 +14944,6 @@ function providerLabel(p) {
 function ProviderIcon({ provider }) {
   return /* @__PURE__ */ jsx(KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 });
 }
-function setupCopy(args) {
-  const { keyCount, busy } = args;
-  if (keyCount >= MIN_KEYS) {
-    return {
-      title: "Ready to sign",
-      body: keyCount >= RECOMMENDED_KEYS ? "Your signing keys are ready, including a backup recovery path." : "Your signing key is ready. Adding a second key gives you a recovery path, but you can continue now.",
-      tone: "done"
-    };
-  }
-  if (busy === "passkey" || busy === "metamask") {
-    return {
-      title: "Saving your signing key",
-      body: "Complete the passkey or wallet prompt. Your smart account will be activated later, only when an on-chain action requires it.",
-      tone: "active"
-    };
-  }
-  return {
-    title: "Choose a signing key",
-    body: "Use a passkey for quick device-native signing, or connect MetaMask if you prefer an external wallet.",
-    tone: "waiting"
-  };
-}
-function StepDot({
-  state,
-  icon
-}) {
-  const className = state === "done" ? "bg-status-success-bg text-status-success-text border-status-success-text/30" : state === "active" ? "bg-status-warning-bg text-status-warning-text border-status-warning-text/30" : "bg-chip text-text-secondary border-border-default";
-  return /* @__PURE__ */ jsx("div", { className: `h-8 w-8 rounded-full border flex items-center justify-center ${className}`, children: state === "done" ? /* @__PURE__ */ jsx(CheckCircleIcon, { className: "h-4 w-4", strokeWidth: 1.8 }) : state === "active" ? /* @__PURE__ */ jsx(ArrowPathIcon, { className: "h-4 w-4 animate-spin", strokeWidth: 1.8 }) : icon });
-}
 function SuccessMoment({ visible }) {
   if (!visible) return null;
   return /* @__PURE__ */ jsx(
@@ -15024,65 +15014,6 @@ function RecoveryPanel({
     }
   );
 }
-function SetupStep({
-  label,
-  detail,
-  state,
-  icon
-}) {
-  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 min-w-0", children: [
-    /* @__PURE__ */ jsx(StepDot, { state, icon }),
-    /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ jsx("div", { className: "text-[12px] text-text-primary truncate", children: label }),
-      /* @__PURE__ */ jsx("div", { className: "text-[10px] text-text-secondary truncate", children: detail })
-    ] })
-  ] });
-}
-function SetupStatusPanel({
-  keyCount,
-  busy
-}) {
-  const copy = setupCopy({ keyCount, busy });
-  const keyState = keyCount >= MIN_KEYS ? "done" : busy === "passkey" || busy === "metamask" ? "active" : "waiting";
-  const readyState = keyCount >= MIN_KEYS ? "done" : "waiting";
-  return /* @__PURE__ */ jsxs(
-    "section",
-    {
-      className: "rounded-lg border border-border-default bg-input-bg px-4 py-4 space-y-4",
-      role: "status",
-      "aria-live": "polite",
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
-          /* @__PURE__ */ jsxs("div", { className: "space-y-1 min-w-0", children: [
-            /* @__PURE__ */ jsx("h2", { className: "text-[18px] text-text-primary font-medium tracking-normal", children: copy.title }),
-            /* @__PURE__ */ jsx("p", { className: "text-[12px] text-text-secondary leading-relaxed", children: copy.body })
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: `shrink-0 h-9 w-9 rounded-full flex items-center justify-center ${copy.tone === "done" ? "bg-status-success-bg text-status-success-text" : copy.tone === "active" ? "bg-status-warning-bg text-status-warning-text" : "bg-chip text-text-secondary"}`, children: copy.tone === "done" ? /* @__PURE__ */ jsx(CheckCircleIcon, { className: "h-5 w-5", strokeWidth: 1.8 }) : copy.tone === "active" ? /* @__PURE__ */ jsx(ArrowPathIcon, { className: "h-5 w-5 animate-spin", strokeWidth: 1.8 }) : /* @__PURE__ */ jsx(ShieldCheckIcon, { className: "h-5 w-5", strokeWidth: 1.8 }) })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-2.5", children: [
-          /* @__PURE__ */ jsx(
-            SetupStep,
-            {
-              label: "Signing key",
-              detail: keyCount >= MIN_KEYS ? "Ready to authorize" : "Choose one below",
-              state: keyState,
-              icon: /* @__PURE__ */ jsx(KeyIcon, { className: "h-4 w-4", strokeWidth: 1.7 })
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SetupStep,
-            {
-              label: "Continue",
-              detail: readyState === "done" ? "Unlocked" : "Unlocks automatically",
-              state: readyState,
-              icon: /* @__PURE__ */ jsx(ClockIcon, { className: "h-4 w-4", strokeWidth: 1.7 })
-            }
-          )
-        ] })
-      ]
-    }
-  );
-}
 function AddWalletsStep({ chrome } = {}) {
   const navigate = useWizardNavigate();
   const { bootstrapSession, user } = useAuth();
@@ -15096,6 +15027,7 @@ function AddWalletsStep({ chrome } = {}) {
   const [autoAdvanceArmed, setAutoAdvanceArmed] = useState(false);
   const [emailDraft, setEmailDraft] = useState("");
   const [showDynamic, setShowDynamic] = useState(false);
+  const [walletsOpen, setWalletsOpen] = useState(false);
   const hasSyntheticEmail = !!user?.email && user.email.toLowerCase().endsWith("@external.yieldfabric.local");
   const { snapshot: gateSnapshot } = useOnboardingState();
   const emailOk = !!gateSnapshot && snapshotEmailOk(gateSnapshot);
@@ -15122,7 +15054,7 @@ function AddWalletsStep({ chrome } = {}) {
   }, [refresh]);
   const keyCount = keys.length;
   const canContinue = keyCount >= MIN_KEYS;
-  const continueLabel = canContinue ? autoAdvanceArmed ? "Ready - continuing..." : "Continue" : "Add a key to continue";
+  const continueLabel = canContinue ? autoAdvanceArmed ? "Ready - continuing..." : "Continue" : "Add a passkey to continue";
   async function addMetaMask() {
     setError(null);
     setLastFailedAction(null);
@@ -15141,7 +15073,7 @@ function AddWalletsStep({ chrome } = {}) {
     await impl.directLink({
       onComplete: async () => {
         setBusy(null);
-        setStatus("Signing key saved. Refreshing\u2026");
+        setStatus("Saved. One moment\u2026");
         await refresh({ invalidate: true });
       },
       onError: (msg) => {
@@ -15197,7 +15129,7 @@ function AddWalletsStep({ chrome } = {}) {
           credential_id: created.credentialId
         }
       }, { purpose: "user" });
-      setStatus("Signing key saved. Refreshing\u2026");
+      setStatus("Saved. One moment\u2026");
       await refresh({ invalidate: true });
       const after = await listMyLoginKeys();
       const found = after.some(
@@ -15252,8 +15184,7 @@ function AddWalletsStep({ chrome } = {}) {
       setBusy(null);
     }
   }
-  const onContinue = useCallback(async () => {
-    if (!canContinue) return;
+  const goOn = useCallback(async () => {
     setBusy("continue");
     setLastFailedAction(null);
     try {
@@ -15280,7 +15211,16 @@ function AddWalletsStep({ chrome } = {}) {
       setError(friendlyActionError(e, "refresh"));
       setBusy(null);
     }
-  }, [bootstrapSession, canContinue, config, navigate]);
+  }, [bootstrapSession, config, navigate, user?.role]);
+  const onContinue = useCallback(async () => {
+    if (!canContinue) return;
+    await goOn();
+  }, [canContinue, goOn]);
+  const onSkip = useCallback(async () => {
+    if (!user?.id) return;
+    deferKeyStep(user.id);
+    await goOn();
+  }, [goOn, user?.id]);
   useEffect(() => {
     if (!autoAdvanceArmed || !canContinue || busy) return;
     const timeout = window.setTimeout(() => {
@@ -15306,9 +15246,8 @@ function AddWalletsStep({ chrome } = {}) {
   }
   return /* @__PURE__ */ jsx(StepShell, { chrome, wide: true, children: /* @__PURE__ */ jsxs("div", { className: "space-y-4 sm:space-y-5 max-w-[420px] mx-auto", children: [
     /* @__PURE__ */ jsxs("div", { className: "text-center space-y-2", children: [
-      /* @__PURE__ */ jsx("p", { className: "text-[10px] uppercase tracking-[0.14em] text-text-secondary", children: "Secure setup" }),
-      /* @__PURE__ */ jsx("h2", { className: "text-[21px] text-text-primary font-medium leading-tight", children: "Your account is almost ready" }),
-      /* @__PURE__ */ jsx("p", { className: "text-[12px] leading-relaxed text-text-secondary max-w-[330px] mx-auto", children: "Add a signing key now. Your smart account is activated later, only when an on-chain action needs it." })
+      /* @__PURE__ */ jsx("h2", { className: "text-[21px] text-text-primary font-medium leading-tight", children: "Secure your account" }),
+      /* @__PURE__ */ jsx("p", { className: "text-[13px] leading-relaxed text-text-secondary max-w-[340px] mx-auto", children: "A passkey means only you can approve what is done in your name \u2014 one tap with Face ID, a fingerprint or your PIN. You can also do this later." })
     ] }),
     hasSyntheticEmail && /* @__PURE__ */ jsxs("div", { className: "rounded-lg bg-status-warning-bg border border-status-warning-text/20 p-3 space-y-2", children: [
       /* @__PURE__ */ jsx("div", { className: "text-[11px] text-status-warning-text", children: "Your account email is a temporary placeholder. Set a real one so you can recover access and (if you ever want it) link Averer KYC." }),
@@ -15335,20 +15274,10 @@ function AddWalletsStep({ chrome } = {}) {
         )
       ] })
     ] }),
-    !loading && /* @__PURE__ */ jsx(
-      SetupStatusPanel,
-      {
-        keyCount,
-        busy
-      }
-    ),
     /* @__PURE__ */ jsx(SuccessMoment, { visible: canContinue && autoAdvanceArmed && !error }),
-    loading ? /* @__PURE__ */ jsx("div", { className: "rounded-lg border border-dashed border-border-default bg-input-bg px-4 py-8 text-center text-[11px] text-text-secondary", children: "Loading\u2026" }) : keys.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-dashed border-border-default bg-input-bg px-4 py-7 flex flex-col items-center gap-2.5", children: [
-      /* @__PURE__ */ jsx("div", { className: "w-11 h-11 rounded-full bg-chip flex items-center justify-center", children: /* @__PURE__ */ jsx(KeyIcon, { className: "h-5 w-5 text-text-secondary", strokeWidth: 1.5 }) }),
-      /* @__PURE__ */ jsx("div", { className: "text-[11px] text-text-secondary", children: "No signing keys yet" })
-    ] }) : /* @__PURE__ */ jsxs("div", { className: "bg-input-bg rounded-lg px-4 py-3.5 space-y-3", children: [
+    loading ? /* @__PURE__ */ jsx("div", { className: "rounded-lg border border-dashed border-border-default bg-input-bg px-4 py-8 text-center text-[11px] text-text-secondary", children: "Loading\u2026" }) : keys.length === 0 ? null : /* @__PURE__ */ jsxs("div", { className: "bg-input-bg rounded-lg px-4 py-3.5 space-y-3", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-[11px]", children: [
-        /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "Signing keys" }),
+        /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "Your keys" }),
         /* @__PURE__ */ jsxs("span", { className: keyCount < RECOMMENDED_KEYS ? "text-status-warning-text" : "text-status-success-text", children: [
           keyCount === 1 && "1 key \xB7 add a backup",
           keyCount >= RECOMMENDED_KEYS && `${keyCount} keys`
@@ -15375,7 +15304,7 @@ function AddWalletsStep({ chrome } = {}) {
       }) })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsx("p", { className: "text-[11px] text-text-secondary text-center", children: !emailOk ? "Verify your email to unlock signing keys" : "Add a key" }),
+      !emailOk ? /* @__PURE__ */ jsx("p", { className: "text-[11px] text-text-secondary text-center", children: "Confirm your email first" }) : null,
       !emailOk && /* @__PURE__ */ jsxs(
         "button",
         {
@@ -15395,37 +15324,48 @@ function AddWalletsStep({ chrome } = {}) {
           type: "button",
           onClick: addPasskey,
           disabled: busy !== null || !emailOk,
-          className: "\n              w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n              bg-chip hover:bg-chip-hover\n              text-[12px] text-text-primary\n              transition-all duration-200\n              active:scale-[0.98]\n              disabled:opacity-40 disabled:cursor-not-allowed\n            ",
-          children: [
-            busy === "passkey" ? /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "\u2026" }) : /* @__PURE__ */ jsx(KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
-            /* @__PURE__ */ jsx("span", { children: "Add Passkey" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          onClick: addMetaMask,
-          disabled: busy !== null || !emailOk,
-          className: "\n              w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n              bg-chip hover:bg-chip-hover\n              text-[12px] text-text-primary\n              transition-all duration-200\n              active:scale-[0.98]\n              disabled:opacity-40 disabled:cursor-not-allowed\n            ",
+          className: `w-full min-h-[46px] flex items-center justify-center gap-2 py-2.5 rounded-lg text-[13px] font-medium transition-colors active:scale-[0.99] disabled:opacity-40 disabled:cursor-not-allowed ${canContinue ? "bg-chip hover:bg-chip-hover text-text-primary" : "bg-cta hover:bg-cta-hover text-on-cta"}`,
           children: [
-            busy === "metamask" ? /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "\u2026" }) : /* @__PURE__ */ jsx(KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
-            /* @__PURE__ */ jsx("span", { children: "Add MetaMask" })
+            busy === "passkey" ? /* @__PURE__ */ jsx("span", { children: "\u2026" }) : /* @__PURE__ */ jsx(KeyIcon, { className: "h-4 w-4", strokeWidth: 1.5 }),
+            /* @__PURE__ */ jsx("span", { children: canContinue ? "Add another passkey" : "Add a passkey" })
           ]
         }
       ),
-      !!config?.auth.enabled.includes("dynamic") && !!config?.auth.settings.dynamic?.environment_id && /* @__PURE__ */ jsxs(
+      walletsOpen ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: addMetaMask,
+            disabled: busy !== null || !emailOk,
+            className: "\n                  w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n                  bg-chip hover:bg-chip-hover\n                  text-[12px] text-text-primary\n                  transition-all duration-200\n                  active:scale-[0.98]\n                  disabled:opacity-40 disabled:cursor-not-allowed\n                ",
+            children: [
+              busy === "metamask" ? /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "\u2026" }) : /* @__PURE__ */ jsx(KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
+              /* @__PURE__ */ jsx("span", { children: "Add MetaMask" })
+            ]
+          }
+        ),
+        !!config?.auth.enabled.includes("dynamic") && !!config?.auth.settings.dynamic?.environment_id && /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => setShowDynamic(true),
+            disabled: busy !== null || !emailOk,
+            className: "\n                    w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n                    bg-chip hover:bg-chip-hover\n                    text-[12px] text-text-primary\n                    transition-all duration-200\n                    active:scale-[0.98]\n                    disabled:opacity-40 disabled:cursor-not-allowed\n                  ",
+            children: [
+              /* @__PURE__ */ jsx(KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
+              /* @__PURE__ */ jsx("span", { children: "Add Dynamic" })
+            ]
+          }
+        )
+      ] }) : /* @__PURE__ */ jsx(
         "button",
         {
           type: "button",
-          onClick: () => setShowDynamic(true),
-          disabled: busy !== null || !emailOk,
-          className: "\n                w-full min-h-[44px] flex items-center justify-center gap-2 py-2.5 rounded-lg\n                bg-chip hover:bg-chip-hover\n                text-[12px] text-text-primary\n                transition-all duration-200\n                active:scale-[0.98]\n                disabled:opacity-40 disabled:cursor-not-allowed\n              ",
-          children: [
-            /* @__PURE__ */ jsx(KeyIcon, { className: "h-4 w-4 text-text-secondary", strokeWidth: 1.5 }),
-            /* @__PURE__ */ jsx("span", { children: "Add Dynamic" })
-          ]
+          onClick: () => setWalletsOpen(true),
+          disabled: busy !== null,
+          className: "w-full py-1.5 text-[11px] text-text-secondary hover:text-text-primary transition-colors disabled:opacity-40",
+          children: "Use a crypto wallet instead"
         }
       )
     ] }),
@@ -15442,7 +15382,7 @@ function AddWalletsStep({ chrome } = {}) {
               registerOnChain: false,
               onComplete: async () => {
                 setShowDynamic(false);
-                setStatus("Signing key saved. Refreshing\u2026");
+                setStatus("Saved. One moment\u2026");
                 await refresh({ invalidate: true });
               },
               onError: (m) => {
@@ -15474,15 +15414,24 @@ function AddWalletsStep({ chrome } = {}) {
         onRetry: retryLastFailure
       }
     ),
-    /* @__PURE__ */ jsx(
+    canContinue ? /* @__PURE__ */ jsx(
       "button",
       {
         type: "button",
         onClick: onContinue,
-        disabled: !canContinue || busy === "continue",
-        className: "\n            w-full min-h-[46px] py-3 rounded-lg\n            bg-status-success-bg hover:opacity-80 text-status-success-text\n            text-[13px] font-medium\n            transition-all duration-200 active:scale-[0.99]\n            disabled:opacity-30 disabled:cursor-not-allowed disabled:hover:bg-status-success-bg\n          ",
+        disabled: busy === "continue",
+        className: "w-full min-h-[46px] py-3 rounded-lg bg-cta hover:bg-cta-hover text-on-cta text-[13px] font-medium transition-colors active:scale-[0.99] disabled:opacity-40 disabled:cursor-not-allowed",
         children: continueLabel
       }
+    ) : /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => void onSkip(),
+        disabled: busy !== null || !user?.id,
+        className: "w-full py-2 text-[13px] text-text-secondary hover:text-text-primary transition-colors disabled:opacity-40",
+        children: "Not now"
+      }
     ),
     keyCount === 1 && /* @__PURE__ */ jsx("p", { className: "text-[10px] text-text-secondary text-center pt-1", children: "Tip: a second key is your recovery path. If you lose your only key, the account is locked out." })
   ] }) });
@@ -23066,7 +23015,7 @@ function SecurityPage() {
                     rotateStep === "added" || rotateStep === "removing" || rotateStep === "remove-pending" || rotateStep === "done" ? "\u2713 " : "1. ",
                     "Add new key"
                   ] }),
-                  /* @__PURE__ */ jsx("span", { children: "\u2192" }),
+                  /* @__PURE__ */ jsx(ChevronRightIcon, { "aria-hidden": "true", className: "h-3 w-3" }),
                   /* @__PURE__ */ jsxs("span", { className: rotateStep === "added" || rotateStep === "removing" || rotateStep === "remove-pending" ? "text-text-primary font-medium" : "", children: [
                     rotateStep === "done" ? "\u2713 " : "2. ",
                     "Remove old key"
@@ -23996,9 +23945,9 @@ var GroupsView = ({
           "aria-label": `${sourceGroup?.name ?? "Owning group"} is operating ${activeOwnedGroup?.name ?? "owned group"}`,
           children: [
             /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate rounded-lg border border-border-default dark:border-white/[0.08] bg-chip dark:bg-white/[0.035] px-2.5 py-1.5 text-[11px] font-semibold text-text-secondary", children: "You" }),
-            /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "shrink-0 text-[12px] text-azure dark:text-cyan-300/70", children: "\u2192" }),
+            /* @__PURE__ */ jsx(ChevronRightIcon, { "aria-hidden": "true", className: "h-3.5 w-3.5 shrink-0 text-azure dark:text-cyan-300/70" }),
             /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate rounded-lg border border-border-default dark:border-white/[0.08] bg-chip dark:bg-white/[0.035] px-2.5 py-1.5 text-[11px] font-semibold text-text-secondary", children: sourceGroup?.name ?? compactGroupId(delegationSession.parentGroupId) }),
-            /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "shrink-0 text-[12px] text-azure dark:text-cyan-300/70", children: "\u2192" }),
+            /* @__PURE__ */ jsx(ChevronRightIcon, { "aria-hidden": "true", className: "h-3.5 w-3.5 shrink-0 text-azure dark:text-cyan-300/70" }),
             /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate rounded-lg border border-azure-line dark:border-cyan-300/[0.18] bg-azure-tint dark:bg-cyan-300/[0.08] px-2.5 py-1.5 text-[11px] font-semibold text-azure dark:text-cyan-200", children: activeOwnedGroup?.name ?? compactGroupId(delegationSession.currentGroupId) })
           ]
         }
@@ -24362,7 +24311,7 @@ function OwnedGroupRow({
   return /* @__PURE__ */ jsxs("li", { className: "px-3.5 py-3", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
       /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-[11px] font-semibold text-text-secondary", children: sourceName }),
-      /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "shrink-0 text-[12px] text-azure dark:text-cyan-300/70", children: "\u2192" }),
+      /* @__PURE__ */ jsx(ChevronRightIcon, { "aria-hidden": "true", className: "h-3.5 w-3.5 shrink-0 text-azure dark:text-cyan-300/70" }),
       /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-[12px] font-semibold text-text-primary", children: projection.group.name })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-center justify-between gap-3", children: [
@@ -29706,7 +29655,7 @@ var VerificationDialog = ({
             type: "button",
             onClick: () => setActiveProvider(null),
             className: "mb-3 text-[12px] text-text-secondary hover:text-text-primary",
-            children: "\u2190 Choose a different provider"
+            children: "\u2039 Choose a different provider"
           }
         ),
         /* @__PURE__ */ jsx(
@@ -29869,7 +29818,7 @@ function BusinessVerificationSection({
           type: "button",
           onClick: () => setFlowInstance(null),
           className: "mb-3 text-[12px] text-text-secondary hover:text-text-primary",
-          children: "\u2190 Back"
+          children: "\u2039 Back"
         }
       ),
       /* @__PURE__ */ jsx(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yieldfabric/wallet",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "Reusable YieldFabric wallet — login, signing, profile, and key management",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "YieldFabric Technologies Ltd",