@sponsorcoin/merit-wallet 0.0.1 → 0.0.2

package/dist/MeritWallet.js

@@ -33,61 +33,64 @@
 // Whether/when to render this component at all stays the host's call.
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { walletColors } from '@sponsorcoin/spcoin-common/styles';
+import { lockLogoStyle, fitImageStyle, walletFrameStyle, walletFrameCss, walletFrameClassName } from '@sponsorcoin/spcoin-common/styles';
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { getAddress } from 'viem';
+import { usePeerStates } from './peer/peerConnection';
+import { WALLET_SLUG_ID } from './wallet/walletSlugs';
+import { getAddress, formatUnits } from 'viem';
 import { SP_COIN_DISPLAY } from '@sponsorcoin/spcoin-common/panels';
 import { TRADE_DIRECTION, FEED_TYPE } from '@sponsorcoin/spcoin-common/context';
-import { usePanelTree, usePanelVisible, panelStore, useEnforceRadioPanelGroups, useEnforcePanelAncestorVisibility, useEnforceRadioPanelContainers, useAgentAccount, useSellTokenContract, useBuyTokenContract, useSlippage, useTradeDirection, useSellAmount, useBuyAmount, activeListPanelStore, } from '@sponsorcoin/spcoin-exchange-engine';
-import { PanelGate, WalletPanel, WalletSelectDropDownHosted, setWalletAssetBaseUrl, useWalletListTitle, WalletConnectProvider, ConfigSlippagePanel, PACKAGE_BUILD, SHOW_BUILD_MARKERS, LoginHeader, WalletNetworkHeader, ManageSponsorshipsPanel, AgentHeaderPanel, PasswordPanel, AssetListTable, AccountListCard, SponsorStakingListPanel, AssetListSelectPanel, PanelTreePanel, WalletBalanceContext, useFetchedBalance, fetchedBalanceText, NetworkListTable, WalletConfigPanel } from '@sponsorcoin/spcoin-panels';
+import { registerAccountDetailOpener, registerPreOpenAction, setAccountStoreBaseUrl, engineTrace, plainSendStepStore, stepThroughApprovalStore, stepPanelContentStore, stepPanelTitleStore, useStepPanel } from '@sponsorcoin/spcoin-exchange-engine';
+import { StakeConfirmPopup, useWalletListed, amountGate } from '@sponsorcoin/spcoin-panels';
+import { usePanelTree, usePanelVisible, useOpenActiveListPanel, useActiveListPanelChild, useEnforceRadioPanelGroups, useEnforcePanelAncestorVisibility, useAgentAccount, useActiveAccount, useSelectedAccount, buildSpCoinAccount, hydrateAccountFromAddress, useExchangeContext, useSellTokenContract, useBuyTokenContract, useSlippage, useTradeDirection, useSellAmount, useBuyAmount, activeListPanelStore, panelTreeTrace, useDisplayStack, usePreviewTokenContract, clampDisplay, isIntermediateDecimal, maxInputSz, TYPING_GRACE_MS, } from '@sponsorcoin/spcoin-exchange-engine';
+import { AssetSelectListPanel as AssetSelectListPanelHost, PanelGate, UniSelectPanelWithSwap, WalletPanel, WalletSelectDropDownHosted, setWalletAssetBaseUrl, useWalletListTitle, WalletConnectProvider, ConfigSlippagePanel, LoginHeader, WalletNetworkHeader, ManageSponsorshipsPanel, AgentHeaderPanel, PasswordPanel, AccountListCard, SponsorStakingListPanel, AssetListSelectPanel, PanelTreePanel, WalletBalanceContext, useFetchedBalanceResult, fetchedBalanceText, NetworkListTable, WalletConfigPanel, TokenLogo, AccountAvatar } from '@sponsorcoin/spcoin-panels';
 import { domPlatform } from './platform/domPlatform';
-import { MeritPlatformContext } from './platform/platform';
+import { MeritPlatformContext, usePlatform } from './platform/platform';
+import { RefreshTreeProvider, ImageCacheContext } from './refresh/refreshReact';
+import { createRefreshTree } from './refresh/refreshTree';
 import { ALL_WALLET_DERIVATIONS, mergeWalletProps, useWalletDerivedProps } from './wallet/walletProps';
 import { useApproverAccounts } from './wallet/approverAccountsReact';
 import { useApprovalMessagePanel } from './auth/useApprovalMessagePanel';
+import { accountNoticeStore } from './auth/accountNoticeStore';
+import { useAccountNoticeMessagePanel } from './auth/useAccountNoticeMessagePanel';
+import { useChainInfo } from './panels/useChainInfo';
 import { walletName } from './auth/authenticator';
-import { createMeritWalletIconCaches, buildNetworkRows as selfFetchNetworkRows, fetchAccountGroups as selfFetchAccountGroups, buildRecipientRows as selfFetchRecipientRows, buildAllAccountRows as selfFetchAllAccountRows, buildTokenRows as selfFetchTokenRows, NetworkSelectDropDown, WalletAccountHeader, PanelTitle, MenuTabHeaderBar, WalletRadioPanels, TradingStationPanel, SendTabPanel, AddressPanel, TokenDetailPanel, NetworkDetailPanel } from './panels';
+import { STATUS } from '@sponsorcoin/spcoin-common/context';
+import { createMeritWalletIconCaches, buildNetworkRows as selfFetchNetworkRows, fetchAccountGroups as selfFetchAccountGroups, buildTokenRows as selfFetchTokenRows, NetworkSelectDropDown, WalletAccountHeader, PanelTitle, MenuTabHeaderBar, WalletRadioPanels, TradingStationPanel, SendTabPanel, MeritInfoPanelReal } from './panels';
+import TokenPanel from './TokenPanel';
+import ConnectedNetworkPanel from './ConnectedNetworkPanel';
 // Panel visibility in this component goes through exactly one engine:
 // @sponsorcoin/spcoin-exchange-engine's panelStore, read via PanelGate /
 // usePanelVisible. The package's own separate store (panelState.ts) was
 // deleted 2026-10-02 — see this package's index.ts header for why a
 // second store let a tree toggle silently do nothing.
 import ConnectedMessagePanel from './ConnectedMessagePanel';
+import { useMeritApprovalMessagePanel } from './approval/useMeritApprovalMessagePanel';
+import { pendingApprovalMessageStore } from './approval/pendingApprovalMessageStore';
 import ConnectedRewardsPanel from './rewards/ConnectedRewardsPanel';
 import AddAccountFlow from './account/AddAccountFlow';
 import TestAccountsSection from './TestAccountsSection';
+import ConnectedSponsorPanel from './sponsor/ConnectedSponsorPanel';
+import { ConnectedTradeButton } from './trade/tradeHost';
 import WalletSessionDialogs, { sessionConfigHandlers } from './config/WalletSessionDialogs';
 import AccountDetailScreen from './account/AccountDetailScreen';
+import { resolveAccountSource } from './account/accountSource';
 import RecoveryPhraseScreen from './RecoveryPhraseScreen';
+import SecuritySetupScreen from './SecuritySetupScreen';
+import SecurityWarningScreen from './SecurityWarningScreen';
+import UnlockSecondStep from './UnlockSecondStep';
+import { setStakingListMode, useStakingListMode } from './sponsor/stakingListMode';
+import { anySignInStep, requiredSignInSteps } from './security/signInOptions';
+import WalletOnboardingPanel from './WalletOnboardingPanel';
 import ConnectedSponsorStakingList from './sponsor/ConnectedSponsorStakingList';
-import { buildSendReceipt } from './receipt/transactionReceipts';
+import { buildSendReceipt, toMessageAccount } from './receipt/transactionReceipts';
 import { isNativePlaceholder } from './send/sendTransfer';
+import { parseDecimalAmount } from './swap/parseDecimalAmount';
 import { useTransactionReceipt } from './receipt/useTransactionReceipt';
 import { ActiveAccountProfileContext } from './swap/activeAccountProfile';
 import ConnectedAgentSelectDropDown from './AgentSelectDropDown';
-import { classifyAddressText, useNativeToken } from '@sponsorcoin/spcoin-exchange-engine';
-// 2026-09-30, Stage B (real trade wiring) — a minimal, dependency-free
-// decimal-string -> bigint parser for the SWAP tab's amount inputs. No
-// `ethers`/`viem` import here on purpose: this is a portable package (the
-// extension's Vite bundle included), and a full BigNumber-parsing library
-// is unnecessary weight for one small, well-understood conversion. Returns
-// undefined (never throws) for anything not yet a complete number — a
-// mid-type state like "12." or "" — so the caller can just skip pushing to
-// real ExchangeContext that keystroke and keep the local text as typed.
-function parseDecimalAmount(text, decimals) {
-    const trimmed = text.trim();
-    if (!trimmed || trimmed === '.' || !/^\d*\.?\d*$/.test(trimmed))
-        return undefined;
-    const [wholeRaw, fracRaw = ''] = trimmed.split('.');
-    const whole = wholeRaw || '0';
-    const frac = fracRaw.slice(0, decimals).padEnd(decimals, '0');
-    try {
-        return BigInt(whole) * BigInt(10) ** BigInt(decimals) + BigInt(frac || '0');
-    }
-    catch {
-        return undefined;
-    }
-}
+import { useNativeToken } from '@sponsorcoin/spcoin-exchange-engine';
+// parseDecimalAmount (decimal text -> bigint, an empty box is 0) lives in ./swap/parseDecimalAmount.ts.
 // 2026-09-21, Path A ("single source of truth") — the 5-tab strip's own
 // real panel-tree ids, all confirmed members of RADIO_PANEL_GROUPS'
 // MAIN_RADIO_OVERLAY_PANELS group (verified by reading panelGroups.ts
@@ -102,9 +105,9 @@ const TAB_PANEL_IDS = {
     CONFIG: SP_COIN_DISPLAY.WALLET_CONFIG_PANEL,
 };
 const TAB_KEY_BY_PANEL_ID = Object.fromEntries(Object.entries(TAB_PANEL_IDS).map(([tab, id]) => [id, tab]));
-import SwapTradeButton from './swap/SwapTradeButton';
-import ConnectedUniSelectPanel from './swap/ConnectedUniSelectPanel';
 import { RADIO_PANEL_GROUPS_WITH_FALLBACKS, EMPTY_RADIO_PANEL_GROUPS } from './radioPanelGroups';
+import { PersistedTimeoutPicker } from './walletConfigPanelProps';
+import { DebugBugButton, DebugConfigSection, useDebugRuntime } from './debug/DebugBug';
 // 2026-09-21, Path A — which real id each ActiveListMode value opens.
 // Several modes share one list TYPE (sellToken/buyToken/sendToken/
 // sponsorPayToken all open the same token list) — distinguishing WHICH
@@ -147,6 +150,11 @@ import { RADIO_PANEL_GROUPS_WITH_FALLBACKS, EMPTY_RADIO_PANEL_GROUPS } from './r
 // recipient picker. Preserved here as two distinct private ids
 // (MERIT_WALLET_SEND_RECIPIENT_LIST_OVERLAY vs.
 // MERIT_WALLET_SPONSOR_RECIPIENT_LIST_OVERLAY) for the same reason.
+// Both since retired (2026-10-23, docs/meritFixes.txt §13-14) — neither
+// name exists in the enum anymore; sendRecipient now opens the real
+// REMOTE_ACCOUNT_SEND_LIST, sponsorRecipient's own mode was removed
+// earlier still (2026-10-11) when the Sponsor tab moved onto
+// REMOTE_ACCOUNT_RECIPIENT_LIST directly.
 // 2026-10-03 — token/account feeds return lowercase addresses, while the web
 // app shows EIP-55 checksummed ones (0xEe…EEeE vs 0xee…eeee for the very same
 // token). Normalize once, where a pick is committed, so every slot displays the
@@ -161,47 +169,34 @@ function toChecksumAddress(address) {
         return address;
     }
 }
+// 2026-10-22/23, owner investigation (docs/meritFixes.txt) — attempted
+// switching all six modes to the real shared ids at once; found Merit
+// Wallet already mounts AssetSelectListPanel internally (sharedListHost)
+// for the Sponsor tab's own shared-id pickers, and its render-priority
+// chain picks sharedListHost over this component's own listOverlay
+// whenever ASSET_SELECT_LIST_PANEL is visible — so switching these modes
+// to real, properly-nested ids without also unifying the two renderers
+// would blank Merit's own network/account/token screens, not just risk a
+// cross-page collision. Reverted, then redone one mode at a time instead,
+// each verified live before the next: sellToken/buyToken/sendToken first
+// (REMOTE_TOKEN_LIST, see paramsForMode's own doc comment below for the
+// mechanism and the stale-closure bug found along the way), confirmed
+// live; then this round, sendRecipient/account/network, completing the
+// set — all six now open through openActiveListPanel (see setActiveList
+// below), not a bare openPanel(). account/network additionally needed
+// AssetSelectListPanel to gain a host-rendered branch (renderAccountManagement/
+// renderNetworkList below) since, unlike the other four, nothing in
+// AssetSelectListPanel renders LOCAL_ACCOUNT_WALLET_LIST/NETWORK_LIST through
+// PanelListSelectWrapper — those need the host's own wallet/network data,
+// not a generic feed.
 const LIST_PANEL_ID_FOR_MODE = {
-    sellToken: SP_COIN_DISPLAY.MERIT_WALLET_TOKEN_LIST_OVERLAY,
-    buyToken: SP_COIN_DISPLAY.MERIT_WALLET_TOKEN_LIST_OVERLAY,
-    sendToken: SP_COIN_DISPLAY.MERIT_WALLET_TOKEN_LIST_OVERLAY,
-    sendRecipient: SP_COIN_DISPLAY.MERIT_WALLET_SEND_RECIPIENT_LIST_OVERLAY,
-    account: SP_COIN_DISPLAY.MERIT_WALLET_ACCOUNT_LIST_OVERLAY,
-    network: SP_COIN_DISPLAY.MERIT_WALLET_NETWORK_LIST_OVERLAY,
+    sellToken: SP_COIN_DISPLAY.REMOTE_TOKEN_LIST,
+    buyToken: SP_COIN_DISPLAY.REMOTE_TOKEN_LIST,
+    sendToken: SP_COIN_DISPLAY.REMOTE_TOKEN_LIST,
+    sendRecipient: SP_COIN_DISPLAY.REMOTE_ACCOUNT_SEND_LIST,
+    account: SP_COIN_DISPLAY.LOCAL_ACCOUNT_WALLET_LIST,
+    network: SP_COIN_DISPLAY.NETWORK_LIST,
 };
-// Every real id ANY mode above can open — used to unconditionally close
-// whichever one was actually open, without this component needing to
-// separately track "which real id is currently open" alongside
-// activeListMode itself (closePanel on an already-closed panel is a
-// no-op, so closing all of these is safe, not wasteful in any way that
-// matters).
-//
-// 2026-09-30 — these are now Merit Wallet's own private
-// MERIT_WALLET_*_LIST_OVERLAY ids (flat roots, no parent/children — see
-// spCoinDisplay.ts's own doc comment), not the real app's shared
-// REMOTE_TOKEN_LIST/ACTIVE_LIST_PANEL family. Since nothing else in the
-// tree declares them as a child, opening one no longer auto-reveals any
-// ancestor (useEnforcePanelAncestorVisibility.ts has nothing to walk up
-// to) — the explicit ACTIVE_LIST_PANEL/ASSET_LIST_SELECT_PANEL closes
-// this function used to need right after this loop are gone for the same
-// reason: there is no shared ancestor left for Merit Wallet to leave
-// stuck open.
-const ALL_LIST_PANEL_IDS = [
-    SP_COIN_DISPLAY.MERIT_WALLET_TOKEN_LIST_OVERLAY,
-    SP_COIN_DISPLAY.MERIT_WALLET_SEND_RECIPIENT_LIST_OVERLAY,
-    SP_COIN_DISPLAY.MERIT_WALLET_ACCOUNT_LIST_OVERLAY,
-    SP_COIN_DISPLAY.MERIT_WALLET_NETWORK_LIST_OVERLAY,
-];
-// Static sample rows — this package has no real feed to query (see
-// AssetListTable.tsx's own "placeholder, not logic" doc comment); a
-// representative, clearly-fake set is enough to prove the shared list
-// shape renders and scrolls correctly, same "representative state by
-// default" treatment ManageSponsorshipsPanel/RewardRow already use.
-const SAMPLE_TOKEN_ROWS = [
-    { id: '0xeeee', symbol: 'ETH', name: 'Ethereum', address: '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE' },
-    { id: '0xspcoinv0', symbol: 'SPCOIN_V0', name: 'Sponsor Coin V0', address: '0xf3405e01f11d9d7841b4dc61f13a9834c88a5e1b' },
-    { id: '0xweth', symbol: 'WETH', name: 'Wrapped Ether', address: '0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2' },
-];
 // Sample groups for AccountListCard.tsx (LOCAL_ACCOUNT_WALLET_LIST) — same
 // "Doggie | Hot Dog" example already used elsewhere in this file's own
 // sample data. No row is flagged isActive: the header must read "Select Account" until a real account is chosen, never a sample address.
@@ -237,7 +232,9 @@ const SAMPLE_NETWORK_ROWS = [
 // the header account list now renders AccountListCard directly, which takes
 // AccountListEntry as-is. AccountListRewardsPanel remains exported by the
 // package for hosts that want the reward-aware list.
-function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = false, onClose, titleBadgeSrc, onRefresh, refreshing, appType, wwwIconSrc, closeIconSrc, infoIconSrc, initialActiveTab, onActiveTabChange, initialMenuOpen, onMenuOpenChange, initialOpenTarget, onOpenTargetChange, networkRows, accountGroups, accountListNotice, activeWalletName, activeWalletId, nativeWalletId, walletConnection, onDisconnectWallet, showWalletSelect = true, walletAssetBaseUrl, wallet, tokenRows, recipientRows, rewardsHost, stakingHost, accountDetailHost, addAccountHost, activeAccountAddress, activeAccountName, activeAccountSymbol, activeAccountLogoURL, chainId, baseUrl, storage, refreshToken, onAccountRowSelect, onNetworkRowSelect, onAccountIconClick, onAddAccount, swapHost, accountDetail, onTokenIconClick, tokenDetail, onNetworkIconClick, sendAmount, onSendAmountChange, sendBusy, onSendSubmit, sponsorPanel, listHost, manageRadioPanels = true, overlayHost, agentSelectSlot, fetchBalance, listPanelIdOverrides, passwordMode = 'unlock', passwordIcon, walletLocked, onResetWallet, passwordErrorText, passwordNoticeText, onPasswordSubmit, passwordSubmitting, recoveryPhrase, onRecoveryPhraseSaved, sellBalanceText, buyBalanceText, zeroXTradeButtonContent, uniSelectContent, configPasswordMode, onConfigPasswordModeChange, configPersistedTimeoutContent, configPasswordDescription, configMandatorySecurity, onConfigMandatorySecurityChange, configMandatoryApproval, onConfigMandatoryApprovalChange, configPasswordResetPanelContent, configSyncMode, onConfigSyncModeChange, configSyncDescription, configLocation, onConfigLocationChange, configShowBackgroundPage, onConfigShowBackgroundPageChange, configModalMode, onConfigModalModeChange, configSecurityPanelContent, configSigningPanelContent, configBackupPanelContent, configTestAccounts, configUniSelectVisible, onConfigUniswapEngineChange, configZeroXEngineVisible, onConfig0xEngineChange, configResetPanelsContent, configExtensionChannel, onConfigExtensionChannelChange, configExtensionDownloadPath, onConfigLogoff, onConfigResetPassword, onConfigDeleteAccount, onConfigDeleteWallet, walletSession, }) {
+function MeritWalletInner({ docked = false, fullWidth = false, onClose, titleBadgeSrc, onRefresh, refreshing, appType, wwwIconSrc, closeIconSrc, infoIconSrc, initialActiveTab, onActiveTabChange, initialMenuOpen, onMenuOpenChange, initialOpenTarget, onOpenTargetChange, networkRows, accountGroups, accountListNotice, activeWalletName, activeWalletId, nativeWalletId, walletConnection, onDisconnectWallet, showWalletSelect = true, walletAssetBaseUrl, accountServiceUrl, wallet, tokenRows, rewardsHost, rewardsExtras, stakingHost, accountDetailHost, addAccountHost, remoteSelection, approvalPage, activeAccountAddress, activeAccountName, activeAccountSymbol, activeAccountLogoURL, chainId, baseUrl, storage, refreshToken, onAccountRowSelect, onNetworkRowSelect, onAccountIconClick, onAddAccount, accountDetail, onNetworkIconClick, sendAmount, onSendAmountChange, sendBusy, onSendSubmit, tradeHost, manageRadioPanels = true, fetchBalance, passwordMode = 'unlock', passwordIconSrc, approvalHost, walletLocked, onResetWallet, passwordErrorText, passwordNoticeText, onPasswordSubmit, passwordSubmitting, recoveryPhrase, onRecoveryPhraseSaved, securitySetup, sellBalanceText, buyBalanceText, configPasswordMode, onConfigPasswordModeChange, configPersistedTimeoutHours, onConfigPersistedTimeoutHoursChange, configPasswordDescription, configMandatorySecurity, onConfigMandatorySecurityChange, configMandatoryApproval, onConfigMandatoryApprovalChange, configPasswordResetPanelContent, configSyncMode, onConfigSyncModeChange, configSyncDescription, configLocation, onConfigLocationChange, configShowBackgroundPage, onConfigShowBackgroundPageChange, configModalMode, onConfigModalModeChange, configSecurityPanelContent, configSigningPanelContent, configBackupPanelContent, configTestAccounts, configUniSelectVisible, onConfigUniswapEngineChange, configZeroXEngineVisible, onConfig0xEngineChange, configResetPanelsContent, configDevToolsContent, configExtensionChannel, onConfigExtensionChannelChange, configExtensionDownloadPath, onConfigLogoff, onConfigResetPassword, onConfigDeleteAccount, onConfigDeleteWallet, walletSession, }) {
+    // 2026-11-14: the ladybug's hotkey, saved switch and error capture (debug/DebugBug.tsx)
+    useDebugRuntime();
     // 2026-09-21, Path A — activeTab is now DERIVED from the real engine's
     // activeMainOverlay (the same computed value PanelBootstrap itself
     // reads), not owned local state. useEnforceRadioPanelGroups/
@@ -248,6 +245,25 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // than adding a second host component sidepanel.ts would need to
     // remember to mount.
     const { activeMainOverlay, openPanel, closePanel, setPanelVisible: setRealPanelVisible, } = usePanelTree();
+    // 2026-10-29, on request ("it should at least open in message panel [...]
+    // Yes, move it into Message Panel") — replaces <ApprovalResponder
+    // host={approvalHost} /> (see this file's own git history): same
+    // decision logic, but it publishes to every ConnectedMessagePanel
+    // instance via pendingApprovalMessageStore instead of rendering its own
+    // standalone backdrop over everything — see that hook's own doc comment
+    // for why this call's return value (void) isn't what wires it up.
+    useMeritApprovalMessagePanel(approvalHost);
+    // 2026-10-23, owner investigation (docs/meritFixes.txt) — the sell/buy/
+    // send token pickers now open through the SAME mechanism Group 2's
+    // pickers (Sell/BuySelectPanelLayoutContainer.tsx, AgentSelectDropDown.tsx,
+    // RecipientSelectDropDown.tsx) already use successfully, instead of the
+    // raw openPanel()+local activeListMode path every other mode still uses.
+    // openActiveListPanel explicitly opens ASSET_SELECT_LIST_PANEL/
+    // ACTIVE_LIST_PANEL/the mode flag together (no reliance on a reactive
+    // ancestor-auto-reveal hook) and stashes the params sharedListHost's own
+    // PanelListSelectWrapper reads — the thing a bare enum swap alone did not
+    // supply, confirmed live (REMOTE_TOKEN_LIST alone opened nothing at all).
+    const { openActiveListPanel, closeActiveListPanel } = useOpenActiveListPanel();
     // 2026-10-09: result cards for Send / Sponsor. The active account's profile is filled in once the account rows are resolved (further down), and read at
     // the moment a result arrives.
     const showReceipt = useTransactionReceipt();
@@ -256,7 +272,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // panels but they did not close in the GUI... each gate should be
     // directly connected to its associated panel"). Confirmed by reading the
     // real web app's TradingStationPanel: SELL_SELECT_PANEL/ZERO_X_SELECT_
-    // PANEL/CONFIG_SLIPPAGE_PANEL/SWAP_ARROW_BUTTON are independent panel-
+    // PANEL/ZERO_X_CONFIG_SLIPPAGE_PANEL/SWAP_ARROW_BUTTON are independent panel-
     // tree nodes gated via usePanelTree().isVisible(ID) there — none of them
     // touch wagmi, so they're safe to gate directly here too, the same way
     // STAKING_CONTROLLER_PANEL already is elsewhere in this file. Root cause
@@ -280,7 +296,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // own doc comment).
     const [sellTokenContract, setSellTokenContract] = useSellTokenContract();
     const [buyTokenContract, setBuyTokenContract] = useBuyTokenContract();
-    const { data: slippage, setBps: setSlippageBps } = useSlippage();
+    const { data: slippage, setBps: setSlippageBps } = useSlippage('zeroX');
     // 2026-10-05, ZERO_X_SELECT_PANEL parity (live report: the web
     // app's buy row reads "You Receive ± 2.00% [cog]", the
     // extension's read plain "You Receive" with no cog) — the web
@@ -288,7 +304,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // buyLabel/onCogClick from useBuySelectPanelProps
     // (BuySelectPanelLayoutContainer.tsx: the label mirrors
     // SlippageComponent.tsx's !isSell/plain=false branch; the cog
-    // is the buy row's only entry point into CONFIG_SLIPPAGE_PANEL).
+    // is the buy row's only entry point into ZERO_X_CONFIG_SLIPPAGE_PANEL).
     // This component's SWAP-tab composition never supplied either,
     // so the shared pair fell back to its plain 'You Receive:'
     // default with no cog. Both are computed here now — same
@@ -297,17 +313,17 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // { bps: 200, percentage: 2, percentageString: '2.00%' }), so
     // percentageString needs no fallback.
     const [tradeDirection] = useTradeDirection();
-    const slippageCogVisible = usePanelVisible(SP_COIN_DISPLAY.CONFIG_SLIPPAGE_PANEL);
+    const slippageCogVisible = usePanelVisible(SP_COIN_DISPLAY.ZERO_X_CONFIG_SLIPPAGE_PANEL);
     const handleSlippageCog = useCallback(() => {
         if (slippageCogVisible) {
-            closePanel(SP_COIN_DISPLAY.CONFIG_SLIPPAGE_PANEL, 'MeritWallet:slippageCog:close');
+            closePanel(SP_COIN_DISPLAY.ZERO_X_CONFIG_SLIPPAGE_PANEL, 'MeritWallet:slippageCog:close');
         }
         else {
-            openPanel(SP_COIN_DISPLAY.CONFIG_SLIPPAGE_PANEL, 'MeritWallet:slippageCog:open');
+            openPanel(SP_COIN_DISPLAY.ZERO_X_CONFIG_SLIPPAGE_PANEL, 'MeritWallet:slippageCog:open');
         }
     }, [slippageCogVisible, openPanel, closePanel]);
     const buyLabel = tradeDirection === TRADE_DIRECTION.SELL_EXACT_OUT
-        ? `You Receive ± ${slippage.percentageString}`
+        ? `You Receive (Zero X) ± ${slippage.percentageString}`
         : 'You Receive:';
     // 2026-09-30, real bug fix (sweep after the same class of bug was
     // confirmed live in the web app's UniSelectPanel/index.tsx, in THIS
@@ -341,11 +357,39 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
             onMenuOpenChange?.(menuTabHeaderVisible);
     }, [menuTabHeaderVisible, onMenuOpenChange]);
     const panelTreeVisible = usePanelVisible(SP_COIN_DISPLAY.PANEL_TREE_PANEL);
+    // 2026-10-23 (owner report: MERIT_INFO_PANEL shows empty) — this flag and
+    // meritInfoOverlay below were lost when WalletOverlayHost.tsx (which used
+    // to render `slots.meritInfoPanel ?? <MeritInfoPanelReal />` for this
+    // exact panel) was deleted 2026-10-18 ("the web runs on the component's
+    // own body (overlay host and nine panels deleted)") — every OTHER
+    // full-body overlay it hosted (panelTreeOverlay among them) was ported
+    // into this component's own body at the same time; this one was missed.
+    const meritInfoVisible = usePanelVisible(SP_COIN_DISPLAY.MERIT_INFO_PANEL);
+    // 2026-11-13 (owner): the list opened by Rewards > Unstake has its own page title
+    const stakingListVisible = usePanelVisible(SP_COIN_DISPLAY.SPONSOR_STAKING_LIST);
+    const stakingListMode = useStakingListMode();
     const messageVisible = usePanelVisible(SP_COIN_DISPLAY.MESSAGE_PANEL);
+    // The header pills' chevrons follow the real visibility of their list (2026-10-30, on request), so a list opened by any other means flips them too.
+    // A step-through popup (Swap / Send / Sponsor) is drawn in MESSAGE_PANEL: its stage heading is the PANEL_TITLE, and the tab body stays mounted.
+    // 2026-11-11 (owner): a confirmation that names its own heading (the Remove Account one) shows it in PANEL_TITLE while its message is up
+    const confirmTitle = React.useSyncExternalStore(pendingApprovalMessageStore.subscribe, () => pendingApprovalMessageStore.getSnapshot()?.panelTitle, () => undefined);
+    // 2026-11-11 (owner): a message that names its own heading (the Sponsor config info, "Sponsorcoin Distribution Reward") shows it in PANEL_TITLE too, in place of the screen's title
+    const { errorMessage: shownMessage } = useExchangeContext();
+    const messageOwnTitle = messageVisible ? shownMessage?.title : undefined;
+    const stepContentUp = React.useSyncExternalStore(stepPanelContentStore.subscribe, () => stepPanelContentStore.getSnapshot() != null, () => false) && messageVisible;
+    const stepTitle = React.useSyncExternalStore(stepPanelTitleStore.subscribe, stepPanelTitleStore.getSnapshot, stepPanelTitleStore.getServerSnapshot);
+    React.useEffect(() => {
+        engineTrace('MeritWallet:stepContent', { stepContentUp, messageVisible, stepTitle });
+    }, [stepContentUp, messageVisible, stepTitle]);
     // 2026-10-13: where the wallet asset files are served from, for the pill, the list and the panel alike (a host on another origin, the extension, passes the web app's address)
+    if (accountServiceUrl !== undefined)
+        setAccountStoreBaseUrl(accountServiceUrl); // the same kind of module setting, read by the account form's sign-in and save
     if (walletAssetBaseUrl !== undefined)
         setWalletAssetBaseUrl(walletAssetBaseUrl); // set while rendering (an idempotent module setting), so the children's first render already reads it
-    const walletPanelVisible = usePanelVisible(SP_COIN_DISPLAY.WALLET_PANEL);
+    // 2026-11-01 (owner rule: a panel is drawn only while the panel tree says its branch is open). The detail screens below (account, agent, sponsor, recipient, token, network, wallet) are members of ASSET_RADIO_PANELS: their own flag outlives the branch now (closing a panel closes
+    // just that panel), so each is drawn only while ASSET_RADIO_PANELS itself is open. Live log: the Account Details screen kept covering a list the tree had switched to.
+    const assetRadioOpen = usePanelVisible(SP_COIN_DISPLAY.ASSET_RADIO_PANELS);
+    const walletPanelVisible = usePanelVisible(SP_COIN_DISPLAY.WALLET_PANEL) && assetRadioOpen;
     const walletLogoVisible = usePanelVisible(SP_COIN_DISPLAY.WALLET_LOGO);
     const walletMetaDataVisible = usePanelVisible(SP_COIN_DISPLAY.WALLET_META_DATA);
     const sellVisible = usePanelVisible(SP_COIN_DISPLAY.SELL_SELECT_PANEL);
@@ -359,12 +403,8 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // called every render, just with nothing to enforce when disabled).
     useEnforceRadioPanelGroups(manageRadioPanels ? RADIO_PANEL_GROUPS_WITH_FALLBACKS : EMPTY_RADIO_PANEL_GROUPS);
     useEnforcePanelAncestorVisibility();
-    // 2026-10-03 — containment, and it MUST come after ancestor reveal above.
-    // React runs effects in hook order within a commit, so a bare
-    // setPanelVisible on one of the twelve detail panels gets its container
-    // opened first and this pass then stands down; the other order would close
-    // the panel again in the same flush that revealed its container.
-    useEnforceRadioPanelContainers(manageRadioPanels ? RADIO_PANEL_GROUPS_WITH_FALLBACKS : EMPTY_RADIO_PANEL_GROUPS);
+    // 2026-11-01 (owner rule): closing a panel closes just that panel. The container enforcement that used to run here (it force-closed a group's
+    // members when their container closed) is removed. See docs/meritFixes.txt, "PANEL CLOSE RULE".
     // 2026-09-25, on request ("migrate AGENT_HEADER_PANEL") — useAgentAccount
     // is genuinely portable (already in @sponsorcoin/spcoin-exchange-engine),
     // so agentAccount here is real, live, shared state — not a placeholder —
@@ -392,13 +432,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     const [selfFetchedNetworkRows, setSelfFetchedNetworkRows] = useState(undefined);
     const [selfFetchedAccountGroups, setSelfFetchedAccountGroups] = useState(undefined);
     const [selfFetchedTokenRows, setSelfFetchedTokenRows] = useState(undefined);
-    // false until the token self-fetch has finished (rows or failure): until then the pickers must not show the placeholder rows as if they were the real list.
-    const [tokenFetchSettled, setTokenFetchSettled] = useState(false);
-    const [selfFetchedRecipientRows, setSelfFetchedRecipientRows] = useState(undefined);
-    // 2026-10-03 — Send's recipient picker lists every known account, not the
-    // chain's recipient directory (see buildAllAccountRows' doc comment).
-    const [selfFetchedAllAccountRows, setSelfFetchedAllAccountRows] = useState(undefined);
-    // Only fetches whichever of the 4 the caller did NOT already supply
+    // Only fetches whichever of the 3 the caller did NOT already supply
     // explicitly (checked once, at effect-run time — an explicit prop always
     // wins, self-fetch never overwrites it). Re-runs if chainId/baseUrl
     // change (e.g. the host's own wallet switches networks) OR refreshToken
@@ -413,13 +447,24 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // per-domain isolation meritWalletDataFetch.ts's own functions already
     // guarantee.
     const hasFetchedOnceRef = useRef(false);
+    // 2026-11-04: an image put in (or dropped from) the cache changes this, so the rows are read again from the cache, not refetched
+    const [imageVersion, setImageVersion] = useState(0);
+    // 2026-11-13: first-run pages after the password: the phrase, then the optional second step, then the warning page (the phrase itself is already dropped by its screen)
+    const [setupStage, setSetupStage] = useState('phrase');
+    // 2026-11-13: the password typed on the unlock screen, held in memory only while the extra sign-in steps are asked for
+    const [pendingUnlock, setPendingUnlock] = useState(undefined);
+    const imageVersionSeenRef = useRef(0);
+    const imagePlatform = usePlatform();
+    useEffect(() => imagePlatform.onImageCacheUpdated?.(() => setImageVersion((n) => n + 1)), [imagePlatform]);
     const tokenRowsChainRef = useRef(undefined);
     useEffect(() => {
         if (chainId == null)
             return;
         const caches = iconCachesRef.current;
         const resolvedBaseUrl = baseUrl ?? '';
-        const forceRefresh = hasFetchedOnceRef.current;
+        const imageOnly = imageVersionSeenRef.current !== imageVersion;
+        imageVersionSeenRef.current = imageVersion;
+        const forceRefresh = hasFetchedOnceRef.current && !imageOnly;
         hasFetchedOnceRef.current = true;
         let cancelled = false;
         if (networkRows === undefined) {
@@ -429,40 +474,27 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                 .catch((error) => console.error('MeritWallet: failed to self-fetch network rows:', error));
         }
         if (accountGroups === undefined) {
-            void selfFetchAccountGroups(chainId, resolvedBaseUrl, caches, forceRefresh)
+            void selfFetchAccountGroups(chainId, resolvedBaseUrl, caches, forceRefresh, (partial) => { if (!cancelled)
+                setSelfFetchedAccountGroups(partial); })
                 .then((groups) => { if (!cancelled)
                 setSelfFetchedAccountGroups(groups); })
                 .catch((error) => console.error('MeritWallet: failed to self-fetch account groups:', error));
         }
         if (tokenRows === undefined) {
-            setTokenFetchSettled(false);
             // another chain's rows must not stay up while this chain's list loads
             if (tokenRowsChainRef.current !== undefined && tokenRowsChainRef.current !== chainId)
                 setSelfFetchedTokenRows(undefined);
             tokenRowsChainRef.current = chainId;
             void selfFetchTokenRows(chainId, resolvedBaseUrl, caches, forceRefresh)
-                .then((rows) => { if (!cancelled) {
-                setSelfFetchedTokenRows(rows);
-                setTokenFetchSettled(true);
-            } })
-                .catch((error) => { console.error('MeritWallet: failed to self-fetch token rows:', error); if (!cancelled)
-                setTokenFetchSettled(true); });
-        }
-        if (recipientRows === undefined) {
-            void selfFetchRecipientRows(chainId, resolvedBaseUrl, caches, forceRefresh)
                 .then((rows) => { if (!cancelled)
-                setSelfFetchedRecipientRows(rows); })
-                .catch((error) => console.error('MeritWallet: failed to self-fetch recipient rows:', error));
+                setSelfFetchedTokenRows(rows); })
+                .catch((error) => console.error('MeritWallet: failed to self-fetch token rows:', error));
         }
-        void selfFetchAllAccountRows(resolvedBaseUrl, caches, forceRefresh)
-            .then((rows) => { if (!cancelled)
-            setSelfFetchedAllAccountRows(rows); })
-            .catch((error) => console.error('MeritWallet: failed to self-fetch all-account rows:', error));
         return () => {
             cancelled = true;
         };
-        // Deliberately NOT depending on networkRows/accountGroups/tokenRows/
-        // recipientRows themselves — those are "did the caller supply this at
+        // Deliberately NOT depending on networkRows/accountGroups/tokenRows
+        // themselves — those are "did the caller supply this at
         // all" checks meant to run once per chainId/baseUrl/refreshToken
         // change, not on every render; including them would refetch every
         // time self-fetched state itself changes (an infinite loop for
@@ -470,25 +502,42 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
         // these two deps includes is exactly what a targeted lint-disable
         // here is for).
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [chainId, baseUrl, refreshToken]);
+    }, [chainId, baseUrl, refreshToken, imageVersion]);
     // Layering: explicit prop > self-fetched > (existing SAMPLE_* fallback,
-    // applied further down at each of these 4's own point of use, unchanged).
+    // applied further down at each of these 3's own point of use, unchanged).
     const resolvedNetworkRows = networkRows ?? selfFetchedNetworkRows;
     const fetchedAccountGroups = accountGroups ?? selfFetchedAccountGroups;
+    // 2026-10-26 (owner report: MetaMask's and the extension's own rows
+    // never showed "Connected", though their groups correctly showed
+    // ACTIVE, and only the native Merit group's row worked) -- root cause,
+    // confirmed via a captured trace: buildApproverGroups (approverAccounts.ts)
+    // already computes isActive correctly, checking BOTH the active account
+    // address AND which authenticator/group it belongs to
+    // (isActiveSource && same(entry.address, activeAddress)). This memo used
+    // to unconditionally RECOMPUTE isActive from scratch, by address alone,
+    // with no idea which authenticator a row's own address belongs to --
+    // a second, redundant source of truth for the exact same flag, the same
+    // "two places decide one thing" shape behind several other bugs this
+    // session. Now only fills isActive when the caller hasn't already
+    // decided it (the self-fetched/SAMPLE fallback path, whose accounts
+    // never carry the flag); the approver system's own already-correct
+    // value is no longer overwritten.
     const resolvedAccountGroups = useMemo(() => {
         if (activeAccountAddress === undefined || !fetchedAccountGroups)
             return fetchedAccountGroups;
         const want = activeAccountAddress.trim().toLowerCase();
         return fetchedAccountGroups.map((group) => ({
             ...group,
-            accounts: group.accounts.map((account) => ({ ...account, isActive: !!want && String(account.address ?? '').toLowerCase() === want })),
+            accounts: group.accounts.map((account) => ({
+                ...account,
+                isActive: typeof account.isActive === 'boolean' ? account.isActive : !!want && String(account.address ?? '').toLowerCase() === want,
+            })),
         }));
     }, [fetchedAccountGroups, activeAccountAddress]);
     const resolvedTokenRows = tokenRows ?? selfFetchedTokenRows;
-    const resolvedRecipientRows = recipientRows ?? selfFetchedRecipientRows;
     const [openTarget, setOpenTarget] = useState(initialOpenTarget ?? 'prod');
     // 2026-09-21, Path A — REAL BUG caught and fixed before shipping, not
-    // hypothetical: `ASSET_LIST_SELECT_PANEL` (the list overlay's real
+    // hypothetical: `ASSET_SELECT_LIST_PANEL` (the list overlay's real
     // parent) is a `MAIN_RADIO_OVERLAY_PANELS` sibling of every trade-tab
     // panel (confirmed by reading `panelTreeCallbacks.ts`'s own `openPanel`
     // directly — opening any `ACTIVE_LIST_PANEL` child walks `PARENT_OF` up
@@ -533,42 +582,90 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     if (derivedTab)
         lastKnownTabRef.current = derivedTab;
     const activeTab = derivedTab ?? lastKnownTabRef.current;
+    // 2026-10-24 (owner report, screenshots): the TAB STRIP's own highlight
+    // must NOT use activeTab above — that intentionally keeps remembering the
+    // last real tab for gatedTabBody (which tab's own content renders while a
+    // list/detail covers it), which is right for THAT, but wrong for what the
+    // tab strip visually shows: "if the associated Tab Panel is on top of the
+    // [real navigation] stack, then it is highlighted. if not, it is not" —
+    // the owner's own rule, confirmed across 7 screenshots (Swap stayed
+    // highlighted with MERIT_INFO_PANEL covering the body and
+    // TRADING_STATION_PANEL buried under WALLET_CONFIG_PANEL in the stack;
+    // Config stayed highlighted with ASSET_SELECT_LIST_PANEL — the network
+    // selector, opened from the header, not the Config tab itself — on top).
+    // displayStackIds (useDisplayStack, real React state, re-renders on every
+    // push/pop) is the actual navigation stack; its own last entry is "what
+    // is really on top" -- TAB_KEY_BY_PANEL_ID[that] is the tab to highlight,
+    // or null for none, with NO lastKnownTabRef-style fallback (that fallback
+    // is exactly the bug: it remembers a tab that is no longer on top).
+    const { displayStackIds } = useDisplayStack();
+    const topOfStackId = displayStackIds.length > 0 ? displayStackIds[displayStackIds.length - 1] : undefined;
+    const highlightedTab = topOfStackId != null ? TAB_KEY_BY_PANEL_ID[topOfStackId] ?? null : null;
     // The list owns its picker destination in the engine's parameter store;
     // this component keeps no duplicate slot state. The panel tree still owns visibility.
     const activeListModeLocal = React.useSyncExternalStore(activeListPanelStore.subscribe, activeListPanelStore.getWalletListSelectionSlot, () => null);
-    // 2026-10-05 — the ADDRESS_PANEL's typed value for the open token/recipient list.
-    // Cleared whenever the list changes or closes (setActiveList below).
-    const [addressInput, setAddressInput] = useState('');
-    // What the host's resolver made of the typed address (only for addresses NOT in the loaded
-    // rows). `result: null` = lookup in flight. See the effect below buildAddressBar.
-    const [entryResolution, setEntryResolution] = useState(null);
-    const addressRowsRef = useRef([]);
-    const listPanelIdFor = (mode) => listPanelIdOverrides?.[mode] ?? LIST_PANEL_ID_FOR_MODE[mode];
-    const accountListTreeOpen = usePanelVisible(listPanelIdFor('account'));
-    const networkListTreeOpen = usePanelVisible(listPanelIdFor('network'));
-    // A tab on screen means no list is: a shared list's own flag stays set while another tab shows (it is covered, not closed), so it only counts while no tab is the visible overlay.
-    // A tab covers a list only when the list is one of the shared radio panels (the host passed listPanelIdOverrides: opening it closed the tab's radio member, so a tab that is on screen again means the list was covered, not closed).
-    // The wallet's own private list overlays are not radio members: the tab stays the main overlay while one is open, and the list the person just opened must show.
-    const tabCoversList = !!derivedTab && !!listPanelIdOverrides;
-    const activeListMode = tabCoversList ? null : activeListModeLocal ?? (accountListTreeOpen ? 'account' : networkListTreeOpen ? 'network' : null);
+    const listPanelIdFor = (mode) => LIST_PANEL_ID_FOR_MODE[mode];
+    // 2026-10-23 (docs/meritFixes.txt §15-16) — the single source of truth for
+    // "which ACTIVE_LIST_PANEL_MODES member is really active right now,"
+    // already ANDed against ASSET_SELECT_LIST_PANEL's own visibility (see
+    // useActiveListPanelChild's own doc comment for why that AND-gate, not an
+    // effect-based reset, is what actually closes this bug). Used both here
+    // (replacing the old accountListTreeOpen/networkListTreeOpen fallback,
+    // which read the two leaky child flags directly) and below, for
+    // sharedListHost — one read, two consumers, so they can never disagree.
+    const activeChild = useActiveListPanelChild();
+    // The wallet's own list overlays are not radio members: the tab stays the main overlay while one is open, and the list the person just opened must show.
+    // 2026-11-01 (owner rule: a panel is drawn only while the panel tree says it is open): the selection slot is not state about what is on screen, it is the picker destination. It counts only while the list's own panel,
+    // ASSET_SELECT_LIST_PANEL, is visible. Without this, a tab switch (which no longer clears the slot) left the account list drawn over the Swap tab.
+    const listPanelOpen = usePanelVisible(SP_COIN_DISPLAY.ASSET_SELECT_LIST_PANEL);
+    // 2026-11-02 (owner: closing LOCAL_ACCOUNT_WALLET_LIST in the tree left the account list drawn): the slot counts only while ITS OWN panel is the open child too, so closing that one panel removes the list from the screen.
+    const slotShowing = activeListModeLocal != null && activeChild === listPanelIdFor(activeListModeLocal);
+    const activeListMode = !listPanelOpen
+        ? null
+        : slotShowing
+            ? activeListModeLocal
+            : (activeChild === SP_COIN_DISPLAY.LOCAL_ACCOUNT_WALLET_LIST
+                ? 'account'
+                : activeChild === SP_COIN_DISPLAY.NETWORK_LIST
+                    ? 'network'
+                    : null);
+    // 2026-10-23 — all six modes now open through openActiveListPanel (see
+    // paramsForMode below), not a bare openPanel(): openPanel(childId) alone
+    // never actually opens ASSET_SELECT_LIST_PANEL (a MAIN_RADIO_OVERLAY_PANELS
+    // member — useEnforcePanelAncestorVisibility.ts deliberately stops its
+    // ancestor-reveal walk before those), so sharedListHost's own
+    // PanelListSelectWrapper / host-rendered branches never actually showed.
+    // paramsForMode is defined further down (after the state/handlers it
+    // closes over), but that's fine — this function isn't CALLED until some
+    // later click, well after this render (and paramsForMode's own
+    // definition) has completed.
     const setActiveList = (mode) => {
-        setAddressInput('');
         if (mode) {
             activeListPanelStore.setWalletListSelectionSlot(mode);
-            openPanel(listPanelIdFor(mode), 'MeritWallet:setActiveList');
+            openActiveListPanel(paramsForMode(mode), 'MeritWallet:setActiveList', listPanelIdFor(mode));
         }
         else {
             activeListPanelStore.setWalletListSelectionSlot(null);
-            const overrideIds = Object.values(listPanelIdOverrides ?? {});
-            for (const id of [...ALL_LIST_PANEL_IDS, ...overrideIds])
-                closePanel(id, 'MeritWallet:setActiveList:close');
-            if (panelStore.isVisible(SP_COIN_DISPLAY.ASSET_LIST_SELECT_PANEL))
-                closePanel(SP_COIN_DISPLAY.ASSET_LIST_SELECT_PANEL, 'NAV_POP:MeritWallet:setActiveList:close');
+            // 2026-10-23 — was a hand-rolled partial close (just
+            // activeListPanelStore.clear() + closing ASSET_SELECT_LIST_PANEL
+            // itself), which never closed the specific ACTIVE_LIST_PANEL_MODES
+            // child that was actually open (e.g. NETWORK_LIST) — the exact root
+            // cause of the "pop the stack, content stays visible" bug (docs/
+            // meritFixes.txt §15-16). closeActiveListPanel already does this
+            // correctly (closes whichever mode is open, then ACTIVE_LIST_PANEL,
+            // then this panel, then clears the store) — same call Group 2's own
+            // pickers already use to close. The AND-gated useActiveListPanelChild
+            // hook makes every reader of activeChild immune to a stale child flag
+            // regardless, but other direct readers of these six flags (e.g.
+            // TokenPanel.tsx) are not — this is the real fix, not a belt-and-
+            // suspenders extra.
+            closeActiveListPanel('NAV_POP:MeritWallet:setActiveList:close');
         }
     };
     // A header chevron TOGGLES its list: down opens it (pushes the display stack), up closes it (pops it). Open = the local mode OR the tree flag of the list id (a host may have opened it through the tree).
     const toggleList = (mode) => {
-        if (activeListMode === mode || panelStore.isVisible(listPanelIdFor(mode)))
+        // open means the list is SHOWING (its panel open AND this mode active), not that the mode's own flag is set: the flag outlives a tab switch now (closing a panel closes just that panel)
+        if (activeListMode === mode || activeChild === listPanelIdFor(mode))
             setActiveList(null);
         else
             setActiveList(mode);
@@ -591,9 +688,99 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
         };
     }, [resolvedTokenRows, resolvedNetworkRows, nativeMeta]);
     const sendTokenEntry = selections.sendToken ?? nativeSendEntry;
+    // 2026-10-30, on request ("animate the Send tab like you animated the Swap tab with the step tab on") - with the Steps checkbox checked the
+    // Send click opens the step popup (Confirm Send -> Send Complete, with the receipt behind a scroll) instead of sending at once. A plain
+    // transfer has no approve stage. The popup's state lives in plainSendStepStore (reading the receipt opens MESSAGE_PANEL).
+    const plainSend = React.useSyncExternalStore(plainSendStepStore.subscribe, plainSendStepStore.getSnapshot, plainSendStepStore.getServerSnapshot);
+    const sendRecipientProfile = {
+        address: selections.sendRecipient?.address,
+        name: selections.sendRecipient?.name,
+        symbol: selections.sendRecipient?.symbol,
+        logoURL: selections.sendRecipient?.iconSrc,
+    };
+    // The real send. deferReceipt: keep the success receipt for the popup's scroll instead of opening MESSAGE_PANEL; a failure always opens it.
+    const performSend = async (deferReceipt) => {
+        if (!onSendSubmit)
+            return false;
+        const params = {
+            recipientAddress: selections.sendRecipient?.address,
+            tokenAddress: sendTokenEntry.address,
+            decimals: sendTokenEntry.decimals,
+            tokenSymbol: sendTokenEntry.symbol,
+            amount: sendAmount ?? '',
+        };
+        const result = await Promise.resolve(onSendSubmit(params));
+        if (!result)
+            return false;
+        const receipt = buildSendReceipt({
+            result,
+            amount: params.amount,
+            tokenSymbol: params.tokenSymbol ?? '',
+            tokenAddress: isNativePlaceholder(params.tokenAddress) ? undefined : params.tokenAddress,
+            from: activeProfileRef.current,
+            to: sendRecipientProfile,
+        });
+        // A confirmed send clears the amount; a failed one leaves everything as it was.
+        if (result.ok)
+            onSendAmountChange?.('');
+        if (deferReceipt && result.ok) {
+            plainSendStepStore.set({ receipt, phase: 'done' });
+            return true;
+        }
+        showReceipt(receipt, 'MeritWallet:send');
+        return result.ok;
+    };
+    const startSend = () => {
+        if (stepThroughApprovalStore.get()) {
+            plainSendStepStore.set({ open: true, phase: 'confirm', viewing: false, viewingSeen: false, receipt: null, scrollRead: false });
+            return;
+        }
+        void performSend(false);
+    };
+    const confirmSendStep = async () => {
+        if (plainSendStepStore.get().phase === 'confirm') {
+            const ok = await performSend(true);
+            if (!ok)
+                plainSendStepStore.close(); // a failure has already opened its error receipt
+            return;
+        }
+        plainSendStepStore.close(); // done: the "Send Complete" button
+    };
+    const showSendStepReceipt = () => {
+        const saved = plainSendStepStore.get().receipt;
+        if (saved)
+            showReceipt(saved, 'MeritWallet:send');
+        plainSendStepStore.set({ scrollRead: true, viewing: true, viewingSeen: false });
+    };
+    // Reading the receipt hides the popup until MESSAGE_PANEL closes again, then it comes back exactly as it was.
+    useEffect(() => {
+        if (!plainSend.viewing)
+            return;
+        if (messageVisible) {
+            if (!plainSend.viewingSeen)
+                plainSendStepStore.set({ viewingSeen: true });
+            return;
+        }
+        if (plainSend.viewingSeen)
+            plainSendStepStore.set({ viewing: false, viewingSeen: false });
+    }, [plainSend.viewing, plainSend.viewingSeen, messageVisible]);
+    const sendStepElement = (_jsx(StakeConfirmPopup, { isOpen: true, inline: true, mode: "SPONSOR", isSpCoin: false, sendOnly: true, payTokenContract: { address: sendTokenEntry.address ?? '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE', chainId, symbol: sendTokenEntry.symbol, name: sendTokenEntry.name, decimals: sendTokenEntry.decimals, logoURL: sendTokenEntry.iconSrc }, activeAccount: toMessageAccount(activeProfileRef.current), recipientAccount: toMessageAccount(sendRecipientProfile), hasAgent: false, swapReceiptReady: plainSend.phase === 'done', swapReceiptKept: plainSend.phase === 'done', swapScrollRead: plainSend.scrollRead, onShowSwapReceipt: showSendStepReceipt, onCancel: () => plainSendStepStore.close(), onConfirm: () => {
+            void confirmSendStep();
+        }, chainId: chainId }));
+    useStepPanel({
+        element: sendStepElement,
+        showing: plainSend.open && !plainSend.viewing,
+        over: !plainSend.open,
+        onPanelClosed: () => plainSendStepStore.close(),
+        invoker: 'MeritWallet:sendStep',
+    });
     // 2026-10-11 (row 13): a list the shared panels opened through the panel tree (pay token, recipient, agent); the host's listHost renders it.
     useApprovalMessagePanel();
-    const panelTreeListOpen = usePanelVisible(SP_COIN_DISPLAY.ASSET_LIST_SELECT_PANEL);
+    const panelTreeListOpen = usePanelVisible(SP_COIN_DISPLAY.ASSET_SELECT_LIST_PANEL);
+    // sharedListHost itself (it needs renderNetworkList/renderAccountManagement,
+    // defined further down near where they used to live as listOverlay's own
+    // 'account'/'network' branches) is declared below, after those two
+    // functions — see its own doc comment there.
     // 2026-10-13 (owner request): the wallet pill belongs to the Add a Wallet/Account menu (ADD_WALLET_ACCOUNT: Create Account, Import, Connect), where it picks the wallet the account is added to, and to the wallet list
     // it opens (REMOTE_WALLET_LIST). It is NOT on the account list itself or on the tab pages.
     const addMenuVisible = usePanelVisible(SP_COIN_DISPLAY.ADD_WALLET_ACCOUNT);
@@ -601,28 +788,19 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // (activeListMode), leaving the menu title over an empty body, and only the second press left.
     const importWalletLeafVisible = usePanelVisible(SP_COIN_DISPLAY.IMPORT_A_WALLET);
     const importAccountLeafVisible = usePanelVisible(SP_COIN_DISPLAY.IMPORT_AN_ACCOUNT);
-    const connectAccountLeafVisible = usePanelVisible(SP_COIN_DISPLAY.CONNECT_ACCOUNT);
-    const connectHardwareLeafVisible = usePanelVisible(SP_COIN_DISPLAY.CONNECT_HARDWARE_WALLET);
     const createAccountLeafVisible = usePanelVisible(SP_COIN_DISPLAY.CREATE_ACCOUNT);
     const walletListLeafVisible = usePanelVisible(SP_COIN_DISPLAY.WALLET_LIST_SELECT_PANEL);
-    const connectExtensionLeafVisible = usePanelVisible(SP_COIN_DISPLAY.CONNECT_MERIT_EXTENSION);
-    const addFlowTop = connectExtensionLeafVisible
-        ? SP_COIN_DISPLAY.CONNECT_MERIT_EXTENSION
-        : walletListLeafVisible
-            ? SP_COIN_DISPLAY.WALLET_LIST_SELECT_PANEL
-            : importWalletLeafVisible
-                ? SP_COIN_DISPLAY.IMPORT_A_WALLET
-                : importAccountLeafVisible
-                    ? SP_COIN_DISPLAY.IMPORT_AN_ACCOUNT
-                    : connectAccountLeafVisible
-                        ? SP_COIN_DISPLAY.CONNECT_ACCOUNT
-                        : connectHardwareLeafVisible
-                            ? SP_COIN_DISPLAY.CONNECT_HARDWARE_WALLET
-                            : createAccountLeafVisible
-                                ? SP_COIN_DISPLAY.CREATE_ACCOUNT
-                                : addMenuVisible
-                                    ? SP_COIN_DISPLAY.ADD_WALLET_ACCOUNT
-                                    : undefined;
+    const addFlowTop = walletListLeafVisible
+        ? SP_COIN_DISPLAY.WALLET_LIST_SELECT_PANEL
+        : importWalletLeafVisible
+            ? SP_COIN_DISPLAY.IMPORT_A_WALLET
+            : importAccountLeafVisible
+                ? SP_COIN_DISPLAY.IMPORT_AN_ACCOUNT
+                : createAccountLeafVisible
+                    ? SP_COIN_DISPLAY.CREATE_ACCOUNT
+                    : addMenuVisible
+                        ? SP_COIN_DISPLAY.ADD_WALLET_ACCOUNT
+                        : undefined;
     const walletListVisible = usePanelVisible(SP_COIN_DISPLAY.REMOTE_WALLET_LIST);
     // 2026-10-03 — token balances (see fetchBalance's doc comment). The active
     // account is read straight off the resolved groups here because the tab bodies
@@ -633,18 +811,27 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // 2026-10-05 — every row (this component's own AND any a host renders inside overlayHost) reads the same
     // fetcher + account through this context; see walletBalance.tsx.
     const walletBalanceValue = useMemo(() => ({ fetchBalance, accountAddress: activeBalanceAccount, refreshToken }), [fetchBalance, activeBalanceAccount, refreshToken]);
-    const sendBalance = useFetchedBalance(fetchBalance, sendTokenEntry.address, activeBalanceAccount, refreshToken);
+    const { balance: sendBalance, loading: sendBalanceLoading } = useFetchedBalanceResult(fetchBalance, sendTokenEntry.address, activeBalanceAccount, refreshToken);
     // The recipient's balance of the token being sent (the Recipient row's line, as in the web Send tab).
-    const recipientSendBalance = useFetchedBalance(fetchBalance, sendTokenEntry.address, selections.sendRecipient?.address, refreshToken);
-    const sellBalance = useFetchedBalance(fetchBalance, sellTokenContract?.address, activeBalanceAccount, refreshToken);
-    const buyBalance = useFetchedBalance(fetchBalance, buyTokenContract?.address, activeBalanceAccount, refreshToken);
-    const fetchedSellBalanceText = fetchedBalanceText(fetchBalance, sellBalance, sellTokenContract?.decimals ?? 18);
-    const fetchedBuyBalanceText = fetchedBalanceText(fetchBalance, buyBalance, buyTokenContract?.decimals ?? 18);
+    const { balance: recipientSendBalance, loading: recipientBalanceLoading } = useFetchedBalanceResult(fetchBalance, sendTokenEntry.address, selections.sendRecipient?.address, refreshToken);
+    const { balance: sellBalance, loading: sellBalanceLoading } = useFetchedBalanceResult(fetchBalance, sellTokenContract?.address, activeBalanceAccount, refreshToken);
+    const { balance: buyBalance, loading: buyBalanceLoading } = useFetchedBalanceResult(fetchBalance, buyTokenContract?.address, activeBalanceAccount, refreshToken);
+    // While a read is unresolved the text is just "Balance: " and the row shows a spinner (2026-10-30), instead of a bare "—".
+    const fetchedSellBalanceText = sellBalanceLoading ? 'Balance: ' : fetchedBalanceText(fetchBalance, sellBalance, sellTokenContract?.decimals ?? 18);
+    const fetchedBuyBalanceText = buyBalanceLoading ? 'Balance: ' : fetchedBalanceText(fetchBalance, buyBalance, buyTokenContract?.decimals ?? 18);
+    // 2026-10-27 (owner report) — on-screen balance text stays plain
+    // "Balance: X"; the richer "${symbol} Balance: X" still shows on hover,
+    // via these separate *Title* variables (TradeAmountRow's own doc comment
+    // has the full reasoning).
+    const fetchedSellBalanceTitle = sellTokenContract?.symbol && fetchedSellBalanceText ? `${sellTokenContract.symbol} ${fetchedSellBalanceText}` : undefined;
+    const fetchedBuyBalanceTitle = buyTokenContract?.symbol && fetchedBuyBalanceText ? `${buyTokenContract.symbol} ${fetchedBuyBalanceText}` : undefined;
     // The Send button's text and readiness are the shared computeSendButton (spcoin-panels), the same rules and the same button the web app's Send tab uses.
     const sendDecimals = sendTokenEntry.decimals ?? 18;
     const sendHasRecipient = Boolean(selections.sendRecipient?.address);
-    const sendBalanceText = fetchedBalanceText(fetchBalance, sendBalance, sendDecimals);
-    const recipientBalanceText = fetchedBalanceText(fetchBalance, recipientSendBalance, sendDecimals);
+    const sendBalanceText = sendBalanceLoading ? 'Balance: ' : fetchedBalanceText(fetchBalance, sendBalance, sendDecimals);
+    const sendBalanceTitle = sendTokenEntry.symbol && sendBalanceText ? `${sendTokenEntry.symbol} ${sendBalanceText}` : undefined;
+    const recipientBalanceText = recipientBalanceLoading ? 'Balance: ' : fetchedBalanceText(fetchBalance, recipientSendBalance, sendDecimals);
+    const recipientBalanceTitle = sendTokenEntry.symbol && recipientBalanceText ? `${sendTokenEntry.symbol} ${recipientBalanceText}` : undefined;
     // 2026-09-30, real bug fix (live report — "balanceOf... not working" /
     // "cannot type input in the Amount field" on the SWAP tab). Root cause:
     // unlike SEND/SPONSOR (real amount state + real onSubmit wired in
@@ -669,22 +856,69 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // any not-yet-a-full-number input — never throws, never blocks typing.
     const [sellAmountText, setSellAmountText] = useState('');
     const [buyAmountText, setBuyAmountText] = useState('');
-    const [, setSellAmountContext] = useSellAmount();
-    const [, setBuyAmountContext] = useBuyAmount();
+    const [sellAmountContext, setSellAmountContext] = useSellAmount();
+    const [buyAmountContextValue, setBuyAmountContext] = useBuyAmount();
     const sellDecimals = sellTokenContract?.decimals ?? 18;
     const buyDecimals = buyTokenContract?.decimals ?? 18;
+    const sellTypingUntilRef = useRef(0);
+    const buyTypingUntilRef = useRef(0);
     const setSellAmount = (text) => {
+        sellTypingUntilRef.current = Date.now() + TYPING_GRACE_MS;
         setSellAmountText(text);
         const parsed = parseDecimalAmount(text, sellDecimals);
         if (parsed !== undefined)
             setSellAmountContext(parsed);
     };
     const setBuyAmount = (text) => {
+        buyTypingUntilRef.current = Date.now() + TYPING_GRACE_MS;
         setBuyAmountText(text);
         const parsed = parseDecimalAmount(text, buyDecimals);
         if (parsed !== undefined)
             setBuyAmountContext(parsed);
     };
+    // 2026-10-27 (owner report, live screenshot — Trace Log showed
+    // sellTokenContract.amount already back at 0 after a Uniswap swap
+    // succeeded, but the "You Exactly Pay" box kept showing the pre-swap
+    // amount) — root cause: both hooks above used to discard the live
+    // context value (`const [, setSellAmountContext] = useSellAmount()`),
+    // so an external reset (UniSelectPanelLayoutContainer's setSwapState,
+    // on swap success) updated the real ExchangeContext but this panel's own
+    // local sellAmountText/buyAmountText strings — the only thing the input
+    // actually renders — had no path back to it; they only ever got written
+    // by the user's own typing (setSellAmount/setBuyAmount above). Same
+    // resync-with-retry pattern as spcoin-panels' SellSelectPanelLayoutContainer.tsx
+    // (that file's own 2026-10-27 fix for the identical bug one layer down):
+    // a grace window protects an in-flight keystroke from being overwritten
+    // by a stale/concurrent context read, and a retryTick forces one more
+    // pass once that window closes instead of silently skipping forever.
+    const [sellRetryTick, setSellRetryTick] = useState(0);
+    const [buyRetryTick, setBuyRetryTick] = useState(0);
+    useEffect(() => {
+        if (isIntermediateDecimal(sellAmountText))
+            return undefined;
+        const remaining = sellTypingUntilRef.current - Date.now();
+        if (remaining > 0) {
+            const timer = setTimeout(() => setSellRetryTick((t) => t + 1), remaining);
+            return () => clearTimeout(timer);
+        }
+        const formatted = clampDisplay(formatUnits(sellAmountContext ?? 0n, sellDecimals), maxInputSz);
+        if (sellAmountText !== formatted)
+            setSellAmountText(formatted);
+        return undefined;
+    }, [sellAmountContext, sellDecimals, sellAmountText, sellRetryTick]);
+    useEffect(() => {
+        if (isIntermediateDecimal(buyAmountText))
+            return undefined;
+        const remaining = buyTypingUntilRef.current - Date.now();
+        if (remaining > 0) {
+            const timer = setTimeout(() => setBuyRetryTick((t) => t + 1), remaining);
+            return () => clearTimeout(timer);
+        }
+        const formatted = clampDisplay(formatUnits(buyAmountContextValue ?? 0n, buyDecimals), maxInputSz);
+        if (buyAmountText !== formatted)
+            setBuyAmountText(formatted);
+        return undefined;
+    }, [buyAmountContextValue, buyDecimals, buyAmountText, buyRetryTick]);
     // Real balance TEXT is a caller-supplied prop (sellBalanceText/
     // buyBalanceText on MeritWalletProps), NOT fetched here directly.
     // @sponsorcoin/spcoin-exchange-engine's useGetBalance internally calls
@@ -706,16 +940,55 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // read-only), not a list to pick from, and can be reached from a
     // different trigger (the avatar icon, not the row/chevron). Null when
     // closed; a real address string while showing that account's details.
-    const [accountDetailAddress, setAccountDetailAddress] = useState(null);
-    const accountDetailVisible = usePanelVisible(SP_COIN_DISPLAY.ACCOUNT_PANEL);
+    // 2026-11-11 (owner): the account whose details show is the SELECTED account of ExchangeContext (persisted, cleared when the account is removed or the details are left), no longer a local state that was forgotten whenever the details panel hid.
+    const [selectedAccount, setSelectedAccount] = useSelectedAccount();
+    const accountDetailAddress = selectedAccount?.address ? String(selectedAccount.address) : null;
+    const latestSelectedRef = useRef(null);
+    const setAccountDetailAddress = (address) => {
+        latestSelectedRef.current = address ? address.toLowerCase() : null;
+        if (!address) {
+            setSelectedAccount(undefined);
+            return;
+        }
+        setSelectedAccount(buildSpCoinAccount({ address }));
+        // the full record (name, symbol, logo) a moment later, unless another account was selected meanwhile
+        void hydrateAccountFromAddress(address, { fallbackStatus: STATUS.INFO }).then((hydrated) => {
+            if (latestSelectedRef.current === address.toLowerCase())
+                setSelectedAccount(hydrated);
+        }).catch(() => undefined);
+    };
+    // 2026-11-08 (owner): the group of the row the details were opened from (the same address can be in two groups), and what the wallet said about it (the screen's title)
+    const [accountDetailGroup, setAccountDetailGroup] = useState(null);
+    const [accountDetailTitle, setAccountDetailTitle] = useState(null);
+    const accountDetailVisible = usePanelVisible(SP_COIN_DISPLAY.ACCOUNT_PANEL) && assetRadioOpen;
+    // The role detail panels (an agent, a sponsor, a recipient) show the same account detail screen for the account the exchange context holds in that role.
+    const agentPanelVisible = usePanelVisible(SP_COIN_DISPLAY.AGENT_PANEL) && assetRadioOpen;
+    const sponsorPanelVisible = usePanelVisible(SP_COIN_DISPLAY.SPONSOR_PANEL) && assetRadioOpen;
+    const recipientPanelVisible = usePanelVisible(SP_COIN_DISPLAY.RECIPIENT_PANEL) && assetRadioOpen;
+    const { exchangeContext: roleContext } = useExchangeContext();
+    const [activeAccountForDetail] = useActiveAccount();
     // Same idea, for the token-list's own info icon (Select a Token).
-    const [tokenDetailAddress, setTokenDetailAddress] = useState(null);
-    const tokenDetailVisible = usePanelVisible(SP_COIN_DISPLAY.TOKEN_PANEL);
+    // 2026-10-26 (owner decision, after a live report: right-clicking a token
+    // row opened TOKEN_PANEL -- the title bar updated, correctly pushed onto
+    // the displayStack -- but the content area stayed blank) --
+    // tokenDetailAddress/setTokenDetailAddress removed: nothing has set it to
+    // a real address since 2026-10-20 (openTokenDetail, the only caller that
+    // ever did, was removed in favor of the shared package's generic row
+    // click, TokenListItem.tsx's openPreview(), which sets previewToken
+    // instead). Rather than resurrect a second, parallel "what token is
+    // open" field -- the exact class of bug (two sources of truth drifting
+    // apart) chased everywhere else in the panel tree this session -- this
+    // now reads the one real source directly: the same previewToken
+    // TokenPanel.tsx (the package's own, separately-mounted copy) already
+    // correctly uses.
+    const [previewToken, setPreviewTokenContract] = usePreviewTokenContract();
+    const tokenDetailVisible = usePanelVisible(SP_COIN_DISPLAY.TOKEN_PANEL) && assetRadioOpen;
+    const previewTokenAddress = previewToken?.address ?? null;
     // Same idea, for the network-list's own icon (Select Network) — see
     // onNetworkIconClick's own doc comment for why this one needs no
     // separate "detail" data prop from the caller.
-    const [networkDetailId, setNetworkDetailId] = useState(null);
-    const networkDetailVisible = usePanelVisible(SP_COIN_DISPLAY.NETWORK_PANEL);
+    const [, setNetworkDetailId] = useState(null);
+    const networkDetailVisible = usePanelVisible(SP_COIN_DISPLAY.NETWORK_PANEL) && assetRadioOpen;
     // 2026-09-21, Path A — ACCOUNT_PANEL/TOKEN_PANEL/NETWORK_PANEL are ALL
     // `MAIN_RADIO_OVERLAY_PANELS` members too (verified the same way as
     // the tab/list-overlay pieces — read `panelGroups.ts` directly), so
@@ -724,14 +997,26 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // interaction as the list-overlay slice already found and fixed for.
     // These addresses/ids identify the selected detail record. The panel
     // tree flags below own whether their detail screens are visible.
-    const openAccountDetail = (address) => {
+    const openAccountDetail = (address, groupId) => {
         setAccountDetailAddress(address);
+        setAccountDetailGroup(groupId ?? null);
         openPanel(SP_COIN_DISPLAY.ACCOUNT_PANEL, 'MeritWallet:openAccountDetail');
     };
-    const openTokenDetail = (address) => {
-        setTokenDetailAddress(address);
-        openPanel(SP_COIN_DISPLAY.TOKEN_PANEL, 'MeritWallet:openTokenDetail');
-    };
+    // 2026-10-23 — openTokenDetail (the token-row equivalent of
+    // openAccountDetail/openNetworkDetail below) removed: its only caller was
+    // Merit's own "Select a Token" list rendering, replaced by the shared
+    // package's generic PanelListSelectWrapper (docs/meritFixes.txt §11),
+    // which sets previewToken (usePreviewTokenContract) instead of calling
+    // anything here. TOKEN_PANEL/tokenDetailVisible stay; the
+    // tokenDetailAddress local state this comment used to also point to, and
+    // the self-fetch hydration chain (selfTokenDetail/effectiveTokenDetail)
+    // that fed the old flat TokenDetailPanel overlay, were removed 2026-10-26
+    // alongside tokenDetailOverlay's own switch to TokenPanel.tsx (see that
+    // variable's own doc comment) — TokenPanel hydrates itself.
+    // 2026-11-11 (owner): the account dropdowns anywhere in the wallet (a right click on an avatar) open ACCOUNT_PANEL for their account through this, without making it the active one
+    const openAccountDetailRef = useRef(openAccountDetail);
+    openAccountDetailRef.current = openAccountDetail;
+    React.useEffect(() => registerAccountDetailOpener((address) => openAccountDetailRef.current(address)), []);
     const openNetworkDetail = (id) => {
         setNetworkDetailId(id);
         openPanel(SP_COIN_DISPLAY.NETWORK_PANEL, 'MeritWallet:openNetworkDetail');
@@ -743,24 +1028,82 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     const configResetPassword = sessionHandlers.onResetPassword;
     const configDeleteAccount = sessionHandlers.onDeleteAccount;
     const configDeleteWallet = sessionHandlers.onDeleteWallet;
-    // List visibility and its destination stay on the display stack across a
-    // tab switch. Detail visibility is tree-owned; these ids only retain which
-    // record was selected and can be cleared when leaving the detail screen.
     const handleTabClick = (tab) => {
-        // Owner rule (docs 8.5.10): selecting the tab you are on changes nothing (what is open over it stays); selecting another tab goes through validateTab (openPanel routes tabs there), and what was open over the tab you leave stays on the stack, to come back with it.
-        if (tab === activeTab)
-            return;
+        // Owner rule (2026-10-26): a tab click is ONLY the plain displayStack
+        // push/pop rule, unconditionally, every time -- "if tab selected and is
+        // on the displayStack, pop until it is on top; otherwise push it on
+        // top." No "selecting the tab you're already on does nothing"
+        // exception anymore (owner report: clicking Swap from "Select Network",
+        // with Swap already the derived activeTab, did nothing -- the old
+        // willNoOp check treated that as a no-op click, but the real rule is
+        // unconditional: Swap IS on the stack, so it must pop up to it, same as
+        // any other click). This also removes the onGlobalOverlay special case
+        // (MERIT_INFO_PANEL/PANEL_TREE_PANEL) that existed only to patch one
+        // hole in willNoOp -- with no no-op branch left, there is nothing left
+        // for it to patch.
+        //
+        // This used to also remember and restore whatever list/detail was open
+        // over each tab (docs 8.5.10, 2026-10-16, via listByTabRef/
+        // detailByTabRef) -- removed after three straight bugs traced back to
+        // behavior layered on TOP of the plain pop/push rule, never the rule
+        // itself (confirmed correct by hand-trace every time): the old "tab
+        // section" stack design, then closeActiveListPanel's own stale
+        // restore, then that remember-and-reopen feature itself re-pushing a
+        // list moments after validateTab had already popped it off correctly.
+        panelTreeTrace('MeritWallet:handleTabClick', {
+            tab,
+            activeTab,
+            activeMainOverlay: activeMainOverlay != null ? SP_COIN_DISPLAY[activeMainOverlay] : null,
+        });
         openPanel(TAB_PANEL_IDS[tab], 'MeritWallet:handleTabClick');
-        // The wallet's own private list overlays are not stack members (they are not radio panels): leaving the tab closes them, or the list would stay on screen over the tab just chosen. Shared lists (listPanelIdOverrides) stay on the stack as the rule above says.
-        if (!listPanelIdOverrides)
-            setActiveList(null);
-        // Lists are stack members and stay available when returning to this tab;
-        // selected detail records are data only and are cleared on tab changes.
-        setAddressInput('');
-        setAccountDetailAddress(null);
-        setTokenDetailAddress(null);
-        setNetworkDetailId(null);
+        // 2026-11-01 (owner rule: "closing a radio panel, or any other panel, closes just that panel, nothing else") -- a tab switch only
+        // closes the panels the plain pop/push rule above closes (ASSET_SELECT_LIST_PANEL goes off the stack). The list's own ACTIVE_LIST_PANEL,
+        // its open mode (NETWORK_LIST, ...) and the selection slot are left exactly as they were, so going back shows the list as it was left.
+        // This used to call closeActiveListPanel(..., { keepContainer: true }) here, which wiped them.
     };
+    // The selected detail record is data tied to its panel: it goes when the panel closes, not when the tab changes.
+    // 2026-11-11 (owner report: Remove opened its confirmation in MESSAGE_PANEL, backing out showed the ACTIVE account's details instead of the account that was open): the confirmation hides the details panel while it is up, and this used to forget
+    // which account was open at that moment. While the message is up the record is kept; it goes only when neither the details nor a message are showing, and a beat later, so that going back (the message closes and the details open in the same breath)
+    // finds it still there.
+    const accountDetailVisibleRef = useRef(accountDetailVisible);
+    accountDetailVisibleRef.current = accountDetailVisible;
+    useEffect(() => {
+        if (accountDetailVisible || messageVisible)
+            return undefined;
+        const timer = setTimeout(() => {
+            if (accountDetailVisibleRef.current)
+                return;
+            setAccountDetailGroup(null);
+            setAccountDetailTitle(null);
+        }, 60);
+        return () => clearTimeout(timer);
+    }, [accountDetailVisible, messageVisible]);
+    // 2026-10-26 (owner report, trace-confirmed: right-clicking a token row
+    // still showed a blank body even after tokenDetailOverlay was switched to
+    // read previewToken) -- a plain `!tokenDetailVisible` check (this
+    // effect's own first version) fires on the VERY FIRST render after
+    // openPreview() sets previewToken, before TOKEN_PANEL's own visibility
+    // write has landed (that's a SEPARATE, later-scheduled write --
+    // schedule(), panelTreeDebug.ts, never batches). At that instant
+    // tokenDetailVisible still reads false, so this effect saw "not open,
+    // but there's a preview token -- must be stale" and cleared it
+    // immediately, before tokenDetailVisible ever got the chance to become
+    // true. By the time it did, previewToken was already gone again -- the
+    // two conditions tokenDetailOverlay needs were never true at the same
+    // moment. Same fix TokenPanel.tsx's own version of this effect already
+    // uses: a wasVisible ref, so this only clears on a genuine
+    // was-open-now-closed transition, never on "hasn't opened yet."
+    const tokenDetailWasVisibleRef = useRef(false);
+    useEffect(() => {
+        const wasVisible = tokenDetailWasVisibleRef.current;
+        tokenDetailWasVisibleRef.current = tokenDetailVisible;
+        if (!wasVisible || tokenDetailVisible)
+            return;
+        if (previewToken)
+            setPreviewTokenContract(undefined);
+    }, [tokenDetailVisible, previewToken, setPreviewTokenContract]);
+    useEffect(() => { if (!networkDetailVisible)
+        setNetworkDetailId(null); }, [networkDetailVisible]);
     // 2026-09-21, Path A — initialActiveTab/onActiveTabChange used to be a
     // plain "seed local state, notify on every setActiveTab" pair; now that
     // activeTab is derived from the real engine, this becomes "seed the
@@ -868,87 +1211,155 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // (an overlay that fully owns the panel body while open, not a layered
     // popover). onSelect closes it the same way a real row pick would.
     const closeListOverlay = () => setActiveList(null);
-    // 2026-09-16 — the actual "commit this pick" step (see PickableSlot's
-    // own doc comment above for the full report/reasoning). Reads
-    // activeListMode BEFORE closing the overlay — closeListOverlay only
-    // schedules the state update, it doesn't mutate this render's own
-    // `activeListMode` binding, so capturing it first (implicitly, by
-    // reading it in this same synchronous call) is safe and correct.
-    const commitSelection = (pickedRow) => {
-        const row = { ...pickedRow, address: toChecksumAddress(pickedRow.address) };
-        const slot = activeListMode;
-        closeListOverlay();
-        if (!slot)
-            return;
-        // 2026-09-30 — sell/buy picks now write the real shared ExchangeContext
-        // (see sellTokenContract's own doc comment near usePanelTree() above)
-        // instead of this component's own local `selections` state, so every
-        // other consumer of the same context (the web app's own main Swap tab,
-        // the real balance fetch, future Uniswap/0x quote wiring) sees the pick
-        // immediately. Every other slot (send/sponsor tokens+recipients) stays
-        // on local `selections` — genuinely Merit-Wallet-only picks with no
-        // real ExchangeContext counterpart today. balance defaults to 0n here,
-        // same as liteProvider.tsx's own makeMinimalAccountFallback — real
-        // balance display is the caller-supplied sellBalanceText/buyBalanceText
-        // prop, not this field.
-        if (slot === 'sellToken' || slot === 'buyToken') {
-            const contract = row.address
-                ? {
-                    address: row.address,
-                    symbol: row.symbol,
-                    name: row.name,
-                    decimals: row.decimals,
-                    logoURL: row.iconSrc,
-                    balance: BigInt(0),
-                }
-                : undefined;
-            if (slot === 'sellToken')
-                setSellTokenContract(contract);
-            else
-                setBuyTokenContract(contract);
+    // the remote's account picker opens the account list by itself and closes it when the request is over
+    const remoteSelectionOpen = !!remoteSelection;
+    // 2026-11-06 (owner design): the selector is host state, not a panel on the stack, so it closes itself through openPanel's pre-open action: opening a tab panel ends it, like Back does (the add flow it opens from its own list does not)
+    const remoteCancel = remoteSelection?.onCancel;
+    useEffect(() => {
+        if (!remoteCancel)
             return;
+        return registerPreOpenAction((panel) => {
+            engineTrace('remoteSelection:preOpen', { panel: SP_COIN_DISPLAY[panel], closesSelector: !!TAB_KEY_BY_PANEL_ID[panel] });
+            if (TAB_KEY_BY_PANEL_ID[panel])
+                remoteCancel();
+        });
+    }, [remoteCancel]);
+    useEffect(() => {
+        // 2026-10-31 (owner report: the Connect request left the wallet on "Select Software Wallet" and no connect page opened): the selector is pushed ON TOP of whatever screen is open (remoteOverlay below wins the body); nothing is closed, so the screens underneath come back when it ends
+        if (remoteSelectionOpen)
+            setActiveList('account');
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [remoteSelectionOpen]);
+    // 2026-10-23 — commitSelection (the "commit this pick" step PickableSlot's
+    // own doc comment above describes) removed: its only callers were
+    // buildAddressBar's own typed-address-entry preview rows, already removed
+    // alongside it (docs/meritFixes.txt §15-16) — paramsForMode below already
+    // inlines the equivalent commit logic per mode, keyed on `mode` itself
+    // rather than this function's activeListMode-read (see that function's
+    // own doc comment for why that distinction mattered, a real stale-closure
+    // bug once).
+    // 2026-10-23, owner investigation (docs/meritFixes.txt §11-12) — what
+    // setActiveList hands to openActiveListPanel for each mode. sellToken/
+    // buyToken/sendToken went first (see the stale-closure bug writeup this
+    // function's own history carried, now folded in below): onCommit is
+    // built HERE, in the same render as the click that opens the list, and
+    // a pick fires much later against whichever closure was captured at
+    // that moment — so it must not read anything that only becomes correct
+    // after a re-render (activeListMode, read via the external
+    // activeListPanelStore, is exactly that kind of value; `mode`, this
+    // function's own parameter, is not — it's fixed for the whole call).
+    // That's why every branch below reads `mode` directly instead of
+    // routing through commitSelection's activeListMode inference.
+    // account/network return null: they're host-rendered
+    // (renderAccountManagement/renderNetworkList below, via
+    // AssetSelectListPanel's own host-callback props) and read no feed
+    // params at all — the params object exists only for modes that render
+    // through the package's generic PanelListSelectWrapper.
+    const paramsForMode = (mode) => {
+        if (mode === 'sellToken' || mode === 'buyToken' || mode === 'sendToken') {
+            return {
+                feedType: FEED_TYPE.REMOTE_TOKEN_LIST,
+                onCommit: (asset) => {
+                    const token = asset;
+                    const address = toChecksumAddress(token.address);
+                    if (mode === 'sellToken' || mode === 'buyToken') {
+                        const contract = address
+                            ? {
+                                address: address,
+                                symbol: token.symbol,
+                                name: token.name,
+                                decimals: token.decimals,
+                                logoURL: token.logoURL,
+                                balance: BigInt(0),
+                            }
+                            : undefined;
+                        if (mode === 'sellToken')
+                            setSellTokenContract(contract);
+                        else
+                            setBuyTokenContract(contract);
+                    }
+                    else {
+                        setSelections((prev) => ({
+                            ...prev,
+                            [mode]: {
+                                symbol: token.symbol,
+                                name: token.name,
+                                address,
+                                iconSrc: token.logoURL,
+                                decimals: token.decimals,
+                            },
+                        }));
+                    }
+                    closeListOverlay();
+                },
+                selectOnLogoClick: true,
+                // the field's own token: the picker's address box opens pre-filled with it (2026-10-30, on request)
+                currentTokenAddress: mode === 'sellToken' ? sellTokenContract?.address : mode === 'buyToken' ? buyTokenContract?.address : sendTokenEntry.address, // the Send field shows the native token until one is picked, so that is its token
+                ownerId: mode === 'sellToken' ? 'sell' : mode === 'buyToken' ? 'buy' : 'send',
+            };
         }
-        setSelections((prev) => ({
-            ...prev,
-            [slot]: {
-                symbol: row.symbol,
-                name: row.name,
-                address: row.address,
-                iconSrc: row.iconSrc,
-                decimals: row.decimals,
-            },
-        }));
+        if (mode === 'sendRecipient') {
+            return {
+                // sendRecipient's own real id (REMOTE_ACCOUNT_SEND_LIST) has a matching FEED_TYPE member exactly.
+                feedType: FEED_TYPE.REMOTE_ACCOUNT_SEND_LIST,
+                onCommit: (asset) => {
+                    const account = asset;
+                    const address = toChecksumAddress(account.address);
+                    setSelections((prev) => ({
+                        ...prev,
+                        sendRecipient: { symbol: account.symbol, name: account.name, address, iconSrc: account.logoURL },
+                    }));
+                    closeListOverlay();
+                },
+                // 2026-10-27 (owner report) — missing here, unlike the sellToken/
+                // buyToken/sendToken block above: clicking a row's own logo/icon
+                // fell through to the list's default row-click (open the account's
+                // TOKEN_PANEL preview, "Select Preview Image") instead of committing
+                // the recipient and returning to the Send tab. Same affordance as
+                // every other picker in this function.
+                selectOnLogoClick: true,
+                currentTokenAddress: selections.sendRecipient?.address,
+                ownerId: 'sendRecipient',
+            };
+        }
+        // account | network
+        return null;
     };
-    const iconFromSrc = (src) => src
-        ? React.createElement('img', {
-            src,
-            alt: '',
-            style: { width: '100%', height: '100%', objectFit: 'contain' },
-        })
-        : undefined;
     // 2026-09-29 — StakingControllerPanel's own opaque-slot inputs
     // (configCog/recipientContent) removed along with its render below
     // (see that render site's own doc comment for why: pure duplicate
     // content, disabled until Phase B.2 gives it something unique to show).
     // Restore both from git history alongside the render if re-enabling.
+    const sellGate = amountGate({ side: 'sell', hasToken: !!sellTokenContract?.address });
+    const buyGate = amountGate({ side: 'buy', hasToken: !!buyTokenContract?.address });
     const tabBody = activeTab === 'SWAP'
         ? React.createElement(TradingStationPanel, {
             onSellTokenClick: () => setActiveList('sellToken'),
             onBuyTokenClick: () => setActiveList('buyToken'),
             sellSymbol: sellTokenContract?.symbol,
             sellAddress: sellTokenContract?.address,
-            sellIcon: iconFromSrc(sellTokenContract?.logoURL),
+            // 2026-10-22 (owner report): iconFromSrc returned undefined with no token picked, leaving the pill's icon slot empty — TokenLogo renders unconditionally and falls back to STATIC_ASSET_ICON_URL on its own, matching the Uniswap row's own pill (UniSelectPanelWithSwap, fed by BuySelectPanelLayoutContainer's identical fix).
+            sellIcon: React.createElement(TokenLogo, { tokenContract: sellTokenContract, style: fitImageStyle }),
             buySymbol: buyTokenContract?.symbol,
             buyAddress: buyTokenContract?.address,
-            buyIcon: iconFromSrc(buyTokenContract?.logoURL),
+            buyIcon: React.createElement(TokenLogo, { tokenContract: buyTokenContract, style: fitImageStyle }),
             // 2026-09-30 — real amount input + real balance reads, see their
             // own doc comment above (near sellAmountText's declaration).
             sellAmount: sellAmountText,
             onSellAmountChange: setSellAmount,
+            // 2026-11-13 (owner): no token in the row, no input; the hover says which token (amountGate, the one rule every amount row uses)
+            sellAmountDisabled: sellGate.disabled,
+            sellAmountTitle: sellGate.title,
             sellBalanceText: sellBalanceText ?? fetchedSellBalanceText,
+            sellBalanceTitle: fetchedSellBalanceTitle,
+            sellBalanceLoading,
             buyAmount: buyAmountText,
             onBuyAmountChange: setBuyAmount,
+            buyAmountDisabled: buyGate.disabled,
+            buyAmountTitle: buyGate.title,
             buyBalanceText: buyBalanceText ?? fetchedBuyBalanceText,
+            buyBalanceTitle: fetchedBuyBalanceTitle,
+            buyBalanceLoading,
             // 2026-10-05 — the live, trade-direction-dependent buy
             // label ("You Receive ± 2.00%") and the slippage cog
             // toggle, see buyLabel/handleSlippageCog's own doc
@@ -964,7 +1375,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
             buyVisible: zeroXVisible,
             arrowVisible: swapArrowVisible,
             // ConfigSlippagePanel is already fully self-gating (checks its
-            // own usePanelVisible(CONFIG_SLIPPAGE_PANEL) internally, renders
+            // own usePanelVisible(ZERO_X_CONFIG_SLIPPAGE_PANEL) internally, renders
             // null when hidden) — no extra visibility check needed here.
             buyPrefixContent: React.createElement(ConfigSlippagePanel, {
                 bps: slippage.bps,
@@ -984,11 +1395,9 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
             // not a regression. (The old CONNECT_TRADE_BUTTON
             // connection-button slot was removed 2026-10-05
             // together with its panel-tree node.)
-            zeroXTradeButtonContent: zeroXTradeButtonContent ?? (swapHost ? React.createElement(SwapTradeButton, { host: swapHost }) : undefined),
-            buySuffixContent: uniSelectContent ??
-                (swapHost
-                    ? React.createElement(ConnectedUniSelectPanel, { host: swapHost, onBuyTokenClick: () => setActiveList('buyToken'), balanceText: buyBalanceText ?? fetchedBuyBalanceText })
-                    : undefined),
+            // The trade button and the Uniswap section are the shared engine-path screens, the same in every app (docs/design/spcoinPackagesDesign.txt 8.5.12).
+            zeroXTradeButtonContent: React.createElement(ConnectedTradeButton, { host: tradeHost }),
+            buySuffixContent: React.createElement(UniSelectPanelWithSwap),
         })
         : activeTab === 'SEND'
             ? React.createElement(SendTabPanel, {
@@ -996,10 +1405,18 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                 onRecipientClick: () => setActiveList('sendRecipient'),
                 sendTokenSymbol: sendTokenEntry.symbol,
                 sendTokenAddress: sendTokenEntry.address,
-                sendTokenIcon: iconFromSrc(sendTokenEntry.iconSrc),
+                // 2026-11-13 (owner): like the Swap pills, TokenLogo always renders; it looks the logo up by the token and falls back to the missing-token image when there is no token or no logo (no blank square after the token is cleared)
+                sendTokenIcon: React.createElement(TokenLogo, { tokenContract: sendTokenEntry.address ? { address: sendTokenEntry.address, symbol: sendTokenEntry.symbol, name: sendTokenEntry.name, decimals: sendTokenEntry.decimals, logoURL: sendTokenEntry.iconSrc, chainId, balance: BigInt(0) } : undefined, style: fitImageStyle }),
                 recipientSymbol: selections.sendRecipient?.symbol,
                 recipientAddress: selections.sendRecipient?.address,
-                recipientIcon: iconFromSrc(selections.sendRecipient?.iconSrc),
+                // 2026-10-22 (owner report): iconFromSrc returned undefined with no recipient picked, leaving the pill's icon slot empty — AccountAvatar renders unconditionally and falls back to ANONYMOUS_ACCOUNT_AVATAR_URL on its own, matching every other account-style pill.
+                recipientIcon: React.createElement(AccountAvatar, {
+                    logoURL: selections.sendRecipient?.iconSrc,
+                    symbol: selections.sendRecipient?.symbol,
+                    name: selections.sendRecipient?.name,
+                    address: selections.sendRecipient?.address,
+                    style: fitImageStyle,
+                }),
                 // 2026-09-22, Phase B.2 Stage 4 follow-up — real amount input +
                 // submit wiring (see MeritWalletProps.onSendSubmit's own doc
                 // comment for why tokenAddress/decimals aren't fully resolved
@@ -1013,7 +1430,11 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                 sendSymbol: sendTokenEntry.symbol ?? '',
                 submitBusy: sendBusy,
                 balanceText: sendBalanceText,
+                balanceTitle: sendBalanceTitle,
                 recipientBalanceText,
+                recipientBalanceTitle,
+                balanceLoading: sendBalanceLoading,
+                recipientBalanceLoading,
                 // 2026-09-23, Stage 39 — resolve the real sendToken address +
                 // decimals picked via the token list picker (see PickedEntry's
                 // own decimals doc comment) and pass them, plus the amount, to
@@ -1026,37 +1447,12 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                 // `tsc`/`vite` verified in 2026-09-22 (no browser-automation
                 // available), not live-driven. Native send omits tokenAddress;
                 // an ERC20 send passes both.
-                onSubmit: onSendSubmit
-                    ? () => {
-                        const params = {
-                            recipientAddress: selections.sendRecipient?.address,
-                            tokenAddress: sendTokenEntry.address,
-                            decimals: sendTokenEntry.decimals,
-                            tokenSymbol: sendTokenEntry.symbol,
-                            amount: sendAmount ?? '',
-                        };
-                        void Promise.resolve(onSendSubmit(params)).then((result) => {
-                            if (!result)
-                                return;
-                            showReceipt(buildSendReceipt({
-                                result,
-                                amount: params.amount,
-                                tokenSymbol: params.tokenSymbol ?? '',
-                                tokenAddress: isNativePlaceholder(params.tokenAddress) ? undefined : params.tokenAddress,
-                                from: activeProfileRef.current,
-                                to: { address: selections.sendRecipient?.address, name: selections.sendRecipient?.name, symbol: selections.sendRecipient?.symbol, logoURL: selections.sendRecipient?.iconSrc },
-                            }), 'MeritWallet:send');
-                            // A confirmed send clears the amount; a failed one leaves everything as it was.
-                            if (result.ok)
-                                onSendAmountChange?.('');
-                        });
-                    }
-                    : undefined,
+                onSubmit: onSendSubmit ? startSend : undefined,
             })
             : activeTab === 'SPONSOR'
-                ? (sponsorPanel ?? null)
+                ? React.createElement(ConnectedSponsorPanel, { host: tradeHost })
                 : activeTab === 'REWARDS' && rewardsHost
-                    ? React.createElement(ConnectedRewardsPanel, { host: rewardsHost })
+                    ? React.createElement(ConnectedRewardsPanel, { host: rewardsHost, extras: rewardsExtras })
                     : activeTab === 'REWARDS'
                         ? React.createElement(ManageSponsorshipsPanel, {
                             // 2026-09-24, SPONSOR_STAKING_LIST EXT wiring (minimal bar) —
@@ -1066,7 +1462,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                             // SponsorStakingListPanel itself self-gates on that same id
                             // (see its own `panelId` default) and is mounted unconditionally
                             // below, so no separate usePanelVisible check is needed here.
-                            onUnstake: () => openPanel(SP_COIN_DISPLAY.SPONSOR_STAKING_LIST, 'MeritWallet:unstakeAllSponsorships'),
+                            onUnstake: () => { setStakingListMode({ kind: 'unstake' }); openPanel(SP_COIN_DISPLAY.SPONSOR_STAKING_LIST, 'MeritWallet:unstakeAllSponsorships'); },
                         })
                         : React.createElement(WalletConfigPanel, {
                             onOpenPanelTree: () => openPanel(SP_COIN_DISPLAY.PANEL_TREE_PANEL, 'MeritWallet:openPanelTree'),
@@ -1078,7 +1474,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                             // useMeritWalletConfig() — this component only renders it).
                             passwordMode: configPasswordMode,
                             onPasswordModeChange: onConfigPasswordModeChange,
-                            persistedTimeoutContent: configPersistedTimeoutContent,
+                            persistedTimeoutContent: configPersistedTimeoutHours !== undefined && onConfigPersistedTimeoutHoursChange ? React.createElement(PersistedTimeoutPicker, { hours: configPersistedTimeoutHours, onChange: onConfigPersistedTimeoutHoursChange }) : undefined,
                             passwordDescription: configPasswordDescription,
                             mandatorySecurity: configMandatorySecurity,
                             onMandatorySecurityChange: onConfigMandatorySecurityChange,
@@ -1094,7 +1490,8 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                             onShowBackgroundPageChange: onConfigShowBackgroundPageChange,
                             modalMode: configModalMode,
                             onModalModeChange: onConfigModalModeChange,
-                            securityPanelContent: configSecurityPanelContent,
+                            // 2026-11-13 (owner): the second-step rows (authenticator app / passkey) sit under the wallet's own security rows, from the host's securitySetup
+                            securityPanelContent: securitySetup ? (parts) => React.createElement(React.Fragment, null, React.createElement(SecuritySetupScreen, { ...securitySetup, passwordContent: parts.passwordSettings, accountButtons: parts.accountButtons }), configSecurityPanelContent) : configSecurityPanelContent,
                             signingPanelContent: configSigningPanelContent,
                             backupPanelContent: configBackupPanelContent,
                             testAccountsContent: configTestAccounts ? React.createElement(TestAccountsSection, { api: configTestAccounts.api, authenticationType: configTestAccounts.authenticationType, onChanged: configTestAccounts.onChanged }) : undefined,
@@ -1103,6 +1500,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                             zeroXEngineVisible: configZeroXEngineVisible,
                             on0xEngineChange: onConfig0xEngineChange,
                             resetPanelsContent: configResetPanelsContent,
+                            devToolsContent: React.createElement(React.Fragment, null, configDevToolsContent, React.createElement(DebugConfigSection)),
                             extensionChannel: configExtensionChannel,
                             onExtensionChannelChange: onConfigExtensionChannelChange,
                             extensionDownloadPath: configExtensionDownloadPath,
@@ -1133,7 +1531,7 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
                     ? React.createElement('img', {
                         src: account.iconSrc,
                         alt: '',
-                        style: { width: '100%', height: '100%', objectFit: 'contain' },
+                        style: fitImageStyle,
                     })
                     : undefined),
         })),
@@ -1151,6 +1549,8 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // isActive flag the list overlays already use, just read once more here
     // rather than duplicated as separate props.
     const activeNetworkRow = networkRowsSource.find((row) => row.isActive);
+    // the pill's "$symbol | $name" is the chain's own meta (assets/blockchains/<id>/info.json); the row's symbol and name stand in until it is read
+    const activeChainInfo = useChainInfo(activeNetworkRow?.id, walletAssetBaseUrl ?? '');
     const flatAccountRows = effectiveAccountGroups.flatMap((group) => group.accounts);
     // 2026-10-13 (owner request): the wallet pill names the wallet whose group is ACTIVE in the list below it (the web's list keys its groups 'hardhat' = the dev keystore, 'metamask'), whenever the host has no
     // active account address to derive it from.
@@ -1158,35 +1558,37 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     const pillWalletId = nativeWalletId ?? activeWalletId ?? (activeGroupId === 'hardhat' ? 'serverKeystore' : activeGroupId === 'metamask' ? 'injected:io.metamask' : activeGroupId);
     // 2026-10-13 (owner report): the header's account pill read "Select Account" while a MetaMask account was active, because only the listed (keystore) rows were searched. The host's own active account fills in.
     const hostActiveAddress = String(activeAccountAddress ?? '').trim();
+    // The header's avatar, name and symbol fill from the listed row for that address when the host passes none (the list already resolved its avatar), so the header never shows the anonymous placeholder for an account the list shows.
+    const listedActiveRow = hostActiveAddress ? flatAccountRows.find((account) => String(account.address ?? '').toLowerCase() === hostActiveAddress.toLowerCase()) : undefined;
     const hostActiveEntry = hostActiveAddress
         ? {
             id: hostActiveAddress,
             address: hostActiveAddress,
-            name: activeAccountName || undefined,
-            symbol: activeAccountSymbol || undefined,
-            iconSrc: activeAccountLogoURL || undefined,
-            icon: activeAccountLogoURL ? React.createElement('img', { src: activeAccountLogoURL, alt: '', style: { width: '100%', height: '100%', objectFit: 'contain' } }) : undefined,
+            name: activeAccountName || listedActiveRow?.name || undefined,
+            symbol: activeAccountSymbol || listedActiveRow?.symbol || undefined,
+            iconSrc: activeAccountLogoURL || listedActiveRow?.iconSrc || undefined,
+            icon: activeAccountLogoURL ? React.createElement('img', { src: activeAccountLogoURL, alt: '', style: fitImageStyle }) : listedActiveRow?.icon,
             isActive: true,
         }
         : undefined;
-    const activeAccountEntry = flatAccountRows.find((account) => account.isActive) ?? hostActiveEntry;
+    // The listed active row may know less than the host does (a per-wallet list has an address, not a profile): for the same address the host's active-account profile (name, symbol, avatar) fills what the row lacks, so the header never shows the anonymous placeholder.
+    const listedActive = flatAccountRows.find((account) => account.isActive);
+    const activeAccountEntry = listedActive && hostActiveEntry && String(listedActive.address ?? '').toLowerCase() === hostActiveAddress.toLowerCase()
+        ? { ...listedActive, name: activeAccountName || listedActive.name, symbol: activeAccountSymbol || listedActive.symbol, iconSrc: activeAccountLogoURL || listedActive.iconSrc, icon: listedActive.icon ?? hostActiveEntry.icon }
+        : listedActive ?? hostActiveEntry;
     activeProfileRef.current = activeAccountEntry ? { address: activeAccountEntry.address, name: activeAccountEntry.name, symbol: activeAccountEntry.symbol, logoURL: activeAccountEntry.iconSrc } : undefined;
-    // While the first self-fetch is still running (and no rows were passed in), the picker lists nothing and says it is loading, instead of showing the three placeholder rows and then
-    // swapping in the real list (and its logos) the next time it is opened. The placeholders only appear after a fetch that failed.
-    const tokenRowsLoading = tokenRows === undefined && resolvedTokenRows === undefined && !tokenFetchSettled;
-    const effectiveTokenRows = resolvedTokenRows ?? (tokenRowsLoading ? [] : SAMPLE_TOKEN_ROWS);
-    // 2026-09-24, ASSET_LIST_SELECT_PANEL real container (on request, after
+    // 2026-09-24, ASSET_SELECT_LIST_PANEL real container (on request, after
     // discussion) — this whole block used to jump straight from
     // `activeListMode` to AssetListTable/AccountListRewardsPanel/
     // NetworkListTable with no intermediate container representing the real,
-    // distinct ASSET_LIST_SELECT_PANEL (38) panel id that sits between
+    // distinct ASSET_SELECT_LIST_PANEL (38) panel id that sits between
     // ACTIVE_LIST_PANEL and its content children in panelRegistry.ts — a
     // flattened structure that didn't match the real panel-tree hierarchy.
     // Every branch below now routes its existing, unchanged content through
     // the package's own real AssetListSelectPanel shell as `listContent`
     // instead of rendering it directly. Deliberately NOT a cosmetic-only
     // change even though none of these feed types trigger the shell's
-    // address-bar/manage-view behavior today (same as the ASSET_LIST_SELECT_PANEL
+    // address-bar/manage-view behavior today (same as the ASSET_SELECT_LIST_PANEL
     // investigation earlier this session found) — the point is giving the
     // extension a REAL, shared container matching the actual architecture, so
     // a future platform (iPhone/Android, per appSplitDevelopmentTime.md) reuses
@@ -1195,334 +1597,307 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // `manageContent` stay omitted (no ADDRESS_PANEL/manage-view concept exists
     // in the extension yet) — safe, since the shell's own render guard
     // requires both `showAddressBar` AND a supplied `addressBar` node.
-    // 2026-10-05 — ADDRESS_PANEL for the extension's list overlays, the same
-    // shared pieces (AddressPanel = HexAddressInput + AssetPreviewRow) the web app
-    // draws. Entering an address NEVER leaves the list: a full address that is in
-    // the rows already loaded shows as a preview row, and clicking that row commits
-    // it (commitSelection), exactly like the web app. An address that isn't in the
-    // list shows a red "not in this list" row — resolving unknown addresses
-    // on-chain is the web app's validation FSM, not ported yet.
-    const buildAddressBar = (rows, kind, onInfo) => {
-        const typed = addressInput.trim();
-        let preview = null;
-        if (typed) {
-            const isFull = /^0x[0-9a-fA-F]{40}$/.test(typed);
-            const isPartial = /^(0|0x[0-9a-fA-F]{0,39})$/i.test(typed);
-            if (isFull) {
-                const hit = rows.find((r) => r.address?.toLowerCase() === typed.toLowerCase());
-                const resolved = entryResolution && entryResolution.address.toLowerCase() === typed.toLowerCase() ? entryResolution : null;
-                preview = hit
-                    ? {
-                        icon: iconFromSrc(hit.iconSrc),
-                        symbol: hit.symbol,
-                        name: hit.name,
-                        address: hit.address,
-                        onSelect: () => commitSelection(hit),
-                        infoIconSrc,
-                        onInfoClick: hit.address ? () => onInfo(hit.address) : undefined,
-                    }
-                    : resolveAssetAddress
-                        ? resolved?.result
-                            ? resolved.result.status === 'ok'
-                                ? {
-                                    icon: iconFromSrc(resolved.result.asset.logoURL),
-                                    symbol: resolved.result.asset.symbol,
-                                    name: resolved.result.asset.name,
-                                    address: resolved.result.asset.address,
-                                    onSelect: () => commitSelection({
-                                        symbol: resolved.result?.status === 'ok' ? resolved.result.asset.symbol : undefined,
-                                        name: resolved.result?.status === 'ok' ? resolved.result.asset.name : undefined,
-                                        address: typed,
-                                        iconSrc: resolved.result?.status === 'ok' ? resolved.result.asset.logoURL : undefined,
-                                        decimals: resolved.result?.status === 'ok' ? resolved.result.asset.decimals : undefined,
-                                    }),
-                                }
-                                : {
-                                    tone: 'error',
-                                    icon: undefined,
-                                    name: 'message' in resolved.result ? resolved.result.message : 'Address not available',
-                                    address: typed,
-                                }
-                            : { icon: undefined, name: 'Looking up address…', address: typed }
-                        : {
-                            tone: 'error',
-                            icon: undefined,
-                            name: kind === 'token' ? 'Token not in this list' : 'Account not in this list',
-                            address: typed,
-                        };
-            }
-            else if (!isPartial) {
-                preview = { tone: 'error', icon: undefined, name: 'Invalid address', address: '' };
-            }
-        }
-        return React.createElement(AddressPanel, { value: addressInput, onChange: setAddressInput, preview });
-    };
-    const recipientListRows = (activeListMode === 'sendRecipient' ? selfFetchedAllAccountRows : undefined) ??
-        resolvedRecipientRows ??
-        flatAccountRows;
-    addressRowsRef.current =
-        activeListMode === 'sendRecipient' ? recipientListRows : effectiveTokenRows;
-    // Resolve a full address that isn't in the loaded rows (host-supplied; see resolveAssetAddress).
-    // The rows ref is read, not depended on, so a list refresh doesn't re-run the lookup.
-    useEffect(() => {
-        const typed = addressInput.trim();
-        if (!resolveAssetAddress || !activeListMode || classifyAddressText(typed) !== 'ok') {
-            setEntryResolution(null);
-            return;
-        }
-        if (addressRowsRef.current.some((r) => r.address?.toLowerCase() === typed.toLowerCase())) {
-            setEntryResolution(null);
-            return;
-        }
-        let cancelled = false;
-        setEntryResolution({ address: typed, result: null });
-        const kind = activeListMode === 'sendRecipient' ? 'account' : 'token';
-        const peer = activeListMode === 'sellToken'
-            ? buyTokenContract?.address
-            : activeListMode === 'buyToken'
-                ? sellTokenContract?.address
-                : undefined;
-        resolveAssetAddress(typed, kind, peer ? String(peer) : undefined)
-            .then((result) => {
-            if (!cancelled)
-                setEntryResolution({ address: typed, result });
-        })
-            .catch((error) => {
-            if (!cancelled)
-                setEntryResolution({
-                    address: typed,
-                    result: { status: 'error', message: error instanceof Error ? error.message : 'Lookup failed' },
-                });
-        });
-        return () => {
-            cancelled = true;
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [addressInput, activeListMode, resolveAssetAddress]);
-    const listOverlay = activeListMode === 'sellToken' ||
-        activeListMode === 'buyToken' ||
-        activeListMode === 'sendToken'
-        ? React.createElement(AssetListSelectPanel, {
-            containerType: SP_COIN_DISPLAY.ASSET_LIST_SELECT_PANEL,
-            feedType: FEED_TYPE.REMOTE_TOKEN_LIST,
-            addressBar: buildAddressBar(effectiveTokenRows, 'token', (address) => {
-                openTokenDetail(address);
-                onTokenIconClick?.(address);
-            }),
-            listContent: React.createElement(AssetListTable, {
-                rows: effectiveTokenRows.map((row) => ({
-                    ...row,
-                    onSelect: () => commitSelection(row),
-                    infoIconSrc,
-                    onInfoClick: row.address
+    // 2026-10-23 — buildAddressBar (the ADDRESS_PANEL typed-address-entry
+    // mechanism this comment used to describe, for sellToken/buyToken/
+    // sendToken/sendRecipient's own rows) removed along with
+    // resolveAssetAddress/entryResolution/addressRowsRef/addressInput: its
+    // only callers were those same four modes' old Merit-local list
+    // rendering, already replaced by the shared package's own
+    // PanelListSelectWrapper (docs/meritFixes.txt §11-12), which has its own
+    // equivalent typed-entry handling — nothing in this file needs this
+    // apparatus anymore. account/network never used it (no addressBar prop
+    // on their own AssetListSelectPanel calls below).
+    // 2026-10-23 — sellToken/buyToken/sendToken/sendRecipient used to render
+    // here too (Merit's own AssetListSelectPanel+AssetListTable, fed by
+    // effectiveTokenRows/recipientListRows). Now that those four modes open
+    // the real REMOTE_TOKEN_LIST/REMOTE_ACCOUNT_SEND_LIST ids via
+    // openActiveListPanel (see paramsForMode above), ASSET_SELECT_LIST_PANEL
+    // is already visible by the time this component would pick a branch, so
+    // the body chain's own `activeChild != null ? sharedListHost : null` wins
+    // before `listOverlay` is even consulted — those branches could never
+    // render again, so they're removed rather than left as dead code.
+    //
+    // account/network keep a listOverlay fallback (reusing these same two
+    // render functions, so there is only ever one copy of this JSX), but its
+    // trigger narrowed with §15-16's redesign: `activeListMode`'s own
+    // 'account'/'network' derivation now comes from activeChild (AND-gated
+    // against ASSET_SELECT_LIST_PANEL's own visibility, see
+    // useActiveListPanelChild's doc comment), not from reading
+    // LOCAL_ACCOUNT_WALLET_LIST/NETWORK_LIST's raw flags directly the way it
+    // used to. That means a host that set only the child flag without also
+    // opening ASSET_SELECT_LIST_PANEL itself (the literal "opened it through
+    // the tree" edge case this fallback was first built for) no longer
+    // surfaces here either — activeListMode stays null, same as
+    // sharedListHost staying closed. Acceptable: §12's own investigation
+    // already established nothing in this codebase actually sets these flags
+    // that way today: a `grep` for every direct setPanelVisible/openPanel
+    // call against these two ids turned up only setActiveList/toggleList/
+    // openAccountList, so this edge case was defensive, not real. What this
+    // fallback still legitimately covers: a parent-tree state restore (e.g.
+    // a persisted panel-tree snapshot opening ASSET_SELECT_LIST_PANEL +
+    // NETWORK_LIST together on reload) racing ahead of this component's own
+    // render on first mount.
+    const renderAccountManagement = () => 
+    // 2026-09-24, ACCOUNT_LIST_REWARDS_PANEL EXT wiring (minimal
+    // bar, matching AGENT_HEADER_PANEL's own precedent) — swaps
+    // the plain AccountListCard for the reward-aware shell so the
+    // component is actually reachable in the extension. See
+    // accountEntryToSpCoinAccount's own doc comment for the type
+    // bridge; onPickAccount/onClaimRewards stay unwired (no real
+    // on-chain reward-discovery feed exists in the extension yet
+    // — see docs/npmMigrationDesign.md's own dated entry on that
+    // real, separately-scoped gap).
+    // 2026-10-03, on request ("the web app has the correct list") —
+    // this branch rendered AccountListRewardsPanel (the reward-aware
+    // card list), while the web app's own header account pill opens
+    // LOCAL_ACCOUNT_WALLET_LIST ("Active Account Selection": Merit
+    // Wallet/MetaMask groups, ACTIVE badge, Add a Wallet/Account).
+    // AccountListCard is this package's pixel-copied portable version
+    // of exactly that screen (see its header comment), so both apps
+    // now show the same list from the same account groups.
+    React.createElement(AssetListSelectPanel, {
+        containerType: SP_COIN_DISPLAY.ASSET_SELECT_LIST_PANEL,
+        // WALLET_ACCOUNTS is the closest real match — its own doc
+        // comment in enums.ts: "Local wallet account list (all known
+        // accounts)... Used by the Send flow's recipient picker."
+        feedType: FEED_TYPE.WALLET_ACCOUNTS,
+        listContent: React.createElement(AccountListCard, {
+            remoteSelection,
+            // 2026-11-06 (owner report: the selector offered the extension's own accounts and MetaMask's to the extension): another wallet is asking for THIS wallet's accounts, so only this wallet's own group is offered
+            groups: (remoteSelection ? effectiveAccountGroups.filter((group) => group.id === pillWalletId || group.id === nativeWalletId || (nativeWalletId === 'serverKeystore' && group.id === 'hardhat')) : effectiveAccountGroups).map((group) => ({
+                ...group,
+                accounts: group.accounts.map((account) => ({
+                    ...account,
+                    // 2026-10-26 (owner report: "the ADDRESS_PANEL should not close
+                    // when I select another active Account for approval on this
+                    // page") -- this is the Active Account Selection list
+                    // (WALLET_ACCOUNTS feed, no address bar of its own), so "it"
+                    // means this list itself: it used to close on any successful
+                    // connect, same as every other list's pick-and-close row. That
+                    // was wrong here specifically -- connecting a different account
+                    // can kick off an approval flow (the wallet's own popup, a
+                    // pending-signature state) the owner needs to keep watching
+                    // this list to see settle, not have it yanked away the instant
+                    // the connect call returns. A failed connect already stayed
+                    // open (so its banner is seen); now a successful one does too.
+                    // The back arrow/X still close it explicitly.
+                    //
+                    // 2026-10-29 (owner report, live: "it should also close this
+                    // page to return to Add Sponsorship... the Recipient [list] can
+                    // be used as an example how Active Account should close its
+                    // panel") -- narrowed rather than reverting 2026-10-26 above: a
+                    // FAILED connect (result === false; ApproverController.connect's
+                    // own contract, see approverAccounts.ts) still leaves the list
+                    // open so its banner is seen, unchanged. A SUCCESSFUL connect
+                    // (no pending approval state to keep watching once it resolves
+                    // true) now closes again, matching every other pick-and-close
+                    // row in this app -- the Recipient list included, which already
+                    // worked this way and is what the owner pointed to as correct.
+                    onSelect: () => {
+                        if (remoteSelection) {
+                            if (account.address)
+                                remoteSelection.onToggle(account.address);
+                            return;
+                        }
+                        // 2026-11-06 (owner rule): a row the person has DISCONNECTED (kept in the list) is not an account to use until it is connected again
+                        if (account.connection && !account.connection.connected)
+                            return;
+                        // 2026-11-02 (owner request, Active Account Selection): picking an account makes it the active account and LEAVES the list open; the person closes it with Back. This reverses 2026-10-29 above (a successful pick closed the list).
+                        // 2026-11-12 (owner: "after I select a new activeAccount with leftClick, I should close this panel the same way back would do it by popping the stack"): this reverses 2026-11-02 above.
+                        // A pick that WORKED (the host answers true, or nothing) closes the list exactly as Back does (setActiveList(null) pops it); a pick the host refused (false: a failed connect) leaves it open so its banner is seen.
+                        void Promise.resolve(onAccountRowSelect?.(account.id, group.id)).then((picked) => {
+                            if (picked !== false)
+                                setActiveList(null);
+                        });
+                    },
+                    onInfoClick: account.address
                         ? () => {
-                            openTokenDetail(row.address);
-                            onTokenIconClick?.(row.address);
+                            openAccountDetail(account.address, group.id);
+                            onAccountIconClick?.(account.address);
                         }
                         : undefined,
                 })),
-                metaLabel: tokenRowsLoading ? 'Token Meta (loading...)' : 'Token Meta',
-            }),
-        })
-        : activeListMode === 'sendRecipient'
-            ? React.createElement(AssetListSelectPanel, {
-                containerType: SP_COIN_DISPLAY.ASSET_LIST_SELECT_PANEL,
-                // sendRecipient's own real id (REMOTE_ACCOUNT_SEND_LIST) has a matching FEED_TYPE member exactly.
-                feedType: FEED_TYPE.REMOTE_ACCOUNT_SEND_LIST,
-                addressBar: buildAddressBar(recipientListRows, 'account', (address) => {
-                    openAccountDetail(address);
-                    onAccountIconClick?.(address);
-                }),
-                listContent: React.createElement(AssetListTable, {
-                    // Prefers the caller's own real recipient directory
-                    // (recipientRows — see that prop's own doc comment) once
-                    // supplied; falls back to the wallet's own accounts
-                    // (flatAccountRows) only for a consumer with no real
-                    // recipient feed of its own yet, same "placeholder until a
-                    // real feed exists" treatment every other fallback in this
-                    // file already has.
-                    // Send lists every known account (the web's REMOTE_ACCOUNT_SEND_LIST).
-                    rows: recipientListRows.map((row) => ({
-                        ...row,
-                        onSelect: () => commitSelection(row),
-                        infoIconSrc,
-                        onInfoClick: row.address
-                            ? () => {
-                                openAccountDetail(row.address);
-                                onAccountIconClick?.(row.address);
-                            }
-                            : undefined,
-                    })),
-                    metaLabel: 'Account Meta',
-                }),
-            })
-            : activeListMode === 'account'
-                ? (() => {
-                    // 2026-09-24, ACCOUNT_LIST_REWARDS_PANEL EXT wiring (minimal
-                    // bar, matching AGENT_HEADER_PANEL's own precedent) — swaps
-                    // the plain AccountListCard for the reward-aware shell so the
-                    // component is actually reachable in the extension. See
-                    // accountEntryToSpCoinAccount's own doc comment for the type
-                    // bridge; onPickAccount/onClaimRewards stay unwired (no real
-                    // on-chain reward-discovery feed exists in the extension yet
-                    // — see docs/npmMigrationDesign.md's own dated entry on that
-                    // real, separately-scoped gap).
-                    // 2026-10-03, on request ("the web app has the correct list") —
-                    // this branch rendered AccountListRewardsPanel (the reward-aware
-                    // card list), while the web app's own header account pill opens
-                    // LOCAL_ACCOUNT_WALLET_LIST ("Active Account Selection": Merit
-                    // Wallet/MetaMask groups, ACTIVE badge, Add a Wallet/Account).
-                    // AccountListCard is this package's pixel-copied portable version
-                    // of exactly that screen (see its header comment), so both apps
-                    // now show the same list from the same account groups.
-                    return React.createElement(AssetListSelectPanel, {
-                        containerType: SP_COIN_DISPLAY.ASSET_LIST_SELECT_PANEL,
-                        // WALLET_ACCOUNTS is the closest real match — its own doc
-                        // comment in enums.ts: "Local wallet account list (all known
-                        // accounts)... Used by the Send flow's recipient picker."
-                        feedType: FEED_TYPE.WALLET_ACCOUNTS,
-                        listContent: React.createElement(AccountListCard, {
-                            groups: effectiveAccountGroups.map((group) => ({
-                                ...group,
-                                accounts: group.accounts.map((account) => ({
-                                    ...account,
-                                    onSelect: () => {
-                                        // a connect that fails keeps the list open so its banner (accountListNotice) is seen; anything else closes it as before
-                                        const result = onAccountRowSelect?.(account.id, group.id);
-                                        if (result instanceof Promise)
-                                            void result.then((ok) => { if (ok !== false)
-                                                closeListOverlay(); });
-                                        else if (result === false)
-                                            return;
-                                        else
-                                            closeListOverlay();
-                                    },
-                                    onInfoClick: account.address
-                                        ? () => {
-                                            openAccountDetail(account.address);
-                                            onAccountIconClick?.(account.address);
-                                        }
-                                        : undefined,
-                                })),
-                            })),
-                            infoIconSrc,
-                            errorMessage: accountListNotice,
-                            onAddWalletAccount: addAccountHost ? () => {
-                                closeListOverlay();
-                                openPanel(SP_COIN_DISPLAY.ADD_WALLET_ACCOUNT, 'MeritWallet:openAddWalletAccount');
-                            } : onAddAccount ? () => { closeListOverlay(); onAddAccount(); } : undefined,
-                        }),
-                    });
-                })()
-                : activeListMode === 'network'
-                    ? React.createElement(AssetListSelectPanel, {
-                        containerType: SP_COIN_DISPLAY.ASSET_LIST_SELECT_PANEL,
-                        // No real FEED_TYPE concept exists for a network list — this
-                        // enum has no NETWORK_LIST member. WALLET_ACCOUNTS reused as
-                        // a safe inert placeholder: it's not a MANAGE_* value, so
-                        // isManageView stays false regardless (same as every other
-                        // branch here), the only thing feedType actually gates.
-                        feedType: FEED_TYPE.WALLET_ACCOUNTS,
-                        listContent: React.createElement(NetworkListTable, {
-                            rows: visibleNetworkRows.map((row) => ({
-                                ...row,
-                                // NetworkListRow's own AssetSelectDropDown gates its whole
-                                // symbol/name display on `hasEntity={!!address}` (a
-                                // TokenListRow/AccountListRow-ism this row shape
-                                // inherited). Corrected 2026-09-16: this used to fabricate
-                                // a fake native-currency placeholder address to satisfy
-                                // that gate — wrong, per the real app's own
-                                // NetworkSelectDropDown.tsx (`address={isRow ?
-                                // \`NetworkId : ${numericCurrentId}\` : triggerLabel}`),
-                                // which feeds a literal "NetworkId : $id" label into this
-                                // exact slot instead of a real/fake address. Matches that
-                                // exactly now — real per-chain data, not a fabricated
-                                // stand-in.
-                                address: `NetworkId : ${row.id}`,
-                                icon: row.iconSrc
-                                    ? React.createElement('img', {
-                                        src: row.iconSrc,
-                                        alt: '',
-                                        style: { width: '100%', height: '100%', objectFit: 'contain' },
-                                    })
-                                    : undefined,
-                                onSelect: () => {
-                                    closeListOverlay();
-                                    onNetworkRowSelect?.(row.id);
-                                },
-                                // 2026-09-17, on live report ("selecting the network.png in
-                                // any row is supposed to return the network... but instead
-                                // opens NETWORK_PANEL for every row") — was wired to
-                                // setNetworkDetailId (open the detail panel), on the belief
-                                // this row's own right-side auth-toggle slot leaves no room
-                                // for a separate info button, so the icon should fill that
-                                // role instead (see NetworkListRow.tsx's own doc comment).
-                                // That reasoning didn't match how every OTHER list row in
-                                // this file actually behaves: Token/Recipient/Account rows
-                                // never wire onIconClick as a detail-opener at the list
-                                // level at all (only their TRIGGER pill's own icon does,
-                                // once something is already active — see
-                                // activeNetworkRow's onIconClick below) — a list row's
-                                // icon commits, same as clicking the rest of the row, with
-                                // no onIconClick override needed since AssetSelectDropDown
-                                // already falls the click through to onRowClick when
-                                // onIconClick is omitted. Simply not overriding it here
-                                // makes network rows consistent with every other list.
-                            })),
-                            showTestNets,
-                            onToggleShowTestNets: () => setShowTestNets((prev) => !prev),
-                        }),
+            })),
+            infoIconSrc,
+            errorMessage: accountListNotice,
+            // 2026-11-02 (owner: Back from Add Wallet Account must step back to the list): the list is NOT closed here. Opening the add flow closes nothing; the flow is drawn over the list, and Back closes just the flow, so the list is what is left.
+            onAddWalletAccount: addAccountHost ? () => {
+                // 2026-11-03 (owner request): "Manage Wallets and Accounts" opens the wallet list (Select Software Wallet). 2026-11-05 (owner): the wallet list is a child of LOCAL_ACCOUNT_WALLET_LIST, not of the Add menu, so the Add menu is not
+                // opened under it and Back lands on the account list.
+                openPanel(SP_COIN_DISPLAY.WALLET_LIST_SELECT_PANEL, 'MeritWallet:openAddWalletAccount');
+            } : onAddAccount ? () => { closeListOverlay(); onAddAccount(); } : undefined,
+        }),
+    });
+    const renderNetworkList = () => React.createElement(AssetListSelectPanel, {
+        containerType: SP_COIN_DISPLAY.ASSET_SELECT_LIST_PANEL,
+        // No real FEED_TYPE concept exists for a network list — this
+        // enum has no NETWORK_LIST member. WALLET_ACCOUNTS reused as
+        // a safe inert placeholder: it's not a MANAGE_* value, so
+        // isManageView stays false regardless (same as every other
+        // branch here), the only thing feedType actually gates.
+        feedType: FEED_TYPE.WALLET_ACCOUNTS,
+        listContent: React.createElement(NetworkListTable, {
+            rows: visibleNetworkRows.map((row) => ({
+                ...row,
+                // NetworkListRow's own AssetSelectDropDown gates its whole
+                // symbol/name display on `hasEntity={!!address}` (a
+                // TokenListRow/AccountListRow-ism this row shape
+                // inherited). Corrected 2026-09-16: this used to fabricate
+                // a fake native-currency placeholder address to satisfy
+                // that gate — wrong, per the real app's own
+                // NetworkSelectDropDown.tsx (`address={isRow ?
+                // \`NetworkId : ${numericCurrentId}\` : triggerLabel}`),
+                // which feeds a literal "NetworkId : $id" label into this
+                // exact slot instead of a real/fake address. Matches that
+                // exactly now — real per-chain data, not a fabricated
+                // stand-in.
+                address: `NetworkId : ${row.id}`,
+                icon: row.iconSrc
+                    ? React.createElement('img', {
+                        src: row.iconSrc,
+                        alt: '',
+                        style: fitImageStyle,
                     })
-                    : null;
+                    : undefined,
+                onSelect: () => {
+                    closeListOverlay();
+                    onNetworkRowSelect?.(row.id);
+                },
+                // 2026-09-17, on live report ("selecting the network.png in
+                // any row is supposed to return the network... but instead
+                // opens NETWORK_PANEL for every row") — was wired to
+                // setNetworkDetailId (open the detail panel), on the belief
+                // this row's own right-side auth-toggle slot leaves no room
+                // for a separate info button, so the icon should fill that
+                // role instead (see NetworkListRow.tsx's own doc comment).
+                // That reasoning didn't match how every OTHER list row in
+                // this file actually behaves: Token/Recipient/Account rows
+                // never wire onIconClick as a detail-opener at the list
+                // level at all (only their TRIGGER pill's own icon does,
+                // once something is already active — see
+                // activeNetworkRow's onIconClick below) — a list row's
+                // icon commits, same as clicking the rest of the row, with
+                // no onIconClick override needed since AssetSelectDropDown
+                // already falls the click through to onRowClick when
+                // onIconClick is omitted. Simply not overriding it here
+                // makes network rows consistent with every other list.
+            })),
+            showTestNets,
+            onToggleShowTestNets: () => setShowTestNets((prev) => !prev),
+        }),
+    });
+    // Declared here, not near activeChild above, because it needs
+    // renderNetworkList/renderAccountManagement (just defined) in scope —
+    // see that earlier declaration site's own doc comment. activeChild itself
+    // was already computed early (so activeListMode could derive from the
+    // same single read) — passed straight through as AssetSelectListPanel's
+    // one parameter, not re-read here.
+    const sharedListHost = React.createElement(AssetSelectListPanelHost, {
+        activeChild,
+        walletChrome: true,
+        renderNetworkList,
+        renderAccountManagement,
+    });
+    const listOverlay = activeListMode === 'account'
+        ? renderAccountManagement()
+        : activeListMode === 'network'
+            ? renderNetworkList()
+            : null;
     // PanelGate's props type requires `children` as a prop, so createElement's children argument does not type-check here
     // eslint-disable-next-line react/no-children-prop
-    const gatedTabBody = React.createElement(PanelGate, { panel: TAB_PANEL_IDS[activeTab], children: tabBody });
+    // While a step popup is drawn in MESSAGE_PANEL the tab body stays mounted (hidden): the popup's flow (the Sponsor tab's confirm hook) lives in it.
+    const gatedTabBody = React.createElement(PanelGate, { panel: TAB_PANEL_IDS[activeTab], lazyLoad: !stepContentUp, children: tabBody });
     // 2026-10-10: the shared Add a Wallet/Account flow (the host's addAccountHost), shown over the wallet like the profile editor.
+    // docs/meritMigration.txt row 19 (found by the deep walk, 2026-10-20, in BOTH apps): backing out of the Add a Wallet/Account screens left the tab's title over a BLANK body. "Add a Wallet" closes the account-list overlay and then opens the add flow, so when the flow is
+    // popped there is no invoker for the panel tree to restore and no radio panel is visible; clicking the tab you are already on does nothing by rule (handleTabClick), so the blank stayed until another tab was chosen.
+    // When the add flow has CLOSED (checked after the pop is applied: calling openPanel in the same tick as the pop raced with it and made the first tap on Go back do nothing), the active tab's own panel is shown again.
+    const prevAddFlowTopRef = useRef(addFlowTop);
+    useEffect(() => {
+        const wasOpen = prevAddFlowTopRef.current != null;
+        prevAddFlowTopRef.current = addFlowTop;
+        // 2026-11-02: only when no list is open underneath: a list left open is what Back returns to, and a tab opened over it would hide it
+        if (wasOpen && addFlowTop == null && activeChild == null)
+            openPanel(TAB_PANEL_IDS[activeTab], 'MeritWallet:addFlowRestoreTab');
+    }, [addFlowTop]);
     const addAccountOverlay = addFlowTop != null && addAccountHost
         ? React.createElement(AddAccountFlow, { host: addAccountHost, wallet, activeAddress: activeAccountAddress, nativeWalletId, walletConnection, onDisconnectWallet, onDone: () => closePanel(addFlowTop, 'MeritWallet:addAccountFlow:done') })
         : null;
     // docs/meritMigration.txt row 14: the one account detail screen (avatar, profile table, Private Key row); the host's accountDetailHost says how a save is signed and how a key is revealed.
-    const accountDetailOverlay = accountDetailVisible && accountDetailAddress && accountDetailHost
-        ? React.createElement(AccountDetailScreen, {
-            account: { address: accountDetailAddress, ...(accountDetail?.address === accountDetailAddress ? { name: accountDetail.name, symbol: accountDetail.symbol, logoURL: accountDetail.avatarSrc } : {}) },
-            role: SP_COIN_DISPLAY.ACTIVE_ACCOUNT,
-            host: accountDetailHost,
-        })
-        : null;
-    const tokenDetailOverlay = tokenDetailVisible && tokenDetailAddress
-        ? React.createElement(TokenDetailPanel, {
-            address: tokenDetailAddress,
-            // Same "only trust it once it answers the current address" gate
-            // as accountDetailOverlay above.
-            ...(tokenDetail?.address === tokenDetailAddress
-                ? {
-                    logoSrc: tokenDetail.logoSrc,
-                    name: tokenDetail.name,
-                    symbol: tokenDetail.symbol,
-                    decimals: tokenDetail.decimals,
-                    website: tokenDetail.website,
-                    explorer: tokenDetail.explorer,
-                    description: tokenDetail.description,
-                    loading: false,
+    const roleAccounts = roleContext?.apiCoreSyncedMembers?.accounts;
+    const roleDetail = agentPanelVisible
+        ? { role: SP_COIN_DISPLAY.AGENT_ACCOUNT, account: roleAccounts?.agentAccount, empty: 'No agent selected.' }
+        : sponsorPanelVisible
+            ? { role: SP_COIN_DISPLAY.SPONSOR_ACCOUNT, account: roleAccounts?.sponsorAccount, empty: 'No sponsor selected.' }
+            : recipientPanelVisible
+                ? { role: SP_COIN_DISPLAY.RECIPIENT_ACCOUNT, account: roleAccounts?.recipientAccount, empty: 'No recipient selected.' }
+                : undefined;
+    // The active account's detail: the address picked from a list, else the active account (the panel opened from the header).
+    const detailAddress = accountDetailAddress ?? String(activeAccountForDetail?.address ?? '').trim() ?? undefined;
+    // 2026-11-08 (docs/design/removeAccountPlan.txt rows 3 and 5): the screen asks who holds the account (the wallet answers) and leaves when the account was removed
+    const detailHost = accountDetailHost && wallet
+        ? {
+            ...accountDetailHost,
+            accountSource: accountDetailHost.accountSource ?? (async (address, symbol) => {
+                const value = await resolveAccountSource(wallet, address, activeAccountAddress, accountDetailGroup ?? undefined, symbol);
+                setAccountDetailTitle(value?.title ?? null);
+                return value;
+            }),
+            accountBalance: accountDetailHost.accountBalance ?? (fetchBalance
+                ? async (address) => {
+                    const value = await fetchBalance({ accountAddress: address }).catch(() => undefined);
+                    // 2026-11-11: the amount only; the confirmation words it where it shows it (RemoveAccountPanel)
+                    return value && value > 0n ? formatUnits(value, 18) : undefined;
                 }
-                : { loading: true }),
-        })
-        : null;
+                : undefined),
+            onAccountRemoved: (address, message) => {
+                // 2026-11-10 (docs/design/removeAccountPlan.txt row 9): the removal is traced and confirmed in MESSAGE_PANEL; the lists re-read when the wallet announces the change
+                engineTrace('account:removed', { address, message });
+                if (message)
+                    accountNoticeStore.publish(message, [address]);
+                setAccountDetailAddress(null);
+                // 2026-11-11 (owner): by name, never a pop of whatever is on top: the stack held MESSAGE_PANEL and ACCOUNT_PANEL, and a single pop left ACCOUNT_PANEL listed under the list we landed on
+                closePanel(SP_COIN_DISPLAY.MESSAGE_PANEL, 'NAV_CLOSE:MeritWallet:accountRemoved');
+                closePanel(SP_COIN_DISPLAY.ACCOUNT_PANEL, 'NAV_CLOSE:MeritWallet:accountRemoved');
+            },
+        }
+        : accountDetailHost;
+    const accountDetailOverlay = !detailHost
+        ? null
+        : roleDetail
+            ? roleDetail.account
+                ? React.createElement(AccountDetailScreen, { account: roleDetail.account, role: roleDetail.role, host: detailHost })
+                : React.createElement('div', { style: walletFrameStyle.roleEmpty }, roleDetail.empty)
+            : accountDetailVisible && detailAddress
+                ? React.createElement(AccountDetailScreen, {
+                    account: { address: detailAddress, ...(accountDetail?.address === detailAddress ? { name: accountDetail.name, symbol: accountDetail.symbol, logoURL: accountDetail.avatarSrc } : {}) },
+                    role: SP_COIN_DISPLAY.ACTIVE_ACCOUNT,
+                    host: detailHost,
+                })
+                // 2026-11-09 (owner: a panel open in the tree must not be blank): ACCOUNT_PANEL with no address to show (nothing picked, no active account) says so, as the role panels do
+                : accountDetailVisible
+                    ? React.createElement('div', { style: walletFrameStyle.roleEmpty }, 'No account selected.')
+                    : null;
+    // 2026-10-26 (owner report: TOKEN_PANEL's own TOKEN_LOGO/TOKEN_META_DATA
+    // children never actually opened or closed anything — unlike
+    // ACCOUNT_PANEL's AccountDetailScreen, which reads usePanelVisible on its
+    // own ACCOUNT_LOGO/ACCOUNT_META_DATA pair). Root cause: this overlay used
+    // to build the flat, static TokenDetailPanel (address/name/symbol rows,
+    // no panel-tree awareness at all) instead of TokenPanel.tsx — the
+    // package's own panel-tree-aware token screen, which already reads
+    // TOKEN_META_DATA/TOKEN_LOGO visibility exactly the way AccountDetailScreen
+    // reads its own pair (see this file's own 2026-10-20 doc comment above
+    // previewToken: "TokenPanel.tsx ... already correctly uses" it) but was
+    // never actually wired in here. TokenPanel is self-contained (reads
+    // previewToken/chain/baseUrl via the engine's own hooks, same as
+    // AccountDetailScreen reads its host), so no props are needed.
+    // 2026-11-09 (owner: TOKEN_PANEL open in the panel tree but empty on screen; the trace showed tokenDetailVisible true, tokenDetailOverlay false, previewTokenAddress null): it is drawn whenever it is visible, not only when a token is
+    // being previewed. TokenPanel decides what to show: the previewed token, else the buy or sell token, else its own "No token contract selected" notice (it closes itself when it was not opened from the panel tree).
+    const tokenDetailOverlay = tokenDetailVisible ? React.createElement(TokenPanel, {}) : null;
     // No loading branch needed — unlike accounts/tokens, this row's own data
     // (networkRowsSource) is already fully in memory the moment the icon is
     // clicked; see onNetworkIconClick's own doc comment on MeritWalletProps.
-    const networkDetailRow = networkDetailVisible && networkDetailId
-        ? networkRowsSource.find((row) => row.id === networkDetailId)
-        : undefined;
-    const networkDetailOverlay = networkDetailRow
-        ? React.createElement(NetworkDetailPanel, {
-            id: networkDetailRow.id,
-            logoSrc: networkDetailRow.iconSrc,
-            name: networkDetailRow.name,
-            symbol: networkDetailRow.symbol,
-            isTestnet: networkDetailRow.isTestnet,
-        })
-        : null;
+    // 2026-11-09 (owner: opened from the panel tree, NETWORK_PANEL showed an empty body): the screen is the shared ConnectedNetworkPanel (the live network, or the previewed chain), drawn by the same base layout as the Account screen, and it shows whenever NETWORK_PANEL is visible, not only after a row click.
+    const networkDetailOverlay = networkDetailVisible ? React.createElement(ConnectedNetworkPanel, {}) : null;
     // 2026-09-29, real bug fix — see passwordMode's own doc comment on
     // MeritWalletProps for the full root-cause. Highest priority in this
     // chain, deliberately: a locked wallet should block every other overlay
@@ -1534,32 +1909,129 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // display AGENT_HEADER_PANEL") — shared by the password overlay below and the
     // agent header's render site, so both follow the one condition.
     const passwordPanelShowing = !!walletLocked || activeMainOverlay === SP_COIN_DISPLAY.PASSWORD_PANEL;
-    const passwordOverlay = passwordPanelShowing && recoveryPhrase
-        ? React.createElement(RecoveryPhraseScreen, { recoveryPhrase, onContinue: () => onRecoveryPhraseSaved?.(), autoHide: false })
-        : passwordPanelShowing
-            ? React.createElement(PasswordPanel, {
-                mode: passwordMode,
-                showTitle: false,
-                icon: passwordIcon,
-                errorText: passwordErrorText,
-                noticeText: passwordNoticeText,
-                onSubmit: onPasswordSubmit,
-                submitting: passwordSubmitting,
-                clearOnSubmit: true,
-            })
-            : null;
+    const passwordOverlay = passwordPanelShowing && recoveryPhrase && securitySetup && setupStage === 'warning'
+        ? React.createElement(SecurityWarningScreen, { onContinue: () => { setSetupStage('phrase'); onRecoveryPhraseSaved?.(); } })
+        : passwordPanelShowing && recoveryPhrase && securitySetup && setupStage === 'security'
+            ? React.createElement(SecuritySetupScreen, { ...securitySetup, onDone: () => setSetupStage('warning') })
+            : passwordPanelShowing && recoveryPhrase
+                ? React.createElement(RecoveryPhraseScreen, { recoveryPhrase, onContinue: () => { if (securitySetup)
+                        setSetupStage('security');
+                    else
+                        onRecoveryPhraseSaved?.(); }, autoHide: false })
+                : passwordPanelShowing && pendingUnlock && securitySetup?.signIn
+                    ? React.createElement(UnlockSecondStep, {
+                        steps: pendingUnlock.steps,
+                        signIn: securitySetup.signIn,
+                        onPassed: () => { const held = pendingUnlock; setPendingUnlock(undefined); onPasswordSubmit?.(held.password, held.confirm); },
+                        onCancel: () => setPendingUnlock(undefined),
+                    })
+                    : passwordPanelShowing
+                        ? React.createElement(PasswordPanel, {
+                            mode: passwordMode,
+                            showTitle: false,
+                            icon: passwordIconSrc ? React.createElement('img', { src: passwordIconSrc, alt: 'Merit Wallet', style: lockLogoStyle }) : undefined,
+                            errorText: passwordErrorText,
+                            noticeText: passwordNoticeText,
+                            // 2026-11-13 (owner: sign-in options): on the unlock screen the steps switched on in Config -> Security (passkey, authenticator app) are asked for after the password and before the unlock goes ahead
+                            onSubmit: (password, confirm) => {
+                                const signIn = securitySetup?.signIn;
+                                const steps = signIn && passwordMode === 'unlock' ? requiredSignInSteps(signIn.options(), signIn.enrolled()) : undefined;
+                                if (steps && anySignInStep(steps))
+                                    setPendingUnlock({ password, confirm, steps });
+                                else
+                                    onPasswordSubmit?.(password, confirm);
+                            },
+                            submitting: passwordSubmitting,
+                            clearOnSubmit: true,
+                        })
+                        : null;
     const passwordOverlayWithReset = passwordOverlay && walletLocked && onResetWallet
-        ? React.createElement(React.Fragment, null, passwordOverlay, React.createElement('div', { style: { textAlign: 'center', padding: '8px 12px' } }, React.createElement('button', { type: 'button', onClick: onResetWallet, style: { background: 'none', border: 0, color: '#94a3b8', textDecoration: 'underline', cursor: 'pointer', font: 'inherit', fontSize: 12 } }, 'Forgot password? Reset wallet')))
+        ? React.createElement(React.Fragment, null, passwordOverlay, React.createElement('div', { style: walletFrameStyle.forgotRow }, React.createElement('button', { type: 'button', onClick: onResetWallet, style: walletFrameStyle.forgotLink }, 'Forgot password? Reset wallet')))
         : passwordOverlay;
     // 2026-10-05 — PANEL_TREE_PANEL is a main-radio view (opened from Config), not a tab: it replaces the body
     // while it is the showing member, exactly like the other full-body overlays.
     const panelTreeOverlay = panelTreeVisible ? React.createElement(PanelTreePanel) : null;
+    // 2026-10-23 — MERIT_INFO_PANEL is PANEL_TREE_PANEL's own sibling in the
+    // same MAIN_RADIO_OVERLAY_PANELS radio group (the "Merit Wallet" header
+    // title opens it, WalletHeader.tsx's handleTitleClick) — same "replaces
+    // the body while showing" treatment. See meritInfoVisible's own doc
+    // comment above for why this was missing.
+    // 2026-10-24 (owner report: the extension's own About panel showed
+    // "N/A" for every field, the web app's showed real data) — baseUrl was
+    // left at its default ('', same-origin relative), exactly the
+    // portability wrinkle MeritInfoPanelReal.tsx's own header comment
+    // already flagged: a relative fetch of /assets/miscellaneous/
+    // meritInfo.json resolves fine for the web app but not from the
+    // extension's chrome-extension:// origin. walletAssetBaseUrl already
+    // exists and is passed to WalletPanel/WalletSelectDropDownHosted below
+    // for this exact reason ("a host on another origin, the extension,
+    // passes the web app's address") — just never wired to this panel too.
+    const meritInfoOverlay = meritInfoVisible
+        ? React.createElement(MeritInfoPanelReal, { baseUrl: walletAssetBaseUrl })
+        : null;
     // 2026-10-09 -- the result card of a swap (Success / error, from the shared runUniswapSwap flow). The web app shows MESSAGE_PANEL through its
     // overlayHost; a host without one (the extension) gets it here, in place of the body, until the user closes it.
-    const messageOverlay = messageVisible && !overlayHost ? React.createElement(ConnectedMessagePanel) : null;
+    const messageOverlay = messageVisible ? React.createElement(ConnectedMessagePanel) : null;
     // 2026-10-13 (owner request): WALLET_PANEL, the active wallet's account.json. The web app shows it through its overlayHost (walletPanel slot); a host without one (the extension) gets it here, in place of the body.
-    const walletPanelOverlay = walletPanelVisible && !overlayHost ? React.createElement(WalletPanel, { walletId: activeWalletId, baseUrl: walletAssetBaseUrl, showLogo: walletLogoVisible, showMetaData: walletMetaDataVisible }) : null;
-    const body = messageOverlay ?? passwordOverlayWithReset ?? panelTreeOverlay ?? addAccountOverlay ?? accountDetailOverlay ?? tokenDetailOverlay ?? networkDetailOverlay ?? walletPanelOverlay ?? (listHost && panelTreeListOpen ? listHost : null) ?? listOverlay ?? gatedTabBody;
+    const walletPanelOverlay = walletPanelVisible ? React.createElement(WalletPanel, { walletId: activeWalletId, baseUrl: walletAssetBaseUrl, showLogo: walletLogoVisible, showMetaData: walletMetaDataVisible }) : null;
+    // 2026-10-23 — gated on `activeChild != null`, not the coarser
+    // panelTreeListOpen (= ASSET_SELECT_LIST_PANEL's own flag alone): the two
+    // can genuinely disagree (parent open, no child flag actually set is a
+    // real transient state), and sharedListHost is a React element — always
+    // truthy as a VALUE even when it will render null internally — so gating
+    // on the less precise flag would let this `??` chain stop here with
+    // nothing on screen instead of correctly falling through to listOverlay/
+    // gatedTabBody.
+    // 2026-10-26 (diagnostic, owner report: right-clicking a token row still
+    // shows a blank body after tokenDetailOverlay was switched to read
+    // previewToken) -- logs which of these resolved truthy/falsy right
+    // before the chain picks one, so the next capture shows which overlay is
+    // actually winning instead of tokenDetailOverlay.
+    panelTreeTrace('MeritWallet:body overlay chain', {
+        messageOverlay: messageOverlay != null,
+        passwordOverlayWithReset: passwordOverlayWithReset != null,
+        panelTreeOverlay: panelTreeOverlay != null,
+        meritInfoOverlay: meritInfoOverlay != null,
+        addAccountOverlay: addAccountOverlay != null,
+        accountDetailOverlay: accountDetailOverlay != null,
+        accountDetailVisible,
+        tokenDetailOverlay: tokenDetailOverlay != null,
+        tokenDetailVisible,
+        previewTokenAddress,
+        networkDetailOverlay: networkDetailOverlay != null,
+        walletPanelOverlay: walletPanelOverlay != null,
+        activeChild: activeChild != null ? SP_COIN_DISPLAY[activeChild] : null,
+        listOverlay: listOverlay != null,
+    });
+    // the remote's account selector sits above every other open screen (add-wallet flow, wallet list, detail views) until Done / Cancel
+    // the selector sits above whatever screens were open when it started (the wallet list is one of them); only an add / manage screen opened AFTER it started, from its own Manage button, goes above it
+    const remoteStart = useRef({ menu: false });
+    const remoteWasOpen = useRef(false);
+    if (remoteSelection && !remoteWasOpen.current)
+        remoteStart.current = { top: addFlowTop, menu: addMenuVisible };
+    remoteWasOpen.current = !!remoteSelection;
+    const addFlowOpenedSinceRemote = addFlowTop !== remoteStart.current.top || (addMenuVisible && !remoteStart.current.menu);
+    const remoteOverlay = remoteSelection && !addFlowOpenedSinceRemote ? renderAccountManagement() : null;
+    const validateRemoteVisible = usePanelVisible(SP_COIN_DISPLAY.VALIDATE_REMOTE_CONNECT);
+    const approvalPending = !!approvalPage;
+    useEffect(() => {
+        if (approvalPending)
+            openPanel(SP_COIN_DISPLAY.VALIDATE_REMOTE_CONNECT, 'MeritWallet:approvalPage:open');
+        else
+            closePanel(SP_COIN_DISPLAY.VALIDATE_REMOTE_CONNECT, 'MeritWallet:approvalPage:close');
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [approvalPending]);
+    const approvalOverlay = approvalPage && validateRemoteVisible && !passwordOverlay ? approvalPage.element : null;
+    const body = messageOverlay ?? passwordOverlayWithReset ?? approvalOverlay ?? remoteOverlay ?? panelTreeOverlay ?? meritInfoOverlay ?? addAccountOverlay ?? accountDetailOverlay ?? tokenDetailOverlay ?? networkDetailOverlay ?? walletPanelOverlay ?? (activeChild != null ? sharedListHost : null) ?? listOverlay ?? null;
+    // The tab body always sits in the SAME slot of one Fragment ([overlay, tab body]): while a step popup is drawn in MESSAGE_PANEL it stays there (hidden) beside
+    // the panel, so the popup's owner (the Sponsor trade button's confirm flow) is not unmounted by the panel opening. Switching between a bare element and a
+    // Fragment instead would remount the whole tab.
+    const showTabBody = body == null || (stepContentUp && body === messageOverlay);
+    // the Rewards list opened by Unstake: it self-gates on SPONSOR_STAKING_LIST and is drawn inside WALLET_RADIO_PANELS (below the tab strip), skipped while the login page shows (the flag is remembered across sessions)
+    const stakingListNode = !passwordPanelShowing
+        ? (stakingHost ? React.createElement(ConnectedSponsorStakingList, { host: stakingHost }) : React.createElement(SponsorStakingListPanel, { recipients: [], stakeInfoByAddress: {}, decimals: 18, loading: false }))
+        : null;
+    const bodyWithTab = React.createElement(React.Fragment, null, body, showTabBody ? gatedTabBody : null);
     // Matches the real app's own per-tab titles (useActiveWalletPanelTitle.tsx,
     // its `sponsorshipPanelVisible`/`tradingTabVisible`/`sendTabVisible`/
     // `rewardsTabVisible` ternary) — PanelTitle's own default ("Trading
@@ -1574,132 +2046,162 @@ function MeritWalletInner({ resolveAssetAddress, docked = false, fullWidth = fal
     // wording. PasswordPanel's inner heading is suppressed here because this
     // component already shows the state in PanelTitle; passwordMode drives both.
     // 2026-10-15 (owner request): "Select Software Wallet" / "Select Hardware Wallet" / "Select Wallet", by the list's two footer boxes
-    const walletListScreenTitle = useWalletListTitle();
-    const panelTitle = passwordOverlay
-        ? passwordMode === 'setup' ? 'Create Account' : 'Account Login'
-        : walletListLeafVisible
-            ? walletListScreenTitle
-            : addMenuVisible && panelTreeListOpen
-                ? 'Add Wallet Account'
-                : panelTreeVisible
-                    ? 'Panel Tree'
-                    : accountDetailVisible
-                        ? 'Account Details'
-                        : tokenDetailVisible
-                            ? 'Token Details'
-                            : networkDetailVisible
-                                ? 'Network Details'
-                                : activeListMode === 'sellToken' ||
-                                    activeListMode === 'buyToken' ||
-                                    activeListMode === 'sendToken'
-                                    ? 'Select a Token'
-                                    : activeListMode === 'sendRecipient'
-                                        ? 'Select Recipient'
-                                        : activeListMode === 'account'
-                                            ? 'Active Account Selection'
-                                            : activeListMode === 'network'
-                                                ? 'Select Network'
-                                                : activeTab === 'SWAP'
-                                                    ? 'Trading Station'
-                                                    : activeTab === 'SEND'
-                                                        ? 'Send Token'
-                                                        : activeTab === 'SPONSOR'
-                                                            ? 'Add Sponsorship'
-                                                            : activeTab === 'REWARDS'
-                                                                ? 'Rewards Management'
-                                                                : 'Wallet Config';
-    return (_jsx(WalletBalanceContext.Provider, { value: walletBalanceValue, children: _jsx(WalletConnectProvider, { hasAccount: !!String(activeAccountAddress ?? '').trim(), openAccountList: () => setActiveList('account'), children: _jsx(ActiveAccountProfileContext.Provider, { value: activeAccountEntry ? { address: activeAccountEntry.address, name: activeAccountEntry.name, symbol: activeAccountEntry.symbol, logoURL: activeAccountEntry.iconSrc } : undefined, children: _jsxs("div", { style: {
-                        position: 'relative',
-                        display: 'flex',
-                        flexDirection: 'column',
-                        minHeight: 5,
-                        width: fullWidth ? '100%' : 'min(364px, calc(100vw - 32px))',
-                        overflow: 'hidden',
-                        pointerEvents: 'auto',
-                        border: '1px solid #2e3654',
-                        background: walletColors.background,
-                        color: walletColors.white,
-                        boxShadow: '0 25px 50px -12px rgba(0, 0, 0, 0.5)',
-                        ...(docked
-                            ? { height: '100%', borderRadius: 0, borderRight: 'none' }
-                            : { maxHeight: 'min(1000px, calc(100vh - 100px))', borderRadius: 15 }),
-                    }, children: [passwordPanelShowing && (_jsx(PanelGate, { panel: SP_COIN_DISPLAY.LOGIN_HEADER, lazyLoad: false, children: _jsx(LoginHeader, { title: recoveryPhrase || passwordMode === 'setup' ? 'Create Merit Wallet Account' : 'Merit Wallet Login', onClose: onClose, appType: appType, wwwIconSrc: wwwIconSrc, closeIconSrc: closeIconSrc }) })), !passwordPanelShowing && (_jsx(PanelGate, { panel: SP_COIN_DISPLAY.WALLET_NETWORK_HEADER, lazyLoad: false, children: _jsx(WalletNetworkHeader, { mode: "normal", leftSlot: _jsx(NetworkSelectDropDown, { label: activeNetworkRow?.name, 
-                                    // 2026-09-16, on live report ("the NetworkSelectDropDown is
-                                    // not showing the network icon in the WALLET_NETWORK_HEADER")
-                                    // — activeNetworkRow.iconSrc was already real (same value the
-                                    // Select Network list's own rows resolve their icon from
-                                    // below), this render site just never turned it into an
-                                    // <img> and passed it into NetworkSelectDropDown's own icon
-                                    // slot — same conversion the network-list rows already do.
-                                    icon: activeNetworkRow?.iconSrc
-                                        ? React.createElement('img', {
-                                            src: activeNetworkRow.iconSrc,
-                                            alt: '',
-                                            style: { width: '100%', height: '100%', objectFit: 'contain' },
-                                        })
-                                        : undefined, onSelectClick: () => toggleList('network'), onIconClick: activeNetworkRow
-                                        ? () => {
-                                            openNetworkDetail(activeNetworkRow.id);
-                                            onNetworkIconClick?.(activeNetworkRow.id);
-                                        }
-                                        : undefined, chevronUp: activeListMode === 'network' }), titleBadgeSrc: titleBadgeSrc, onRefresh: onRefresh, refreshing: refreshing, onClose: onClose, appType: appType, wwwIconSrc: wwwIconSrc, closeIconSrc: closeIconSrc }) })), !passwordPanelShowing && (_jsx(PanelGate, { panel: SP_COIN_DISPLAY.WALLET_ACCOUNT_HEADER, lazyLoad: false, children: _jsx(WalletAccountHeader, { icon: activeAccountEntry?.icon, address: activeAccountEntry?.address, symbol: activeAccountEntry?.symbol, name: activeAccountEntry?.name, placeholderLabel: "Select Account", onSelectClick: () => toggleList('account'), onIconClick: (address) => {
-                                    if (!address)
-                                        return;
-                                    openAccountDetail(address);
-                                    onAccountIconClick?.(address);
-                                }, chevronUp: activeListMode === 'account', walletName: activeWalletName }) })), !passwordPanelShowing && (_jsx(AgentHeaderPanel, { agentName: agentAccount?.name, children: agentSelectSlot ?? _jsx(ConnectedAgentSelectDropDown, {}) })), _jsxs("div", { style: { display: 'flex', minHeight: 0, flex: 1, flexDirection: 'column', overflow: 'hidden' }, children: [!passwordPanelShowing && (_jsx(PanelGate, { panel: SP_COIN_DISPLAY.PANEL_TITLE, lazyLoad: false, children: _jsx(PanelTitle, { title: panelTitle, onMenuClick: handleMenuClick, menuOpen: menuTabHeaderVisible, 
-                                        // 2026-10-03, on request — on the Account Login / Create Account
-                                        // screen the title bar shows only its title: no back button (nothing
-                                        // to go back to while locked) and no hamburger menu.
-                                        hideBackButton: passwordPanelShowing, hideMenuButton: passwordPanelShowing, 
-                                        // 2026-09-15 — the back arrow already existed (inert, no
-                                        // onBackClick ever passed); now real whenever a list overlay is
-                                        // open, closing it back to the tab it was opened from.
-                                        // 2026-10-05, task 11c (live report: back arrow did nothing
-                                        // with SPONSORSHIP_PANEL open — no detail overlay was open,
-                                        // so this was `undefined` and the click was inert) — final
-                                        // fallback is now the real panel-tree pop-top: closePanel's
-                                        // legacy string-first overload pops the top IS_STACK_COMPONENT
-                                        // off displayStack, hides it (NAV_CLOSE: invoker →
-                                        // radio-restore-on-pop) and re-opens whatever is next on the
-                                        // stack (usePanelTree.ts's closePanel pop-top branch). No-ops
-                                        // safely when the stack is empty. Same call shape as the web
-                                        // app's own ActiveWalletPanelTitle back button.
-                                        onBackClick: accountDetailVisible
-                                            ? () => {
-                                                setAccountDetailAddress(null);
-                                                closePanel('NAV_POP:MeritWallet:accountDetailBack');
-                                            }
-                                            : tokenDetailVisible
+    const walletListScreenTitle = useWalletListTitle(nativeWalletId === 'localVault' ? 'Extension' : nativeWalletId === 'serverKeystore' ? 'Web App' : undefined);
+    const panelTitle = messageVisible && confirmTitle
+        ? confirmTitle
+        : stepContentUp && stepTitle
+            ? stepTitle
+            : messageOwnTitle && !stepContentUp
+                ? messageOwnTitle
+                : passwordOverlay
+                    ? passwordMode === 'setup' ? 'Create Account' : 'Account Login'
+                    : approvalOverlay
+                        ? approvalPage.title
+                        : remoteSelection
+                            // 2026-11-07 (owner): "Add Merit <app> Account(s)", the app whose accounts the person is choosing from (this one: the extension's vault, or the web app)
+                            ? `Add Merit ${nativeWalletId === 'localVault' ? 'Extension' : 'Web App'} Account(s)`
+                            : walletListLeafVisible
+                                ? walletListScreenTitle
+                                : createAccountLeafVisible && addMenuVisible && panelTreeListOpen
+                                    // 2026-11-07 (owner): Create a Merit Account is the Account Details screen in add mode
+                                    ? 'Add New Account'
+                                    : addMenuVisible && panelTreeListOpen
+                                        ? `${pillWalletId ? walletName(pillWalletId) : 'Merit Wallet'} Manager`
+                                        : panelTreeVisible
+                                            ? 'Panel Tree'
+                                            : meritInfoVisible
+                                                ? 'About Merit Wallet'
+                                                : accountDetailVisible
+                                                    ? accountDetailTitle ?? 'Account Details'
+                                                    : tokenDetailVisible
+                                                        ? 'Token Details'
+                                                        : networkDetailVisible
+                                                            ? 'Network Details'
+                                                            : activeListMode === 'sellToken' ||
+                                                                activeListMode === 'buyToken' ||
+                                                                activeListMode === 'sendToken'
+                                                                ? 'Select a Token'
+                                                                : activeListMode === 'sendRecipient'
+                                                                    ? 'Select Recipient'
+                                                                    : activeListMode === 'account'
+                                                                        ? 'Active Account Selection'
+                                                                        : activeListMode === 'network'
+                                                                            ? 'Select Network'
+                                                                            : activeTab === 'SWAP'
+                                                                                ? 'Trading Station'
+                                                                                : activeTab === 'SEND'
+                                                                                    ? 'Send Token'
+                                                                                    : activeTab === 'SPONSOR'
+                                                                                        ? 'Add Sponsorship'
+                                                                                        : activeTab === 'REWARDS'
+                                                                                            ? stakingListVisible
+                                                                                                ? stakingListMode.kind === 'claim' ? `Claim ${stakingListMode.role} Rewards` : 'Unstake Sponsor Rewards'
+                                                                                                : 'Rewards Management'
+                                                                                            : 'Wallet Config';
+    // 2026-11-09 (owner design): the refresh tree of this wallet (refresh/refreshTree.ts); every screen's loaded data is a node in it
+    const refreshTreeRef = useRef(undefined);
+    if (!refreshTreeRef.current)
+        refreshTreeRef.current = createRefreshTree();
+    const refreshTree = refreshTreeRef.current;
+    // 2026-11-09 (owner): the Refresh button stays disabled until the tree has finished, not only while the host's own step runs: the token changed and the tree has not reported done yet means busy (no gap between the two)
+    const [treeDoneToken, setTreeDoneToken] = useState(refreshToken ?? 0);
+    const imageCacheValue = useMemo(() => ({ caches: iconCachesRef.current, baseUrl: baseUrl ?? '' }), [baseUrl]);
+    const refreshBusy = !!refreshing || (refreshToken ?? 0) !== treeDoneToken;
+    return (_jsx(ImageCacheContext.Provider, { value: imageCacheValue, children: _jsx(RefreshTreeProvider, { tree: refreshTree, refreshToken: refreshToken ?? 0, onDone: setTreeDoneToken, children: _jsx(WalletBalanceContext.Provider, { value: walletBalanceValue, children: _jsx(WalletConnectProvider, { hasAccount: !!String(activeAccountAddress ?? '').trim(), openAccountList: () => setActiveList('account'), children: _jsx(ActiveAccountProfileContext.Provider, { value: activeAccountEntry ? { address: activeAccountEntry.address, name: activeAccountEntry.name, symbol: activeAccountEntry.symbol, logoURL: activeAccountEntry.iconSrc } : undefined, children: _jsxs("div", { className: walletFrameClassName, style: walletFrameStyle.frame(fullWidth, docked), children: [_jsx("style", { children: walletFrameCss }), passwordPanelShowing && (_jsx(PanelGate, { panel: SP_COIN_DISPLAY.LOGIN_HEADER, lazyLoad: false, children: _jsx(LoginHeader, { title: recoveryPhrase || passwordMode === 'setup' ? 'Create Merit Wallet Account' : 'Merit Wallet Login', onClose: onClose, appType: appType, wwwIconSrc: wwwIconSrc, closeIconSrc: closeIconSrc }) })), !passwordPanelShowing && (_jsx(PanelGate, { panel: SP_COIN_DISPLAY.WALLET_NETWORK_HEADER, lazyLoad: false, children: _jsx(WalletNetworkHeader, { mode: "normal", leftSlot: _jsx(NetworkSelectDropDown, { label: activeNetworkRow?.name, symbol: activeChainInfo?.symbol ?? activeNetworkRow?.symbol, name: activeChainInfo?.name ?? activeNetworkRow?.name, id: activeNetworkRow?.id, 
+                                            // 2026-09-16, on live report ("the NetworkSelectDropDown is
+                                            // not showing the network icon in the WALLET_NETWORK_HEADER")
+                                            // — activeNetworkRow.iconSrc was already real (same value the
+                                            // Select Network list's own rows resolve their icon from
+                                            // below), this render site just never turned it into an
+                                            // <img> and passed it into NetworkSelectDropDown's own icon
+                                            // slot — same conversion the network-list rows already do.
+                                            icon: activeNetworkRow?.iconSrc
+                                                ? React.createElement('img', {
+                                                    src: activeNetworkRow.iconSrc,
+                                                    alt: '',
+                                                    style: fitImageStyle,
+                                                })
+                                                : undefined, onSelectClick: () => toggleList('network'), onIconClick: activeNetworkRow
                                                 ? () => {
-                                                    setTokenDetailAddress(null);
-                                                    closePanel('NAV_POP:MeritWallet:tokenDetailBack');
+                                                    openNetworkDetail(activeNetworkRow.id);
+                                                    onNetworkIconClick?.(activeNetworkRow.id);
                                                 }
-                                                : networkDetailVisible
-                                                    ? () => {
-                                                        setNetworkDetailId(null);
-                                                        closePanel('NAV_POP:MeritWallet:networkDetailBack');
-                                                    }
-                                                    : addFlowTop != null
-                                                        ? () => closePanel(addFlowTop, 'NAV_POP:MeritWallet:addFlowBack')
-                                                        : activeListMode
-                                                            ? () => setActiveList(null)
-                                                            : () => closePanel('MeritWallet:back') }) })), _jsxs(MenuTabHeaderBar, { open: menuTabHeaderVisible && !passwordPanelShowing, activeTab: activeTab, onTabClick: handleTabClick, children: [showWalletSelect && !passwordPanelShowing && panelTreeListOpen && (addMenuVisible || walletListVisible) && !walletListLeafVisible && (_jsx("div", { id: "WALLET_SELECT_ROW", style: { padding: '6px 10px', display: 'flex', alignItems: 'center' }, children: _jsx(WalletSelectDropDownHosted, { walletId: pillWalletId, displayName: pillWalletId ? walletName(pillWalletId) : undefined, baseUrl: walletAssetBaseUrl }) })), _jsx(WalletRadioPanels, { overlayHost: overlayHost, children: body })] })] }), _jsx(WalletSessionDialogs, { dialog: sessionDialog, onClose: () => setSessionDialog(null), session: walletSession }), !overlayHost && !passwordPanelShowing && (stakingHost ? _jsx(ConnectedSponsorStakingList, { host: stakingHost }) : _jsx(SponsorStakingListPanel, { recipients: [], stakeInfoByAddress: {}, decimals: 18, loading: false })), SHOW_BUILD_MARKERS && (_jsxs("div", { style: {
-                                position: 'absolute',
-                                bottom: 2,
-                                left: 6,
-                                zIndex: 999999,
-                                font: '9px monospace',
-                                color: walletColors.slateMid,
-                                pointerEvents: 'none',
-                            }, children: ["\u27E8@sponsorcoin/merit-wallet/MeritWallet.tsx \u00B7 build ", PACKAGE_BUILD, "\u27E9"] }))] }) }) }) }));
+                                                : undefined, chevronUp: activeListMode === 'network' || activeChild === SP_COIN_DISPLAY.NETWORK_LIST }), titleBadgeSrc: titleBadgeSrc, extraActions: _jsx(DebugBugButton, {}), onRefresh: onRefresh, refreshing: refreshBusy, onClose: onClose, appType: appType, wwwIconSrc: wwwIconSrc, closeIconSrc: closeIconSrc }) })), !passwordPanelShowing && (_jsx(PanelGate, { panel: SP_COIN_DISPLAY.WALLET_ACCOUNT_HEADER, lazyLoad: false, children: _jsx(WalletAccountHeader, { icon: activeAccountEntry?.icon, address: activeAccountEntry?.address, symbol: activeAccountEntry?.symbol, name: activeAccountEntry?.name, placeholderLabel: "Select Account", onSelectClick: () => toggleList('account'), onIconClick: (address) => {
+                                            if (!address)
+                                                return;
+                                            openAccountDetail(address);
+                                            onAccountIconClick?.(address);
+                                        }, 
+                                        // 2026-11-11 (owner): a right click on the avatar opens ACCOUNT_PANEL too, through AccountSelectDropDown
+                                        onIconContextMenu: (address) => { if (address)
+                                            openAccountDetail(address); }, walletName: activeWalletName }) })), !passwordPanelShowing && (_jsx(AgentHeaderPanel, { agentName: agentAccount?.name, children: _jsx(ConnectedAgentSelectDropDown, {}) })), _jsxs("div", { style: walletFrameStyle.body, children: [!passwordPanelShowing && (_jsx(PanelGate, { panel: SP_COIN_DISPLAY.PANEL_TITLE, lazyLoad: false, children: _jsx(PanelTitle, { title: panelTitle, onMenuClick: handleMenuClick, menuOpen: menuTabHeaderVisible, 
+                                                // 2026-10-03, on request — on the Account Login / Create Account
+                                                // screen the title bar shows only its title: no back button (nothing
+                                                // to go back to while locked) and no hamburger menu.
+                                                hideBackButton: passwordPanelShowing, hideMenuButton: passwordPanelShowing, 
+                                                // 2026-09-15 — the back arrow already existed (inert, no
+                                                // onBackClick ever passed); now real whenever a list overlay is
+                                                // open, closing it back to the tab it was opened from.
+                                                // 2026-10-05, task 11c (live report: back arrow did nothing
+                                                // with SPONSORSHIP_PANEL open — no detail overlay was open,
+                                                // so this was `undefined` and the click was inert) — final
+                                                // fallback is now the real panel-tree pop-top: closePanel's
+                                                // legacy string-first overload pops the top IS_STACK_COMPONENT
+                                                // off displayStack, hides it (NAV_CLOSE: invoker →
+                                                // radio-restore-on-pop) and re-opens whatever is next on the
+                                                // stack (usePanelTree.ts's closePanel pop-top branch). No-ops
+                                                // safely when the stack is empty. Same call shape as the web
+                                                // app's own ActiveWalletPanelTitle back button.
+                                                onBackClick: approvalOverlay
+                                                    ? approvalPage.onCancel
+                                                    : remoteSelection
+                                                        ? remoteSelection.onCancel
+                                                        : accountDetailVisible
+                                                            ? () => {
+                                                                setAccountDetailAddress(null);
+                                                                closePanel('NAV_POP:MeritWallet:accountDetailBack');
+                                                            }
+                                                            : tokenDetailVisible
+                                                                ? () => {
+                                                                    if (previewToken)
+                                                                        setPreviewTokenContract(undefined);
+                                                                    closePanel('NAV_POP:MeritWallet:tokenDetailBack');
+                                                                }
+                                                                : networkDetailVisible
+                                                                    ? () => {
+                                                                        setNetworkDetailId(null);
+                                                                        closePanel('NAV_POP:MeritWallet:networkDetailBack');
+                                                                    }
+                                                                    : addFlowTop != null
+                                                                        ? () => closePanel(addFlowTop, 'NAV_POP:MeritWallet:addFlowBack')
+                                                                        // 2026-10-28, real bug fix (live report, Test page:
+                                                                        // "the down chevron points up" after Back from the
+                                                                        // Sponsor tab's recipient list, and never reverts) —
+                                                                        // activeListMode is null for a list opened directly
+                                                                        // through openActiveListPanel rather than this
+                                                                        // component's own setActiveList (RecipientSelectDropDown.tsx's
+                                                                        // REMOTE_ACCOUNT_RECIPIENT_LIST among them — it only ever
+                                                                        // recognizes its own 'account'/'network' fallback modes,
+                                                                        // see this file's own activeListMode derivation comment),
+                                                                        // so Back fell through to the generic stack-pop below,
+                                                                        // which never calls closeActiveListPanel — the list's
+                                                                        // flags stayed stuck true, and the chevron (which reads
+                                                                        // REMOTE_ACCOUNT_RECIPIENT_LIST's own visibility) stayed
+                                                                        // pointing up forever. activeChild (useActiveListPanelChild,
+                                                                        // already this file's own single source of truth
+                                                                        // elsewhere) covers all six ACTIVE_LIST_PANEL_MODES
+                                                                        // members, not just two — same close action already
+                                                                        // proven correct for account/network.
+                                                                        : activeListMode || activeChild != null
+                                                                            ? () => setActiveList(null)
+                                                                            : () => closePanel('MeritWallet:back') }) })), _jsxs(MenuTabHeaderBar, { open: menuTabHeaderVisible && !passwordPanelShowing, activeTab: highlightedTab, onTabClick: handleTabClick, children: [showWalletSelect && !remoteSelection && !passwordPanelShowing && panelTreeListOpen && walletListVisible && !addMenuVisible && !walletListLeafVisible && (_jsx("div", { id: "WALLET_SELECT_ROW", style: walletFrameStyle.walletSelectRow, children: _jsx(WalletSelectDropDownHosted, { walletId: pillWalletId, displayName: pillWalletId ? walletName(pillWalletId) : undefined, baseUrl: walletAssetBaseUrl }) })), _jsxs(WalletRadioPanels, { children: [bodyWithTab, stakingListNode] })] })] }), _jsx(WalletSessionDialogs, { dialog: sessionDialog, onClose: () => setSessionDialog(null), session: walletSession })] }) }) }) }) }) }));
 }
 let warnedNoAccountSource = false;
 /**
  * The component. A host that passes `wallet` gets the lock screen, the lock button, the authentication type and the Wallet Security section from it (src/wallet/walletProps.tsx); everything else, and every
  * prop the host passes explicitly, is unchanged.
  */
-export default function MeritWallet(props) {
+function MeritWalletWired(props) {
     const platform = props.platform ?? domPlatform;
     // 2026-10-15 (docs/design/spcoinPackagesDesign.txt 8.5.7 item 4): a host must say where its accounts come from (a wallet, its own account groups, or a chain to self-fetch for). A host that says none gets the component's SAMPLE accounts and tokens, which is
     // never what a deployment wants, so it is reported loudly, once, instead of shipping silently.
@@ -1710,14 +2212,120 @@ export default function MeritWallet(props) {
         }
     }, [props.wallet, props.accountGroups, props.chainId]);
     const derived = useWalletDerivedProps(props.wallet, props.activeAccountAddress, props.walletDerives);
-    const wantsAccounts = !!props.approverHost && (props.walletDerives ?? ALL_WALLET_DERIVATIONS).includes('accounts');
-    const approvers = useApproverAccounts(wantsAccounts ? props.wallet : undefined, props.approverHost, props.activeAccountAddress, platform);
+    const peerStates = usePeerStates(props.peers);
+    // the host's connection hooks (props.walletLinkHooks): a constant object, so the hooks run in the same order every render
+    const walletLinks = {};
+    /* eslint-disable react-hooks/rules-of-hooks */
+    for (const [id, useLink] of Object.entries(props.walletLinkHooks ?? {}))
+        walletLinks[id] = useLink();
+    /* eslint-enable react-hooks/rules-of-hooks */
+    // 2026-11-07 (owner: Connected must come from the remote, not from the click): while a Connect of a remote wallet waits for the person's answer THERE, its badge stays Disconnected, whatever the link flag says meanwhile
+    const [connectingWallets, setConnectingWallets] = React.useState({});
+    // 2026-11-07 (owner, rules W4): the wallets CHECKED on the wallet list are the groups on the Active Account Selection page
+    const listedWallets = useWalletListed();
+    const listedKey = JSON.stringify(listedWallets);
+    for (const id of Object.keys(walletLinks))
+        if (connectingWallets[id])
+            walletLinks[id] = false;
+    const walletLinksKey = JSON.stringify(walletLinks);
+    // read at click time, so a host that rebuilds these each render does not rebuild the approver list
+    const approversRef = React.useRef(undefined);
+    const addHostRef = React.useRef(undefined);
+    const { openPanel: openWalletListPanel } = usePanelTree();
+    // the running app's own "Add Account(s)": the Add menu (Add Wallet Authenticator or Account)
+    const openAddMenu = useCallback(() => {
+        openWalletListPanel(SP_COIN_DISPLAY.ADD_WALLET_ACCOUNT, 'MeritWallet:addAccounts:addMenu');
+    }, [openWalletListPanel]);
+    // 2026-11-12 (owner): the drop-down's choices open their screen directly (the Add menu is gone); the Add screens are leaves of ADD_WALLET_ACCOUNT, which stays under them
+    const openAddLeaf = useCallback((leaf) => {
+        openWalletListPanel(SP_COIN_DISPLAY.ADD_WALLET_ACCOUNT, 'MeritWallet:addAccounts:leaf');
+        openWalletListPanel(leaf === 'createAccount' ? SP_COIN_DISPLAY.CREATE_ACCOUNT : leaf === 'importAccount' ? SP_COIN_DISPLAY.IMPORT_AN_ACCOUNT : SP_COIN_DISPLAY.IMPORT_A_WALLET, 'MeritWallet:addAccounts:leaf');
+    }, [openWalletListPanel]);
+    const approverHost = useMemo(() => {
+        if (!props.approverHost)
+            return props.approverHost;
+        const withList = {
+            ...props.approverHost,
+            openAddMenu: props.approverHost.openAddMenu ?? openAddMenu,
+            openAddLeaf: props.approverHost.openAddLeaf ?? openAddLeaf,
+            walletLink: (id) => (id in walletLinks ? walletLinks[id] : props.approverHost.walletLink?.(id)),
+            isListed: (id) => {
+                const slug = Object.keys(WALLET_SLUG_ID).find((s) => WALLET_SLUG_ID[s] === id);
+                return slug && id !== (props.nativeWalletId ?? props.approverHost.nativeWalletId) ? !!listedWallets[slug] : undefined;
+            },
+            // 2026-11-07 (rules G4, G6): the OTHER Merit wallet's group badge connects and disconnects it exactly as the wallet list does
+            walletConnect: (id) => {
+                const addHost = addHostRef.current;
+                if (!addHost || id === (props.nativeWalletId ?? props.approverHost.nativeWalletId))
+                    return undefined;
+                // 2026-11-07 (owner, rules W5): what the wallet list's Connect used to do now happens here. Every call is made in the click itself (a browser lets a page open another wallet's window, or its device chooser, only in answer to one).
+                // MetaMask: the wallet-level connect (no account becomes active, no screen changes)
+                if (id === WALLET_SLUG_ID.metamask && addHost.connectWallet)
+                    return addHost.connectWallet('metamask');
+                // a hardware wallet: its device chooser (Chrome's "wants to connect to a HID device")
+                if (id.startsWith('hardware:')) {
+                    if (addHost.connectHardwareDevice)
+                        return addHost.connectHardwareDevice(id);
+                    return addHost.connectApprover?.('connectHardware');
+                }
+                if (!addHost.connectApprover)
+                    return undefined;
+                const entry = id === WALLET_SLUG_ID.meritExtension ? 'connectMeritExtension' : id === WALLET_SLUG_ID.merit ? 'connectMeritWeb' : undefined;
+                if (!entry)
+                    return undefined;
+                if (entry === 'connectMeritExtension')
+                    addHost.bringWalletForward?.('connectMeritExtension');
+                setConnectingWallets((c) => ({ ...c, [id]: true }));
+                return Promise.resolve(addHost.connectApprover(entry))
+                    // the person cancelled (or it failed) there: the link flag a connect sets on the way is undone, the wallet was never connected
+                    .catch((error) => { props.peers?.[id]?.detach(); throw error; })
+                    .finally(() => setConnectingWallets((c) => ({ ...c, [id]: false })));
+            },
+            walletDisconnect: (id) => {
+                const peer = props.peers?.[id];
+                if (!peer || id === (props.nativeWalletId ?? props.approverHost.nativeWalletId))
+                    return undefined;
+                peer.detach();
+                // a peer this wallet has no backend for (the extension's Merit (Web App)) has no permission to revoke: the link flag is the whole disconnect
+                return props.wallet?.backend(id) ? approversRef.current?.controller?.disconnect(id) ?? Promise.resolve() : Promise.resolve();
+            },
+        };
+        return props.peers
+            ? {
+                ...withList,
+                isConnected: (id) => (id in peerStates ? peerStates[id].connected : props.approverHost.isConnected?.(id)),
+            }
+            : withList;
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- walletLinks is rebuilt every render; walletLinksKey is its value
+    [props.approverHost, props.peers, props.wallet, props.nativeWalletId, peerStates, openAddMenu, openAddLeaf, walletLinksKey, listedKey]);
+    const wantsAccounts = !!approverHost && (props.walletDerives ?? ALL_WALLET_DERIVATIONS).includes('accounts');
+    const approvers = useApproverAccounts(wantsAccounts ? props.wallet : undefined, approverHost, props.activeAccountAddress, platform);
+    approversRef.current = approvers;
+    // 2026-11-08 (owner): a failed connect is a MESSAGE_PANEL error (source, error, wallet), not a banner over the account list
+    const { setErrorMessage: setApproverError } = useExchangeContext();
+    const { openPanel: openApproverPanel } = usePanelTree();
+    useEffect(() => {
+        if (!approvers.notice)
+            return;
+        const wallet = approvers.noticeWalletId ? walletName(approvers.noticeWalletId) : undefined;
+        // 2026-11-12 (owner): "<wallet> is not installed in this browser" carries an Install button: the host's install page for that wallet, else the wallet's own download page (MetaMask)
+        const missingId = approvers.noticeWalletId;
+        const installUrl = missingId && /is not installed/i.test(approvers.notice) ? (approverHost?.installUrl?.(missingId) ?? (/metamask/i.test(missingId) ? 'https://metamask.io/download/' : undefined)) : undefined;
+        setApproverError({ errCode: 0, msg: approvers.notice + (wallet ? String.fromCharCode(10) + 'Wallet: ' + wallet : ''), source: 'Active Account Selection', status: STATUS.MESSAGE_ERROR, ...(installUrl ? { installUrl, installLabel: `Install ${wallet ?? 'wallet'}` } : {}) });
+        openApproverPanel(SP_COIN_DISPLAY.MESSAGE_PANEL, 'MeritWallet:approverNotice');
+        approvers.clearNotice();
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- fires on a new notice only
+    }, [approvers.notice]);
+    addHostRef.current = props.addAccountHost;
+    // 2026-11-06 (owner): the other wallet took accounts out of this wallet's list: a MESSAGE_PANEL popup with the accounts' icons
+    useAccountNoticeMessagePanel(approverHost?.describeAccount);
     const accountDerived = approvers.groups
         ? {
             accountGroups: approvers.groups,
-            accountListNotice: approvers.notice || undefined,
             onAccountRowSelect: async (accountId, groupId) => {
                 const approverId = (groupId ?? (props.wallet ? props.wallet.backendIdFor(accountId) : undefined));
+                engineTrace('MeritWallet:onAccountRowSelect', { accountId, groupId, approverId, stack: String(new Error().stack ?? '').split(String.fromCharCode(10)).slice(2, 7).join(' | ') });
                 if (!approverId || !approvers.controller)
                     return false;
                 return approvers.controller.connect(approverId, accountId);
@@ -1729,14 +2337,28 @@ export default function MeritWallet(props) {
     const activeWalletName = activeWalletId && props.wallet ? props.wallet.backend(activeWalletId)?.name : undefined;
     const nativeWalletId = props.nativeWalletId ?? props.approverHost?.nativeWalletId;
     // the wallet list's Connected / Disconnected buttons, from the approver list (a wallet is connected when the host says so or the connected-only list holds it)
-    const connectionOfWallet = { merit: 'serverKeystore', meritExtension: 'injected:org.sponsorcoin.merit', metamask: 'injected:io.metamask', ledger: 'hardware:ledger', trezor: 'hardware:trezor' };
+    const connectionOfWallet = WALLET_SLUG_ID;
     const derivedConnection = approvers.groups
         ? {
-            walletConnection: props.walletConnection ?? Object.fromEntries(Object.entries(connectionOfWallet).map(([slug, id]) => [slug, props.approverHost?.isConnected?.(id) ?? approvers.groups.some((g) => g.id === id)])),
-            onDisconnectWallet: props.onDisconnectWallet ?? ((slug) => { const id = connectionOfWallet[slug]; if (id)
-                void approvers.controller?.disconnect(id); }),
+            walletConnection: props.walletConnection ?? Object.fromEntries(Object.entries(connectionOfWallet).map(([slug, id]) => [slug, approverHost?.isConnected?.(id) ?? approvers.groups.some((g) => g.id === id)])),
+            onDisconnectWallet: props.onDisconnectWallet ?? (async (slug) => { const id = connectionOfWallet[slug]; if (id) {
+                const peer = props.peers?.[id];
+                peer?.detach(); /* a peer this wallet has no backend for (the extension's Merit (Web App)) has no permission to revoke: the link flag is the whole disconnect */
+                if (!peer || props.wallet?.backend(id))
+                    await approvers.controller?.disconnect(id);
+            } }),
         }
         : {};
     const merged = props.wallet ? { ...mergeWalletProps(props, { ...derived, activeWalletName }, props.wallet, props.activeAccountAddress), activeWalletId: props.activeWalletId ?? activeWalletId, nativeWalletId, ...accountDerived, ...derivedConnection } : { ...props, nativeWalletId };
     return React.createElement(MeritPlatformContext.Provider, { value: platform }, React.createElement(MeritWalletInner, merged));
 }
+/**
+ * The component. First-run setup replaces the wallet (a different component type, so the wallet's own state starts fresh when setup ends, the same as when the host used to swap it out);
+ * otherwise the wired wallet. The setup screen runs inside the same platform context (clipboard) as the wallet.
+ */
+export default function MeritWallet(props) {
+    if (props.onboarding) {
+        return React.createElement(MeritPlatformContext.Provider, { value: props.platform ?? domPlatform }, React.createElement(WalletOnboardingPanel, props.onboarding));
+    }
+    return React.createElement(MeritWalletWired, props);
+}