diff --git a/app.config.ts b/app.config.ts
index 02e585e49..eac8d4173 100644
--- a/app.config.ts
+++ b/app.config.ts
@@ -209,10 +209,10 @@ export default ({ config }: ConfigContext): ExpoConfig => ({
       'expo-build-properties',
       {
         ios: {
-          // 16.0 is the floor declared by OnramperReactNative.podspec
-          // (@onramper/onramper-react-native). CocoaPods fails resolution if the
-          // app target is lower, so this cannot go back below 16.0 while that
-          // dependency is installed.
+          // Was raised to 16.0 for OnramperReactNative's podspec floor. That
+          // package is gone, but the target is left where it is: lowering it is
+          // a product decision about which iOS versions we support, not a
+          // consequence of dropping a dependency.
           deploymentTarget: '16.0',
           useFrameworks: 'static',
           // Static frameworks with precompiled RN core have been flaky in EAS iOS builds.
@@ -306,13 +306,11 @@ export default ({ config }: ConfigContext): ExpoConfig => ({
     // does not fail. See plugins/withMlkitVisionDependencies.js.
     './plugins/withMlkitVisionDependencies.js',
     // Sets SWIFT_ENABLE_EXPLICIT_MODULES=NO so the Swift pods (NitroModules,
-    // OnramperReactNative) don't fail the app target's "Emit Swift module" phase
-    // on Xcode 16+. Referenced by file path, not as '@onramper/onramper-react-native':
-    // the package ships app.plugin.js but omits it from its package.json "exports"
-    // map, so resolving it as a package subpath fails with
-    // ERR_PACKAGE_PATH_NOT_EXPORTED. Switch to the bare package name once
-    // onramper fixes that upstream.
-    './node_modules/@onramper/onramper-react-native/app.plugin.js',
+    // RCTSwiftUI) don't fail the app target's "Emit Swift module" phase on
+    // Xcode 16+. Vendored from @onramper/onramper-react-native's own plugin
+    // when that package was removed — the fix was never Onramper-specific, and
+    // NitroModules is still here via react-native-mmkv.
+    './plugins/withSwiftExplicitModulesDisabled.js',
   ],
   experiments: {
     typedRoutes: true,
diff --git a/app/(protected)/(tabs)/savings.tsx b/app/(protected)/(tabs)/savings.tsx
index 3b8cadae4..7ff1b30e5 100644
--- a/app/(protected)/(tabs)/savings.tsx
+++ b/app/(protected)/(tabs)/savings.tsx
@@ -171,11 +171,11 @@ function LegacySavings() {
             />
             <DepositTrigger
               buttonText="Deposit"
-              modal={DEPOSIT_MODAL.OPEN_SAVINGS_FUND}
+              modal={DEPOSIT_MODAL.OPEN_FORM}
               preserveSelectedVault
               source="savings_header"
               onBeforeOpen={() => {
-                useDepositStore.getState().setDepositFromSolid(false);
+                useDepositStore.getState().setDepositFromSolid(true);
               }}
             />
           </View>
diff --git a/app/(protected)/(tabs)/stocks/index.tsx b/app/(protected)/(tabs)/stocks/index.tsx
index b9dbbd70c..e6ca74f0a 100644
--- a/app/(protected)/(tabs)/stocks/index.tsx
+++ b/app/(protected)/(tabs)/stocks/index.tsx
@@ -1,22 +1,23 @@
-import React, { useRef, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { ScrollView, View } from 'react-native';
-import { Redirect } from 'expo-router';
+import { Redirect, router, useLocalSearchParams } from 'expo-router';
 
 import PageLayout from '@/components/PageLayout';
 import BuyStockModal from '@/components/Stocks/BuyStockModal';
 import SellStockModal from '@/components/Stocks/SellStockModal';
 import { Holding, STOCKS } from '@/components/Stocks/stocksData';
 import StocksDiscoverSection from '@/components/Stocks/StocksDiscoverSection';
-import { XStockToken } from '@/hooks/useXStocksTokens';
 import StocksEmptyHoldings from '@/components/Stocks/StocksEmptyHoldings';
 import StocksHoldingsList from '@/components/Stocks/StocksHoldingsList';
 import StocksPendingStrip from '@/components/Stocks/StocksPendingStrip';
 import StocksPortfolioCard from '@/components/Stocks/StocksPortfolioCard';
 import { Text } from '@/components/ui/text';
 import { path } from '@/constants/path';
+import { XSTOCKS_TOKENS } from '@/constants/xstocksTokens';
 import { useDimension } from '@/hooks/useDimension';
 import { useXStockHoldings } from '@/hooks/useXStockHoldings';
 import { useXStockPrices } from '@/hooks/useXStockPrices';
+import { XStockToken } from '@/hooks/useXStocksTokens';
 import { isProduction } from '@/lib/config';
 
 // Stocks is an in-development feature: not accessible in production builds.
@@ -33,7 +34,7 @@ function StocksPageContent() {
   const { isScreenMedium } = useDimension();
   const scrollRef = useRef<ScrollView>(null);
 
-  const { holdings } = useXStockHoldings();
+  const { holdings, isLoading: isHoldingsLoading } = useXStockHoldings();
   const hasHoldings = holdings.length > 0;
   const holdingTickers = holdings.map(h => h.ticker);
   const holdingPrices = useXStockPrices(holdingTickers);
@@ -45,33 +46,106 @@ function StocksPageContent() {
   const [buyModalOpen, setBuyModalOpen] = useState(false);
   const [sellModalOpen, setSellModalOpen] = useState(false);
   const [selectedHolding, setSelectedHolding] = useState<Holding | null>(null);
+  // Which stock the buy flow should open on. Null means "let the user pick".
+  const [buyToken, setBuyToken] = useState<XStockToken | null>(null);
+  // True when the buy flow was opened by a deep link rather than by browsing
+  // this screen — leaving it should return the user where they came from
+  // instead of stranding them on a Stocks tab they never chose to open.
+  const [cameFromDeepLink, setCameFromDeepLink] = useState(false);
+
+  // Open a trade straight from a `/stocks?ticker=TSLAx&action=sell` deep link
+  // (the Earn page uses it), then clear the params so closing the modal doesn't
+  // leave a link that reopens it on the next visit.
+  const { ticker: tickerParam, action: actionParam } = useLocalSearchParams<{
+    ticker?: string;
+    action?: string;
+  }>();
+
+  useEffect(() => {
+    if (!tickerParam) return;
+
+    const clearParams = () => router.setParams({ ticker: undefined, action: undefined });
+
+    if (actionParam === 'sell') {
+      const holding = holdings.find(h => h.ticker === tickerParam);
+
+      // Holdings are read from chain and arrive after this screen mounts, so
+      // the params are held until they land rather than dropped on the floor.
+      if (!holding) {
+        if (!isHoldingsLoading) clearParams();
+        return;
+      }
+
+      setSelectedHolding(holding);
+      setSellModalOpen(true);
+      setCameFromDeepLink(true);
+      clearParams();
+      return;
+    }
+
+    const token = XSTOCKS_TOKENS.find(t => t.symbol === tickerParam);
+    if (token) {
+      setBuyToken(token);
+      setBuyModalOpen(true);
+      setCameFromDeepLink(true);
+    }
+    clearParams();
+  }, [tickerParam, actionParam, holdings, isHoldingsLoading]);
 
   function handleBuyPress() {
+    setBuyToken(null);
+    setCameFromDeepLink(false);
     setBuyModalOpen(true);
   }
 
   function handleSellPress() {
     if (holdings.length > 0) {
       setSelectedHolding(holdings[0]);
+      setCameFromDeepLink(false);
       setSellModalOpen(true);
     }
   }
 
-  function handleStockPress(_token: XStockToken) {
+  function handleStockPress(token: XStockToken) {
+    setBuyToken(token);
+    setCameFromDeepLink(false);
     setBuyModalOpen(true);
   }
 
+  // Leaving a deep-linked buy flow returns to the screen that opened it (the
+  // Earn catalog); leaving one started here just closes the modal.
+  function handleBuyClose() {
+    setBuyModalOpen(false);
+    if (cameFromDeepLink && router.canGoBack()) {
+      setCameFromDeepLink(false);
+      router.back();
+    }
+  }
+
   function handleHoldingPress(holding: Holding) {
     setSelectedHolding(holding);
+    setCameFromDeepLink(false);
     setSellModalOpen(true);
   }
 
+  // Same as the buy flow: a deep-linked sale returns to the screen that opened
+  // it rather than stranding the user on a Stocks tab they never chose.
+  function handleSellClose() {
+    setSellModalOpen(false);
+    if (cameFromDeepLink && router.canGoBack()) {
+      setCameFromDeepLink(false);
+      router.back();
+    }
+  }
+
   function scrollToDiscover() {
     scrollRef.current?.scrollToEnd({ animated: true });
   }
 
   const selectedStockPrice = selectedHolding
-    ? (holdingPrices[selectedHolding.ticker] ?? STOCKS.find(s => s.ticker === selectedHolding.ticker)?.price ?? 194.23)
+    ? (holdingPrices[selectedHolding.ticker] ??
+      STOCKS.find(s => s.ticker === selectedHolding.ticker)?.price ??
+      194.23)
     : 194.23;
 
   if (isScreenMedium) {
@@ -86,11 +160,12 @@ function StocksPageContent() {
         onStockPress={handleStockPress}
         onHoldingPress={handleHoldingPress}
         buyModalOpen={buyModalOpen}
+        buyToken={buyToken}
         sellModalOpen={sellModalOpen}
         selectedHolding={selectedHolding}
         selectedStockPrice={selectedStockPrice}
-        onBuyClose={() => setBuyModalOpen(false)}
-        onSellClose={() => setSellModalOpen(false)}
+        onBuyClose={handleBuyClose}
+        onSellClose={handleSellClose}
       />
     );
   }
@@ -140,13 +215,22 @@ function StocksPageContent() {
       </ScrollView>
 
       {/* Modals (rendered outside scroll) */}
-      <BuyStockModal isOpen={buyModalOpen} onClose={() => setBuyModalOpen(false)} trigger={null} />
+      {/* Keyed on the stock so picking a different one re-seeds the flow's
+          initial step instead of reusing the previous selection. */}
+      <BuyStockModal
+        key={buyToken?.symbol ?? 'picker'}
+        isOpen={buyModalOpen}
+        initialToken={buyToken}
+        onClose={handleBuyClose}
+        onExit={handleBuyClose}
+        trigger={null}
+      />
 
       <SellStockModal
         holding={selectedHolding}
         stockPrice={selectedStockPrice}
         isOpen={sellModalOpen}
-        onClose={() => setSellModalOpen(false)}
+        onClose={handleSellClose}
         trigger={null}
       />
     </PageLayout>
@@ -163,6 +247,7 @@ type DesktopLayoutProps = {
   onStockPress: (token: XStockToken) => void;
   onHoldingPress: (holding: Holding) => void;
   buyModalOpen: boolean;
+  buyToken: XStockToken | null;
   sellModalOpen: boolean;
   selectedHolding: Holding | null;
   selectedStockPrice: number;
@@ -180,6 +265,7 @@ function DesktopLayout({
   onStockPress,
   onHoldingPress,
   buyModalOpen,
+  buyToken,
   sellModalOpen,
   selectedHolding,
   selectedStockPrice,
@@ -229,7 +315,14 @@ function DesktopLayout({
         </View>
       </View>
 
-      <BuyStockModal isOpen={buyModalOpen} onClose={onBuyClose} trigger={null} />
+      <BuyStockModal
+        key={buyToken?.symbol ?? 'picker'}
+        isOpen={buyModalOpen}
+        initialToken={buyToken}
+        onClose={onBuyClose}
+        onExit={onBuyClose}
+        trigger={null}
+      />
 
       <SellStockModal
         holding={selectedHolding}
diff --git a/assets/images/earn-eth-icon.png b/assets/images/earn-eth-icon.png
index a9529d309..e0dbc90b4 100644
Binary files a/assets/images/earn-eth-icon.png and b/assets/images/earn-eth-icon.png differ
diff --git a/assets/images/earn-eth-tile-background.png b/assets/images/earn-eth-tile-background.png
new file mode 100644
index 000000000..4a737ed4f
Binary files /dev/null and b/assets/images/earn-eth-tile-background.png differ
diff --git a/assets/images/earn-fuse-icon.png b/assets/images/earn-fuse-icon.png
index 68860e5e6..ff8d29820 100644
Binary files a/assets/images/earn-fuse-icon.png and b/assets/images/earn-fuse-icon.png differ
diff --git a/assets/images/earn-fuse-tile-background.png b/assets/images/earn-fuse-tile-background.png
new file mode 100644
index 000000000..67019c7d7
Binary files /dev/null and b/assets/images/earn-fuse-tile-background.png differ
diff --git a/assets/images/earn-usd-icon.png b/assets/images/earn-usd-icon.png
index 8280743f9..6124f1ec7 100644
Binary files a/assets/images/earn-usd-icon.png and b/assets/images/earn-usd-icon.png differ
diff --git a/assets/images/earn-usd-tile-background.png b/assets/images/earn-usd-tile-background.png
new file mode 100644
index 000000000..111755bf5
Binary files /dev/null and b/assets/images/earn-usd-tile-background.png differ
diff --git a/components/BuyCrypto/OnramperWidget/OnramperWidget.native.tsx b/components/BuyCrypto/OnramperWidget/OnramperWidget.native.tsx
new file mode 100644
index 000000000..c86290832
--- /dev/null
+++ b/components/BuyCrypto/OnramperWidget/OnramperWidget.native.tsx
@@ -0,0 +1,110 @@
+import { useCallback, useState } from 'react';
+import { Pressable, View } from 'react-native';
+import { WebView, type WebViewNavigation } from 'react-native-webview';
+import { openBrowserAsync } from 'expo-web-browser';
+
+import { Text } from '@/components/ui/text';
+import useOnramperWidget from '@/hooks/useOnramperWidget';
+
+import {
+  ONRAMPER_WIDGET_HEIGHT,
+  OnramperWidgetError,
+  OnramperWidgetLoading,
+  type OnramperWidgetProps,
+} from './OnramperWidgetStates';
+
+/**
+ * Our own scheme, which the signed URL names as the success/failure redirect.
+ * Matches `scheme` in app.config.ts and ONRAMPER_APP_SCHEME on the backend.
+ */
+const APP_SCHEME = 'solid://';
+
+/**
+ * Native: Onramper's hosted widget in a WebView.
+ *
+ * `about:blank` and `about:srcdoc` belong in `originWhitelist` because
+ * providers render themselves in nested frames — without them the flow simply
+ * dead-ends part way in, with no error and no callback. `allowsInlineMediaPlayback`
+ * is what lets camera-based KYC draw inline on iOS rather than not at all, and
+ * `mediaCapturePermissionGrantType` answers the WebView's own camera prompt,
+ * which is asked separately from the OS permission.
+ */
+export const OnramperWidget = ({ onOutcome }: OnramperWidgetProps) => {
+  const { data: session, isPending, isError, refetch } = useOnramperWidget();
+  const [isOpeningBrowser, setIsOpeningBrowser] = useState(false);
+
+  /**
+   * Intercept our own scheme rather than letting the WebView try to navigate
+   * to it — it cannot, and the flow would stall on a failed load.
+   */
+  const handleShouldStartLoad = useCallback(
+    (request: WebViewNavigation) => {
+      if (!request.url.startsWith(APP_SCHEME)) return true;
+
+      onOutcome?.(request.url.includes('/failure') ? 'failure' : 'success');
+
+      return false;
+    },
+    [onOutcome],
+  );
+
+  /**
+   * The escape hatch, and not an optional one.
+   *
+   * Google Pay and ACH lean on browser payment APIs a WebView often lacks, and
+   * they fail silently — a button that never appears, a flow that goes nowhere,
+   * no error and no event. Onramper has no visibility once the user is with a
+   * provider, so nothing tells us it happened. The same signed URL in a Custom
+   * Tab or SFSafariViewController has the APIs, and still carries the deep-link
+   * redirects, so the user lands back here.
+   */
+  const openInBrowser = useCallback(async () => {
+    if (!session) return;
+
+    setIsOpeningBrowser(true);
+    try {
+      await openBrowserAsync(session.url);
+    } catch (error) {
+      console.error('Failed to open the Onramper widget in a browser:', error);
+    } finally {
+      setIsOpeningBrowser(false);
+    }
+  }, [session]);
+
+  if (isPending) return <OnramperWidgetLoading />;
+  if (isError || !session) {
+    return <OnramperWidgetError onRetry={() => void refetch()} />;
+  }
+
+  return (
+    <View className="w-full gap-y-3">
+      <View
+        className="w-full overflow-hidden rounded-2xl"
+        style={{ height: ONRAMPER_WIDGET_HEIGHT }}
+      >
+        <WebView
+          source={{ uri: session.url }}
+          originWhitelist={['https://*', 'http://*', 'about:blank', 'about:srcdoc']}
+          allowsInlineMediaPlayback
+          mediaPlaybackRequiresUserAction={false}
+          mediaCapturePermissionGrantType="grant"
+          javaScriptEnabled
+          domStorageEnabled
+          onShouldStartLoadWithRequest={handleShouldStartLoad}
+          style={{ backgroundColor: 'transparent' }}
+        />
+      </View>
+
+      <Pressable
+        className="h-11 items-center justify-center rounded-full"
+        onPress={() => void openInBrowser()}
+        disabled={isOpeningBrowser}
+        accessibilityRole="button"
+      >
+        <Text className="text-sm font-medium text-white/70">Having trouble? Open in browser</Text>
+      </Pressable>
+    </View>
+  );
+};
+
+export default OnramperWidget;
diff --git a/components/BuyCrypto/OnramperWidget/OnramperWidget.tsx b/components/BuyCrypto/OnramperWidget/OnramperWidget.tsx
new file mode 100644
index 000000000..892646c51
--- /dev/null
+++ b/components/BuyCrypto/OnramperWidget/OnramperWidget.tsx
@@ -0,0 +1,3 @@
+// Platform default (bundler/TS): the iframe implementation. Metro resolves
+// OnramperWidget.native.tsx on iOS and Android automatically.
+export { default, OnramperWidget } from './OnramperWidget.web';
diff --git a/components/BuyCrypto/OnramperWidget/OnramperWidget.web.tsx b/components/BuyCrypto/OnramperWidget/OnramperWidget.web.tsx
new file mode 100644
index 000000000..e4560c5d4
--- /dev/null
+++ b/components/BuyCrypto/OnramperWidget/OnramperWidget.web.tsx
@@ -0,0 +1,44 @@
+import useOnramperWidget from '@/hooks/useOnramperWidget';
+
+import {
+  ONRAMPER_WIDGET_HEIGHT,
+  ONRAMPER_WIDGET_WIDTH,
+  OnramperWidgetError,
+  OnramperWidgetLoading,
+  type OnramperWidgetProps,
+} from './OnramperWidgetStates';
+
+/**
+ * Web: Onramper's hosted widget in an iframe.
+ *
+ * The `allow` list is not optional. Camera is what lets a provider capture ID
+ * documents inside the frame, and payment is what lets wallet flows run. A
+ * missing entry raises no error — the step just quietly does nothing, deep
+ * inside a provider's flow where we have no visibility at all.
+ */
+export const OnramperWidget = (_props: OnramperWidgetProps) => {
+  const { data: session, isPending, isError, refetch } = useOnramperWidget();
+
+  if (isPending) return <OnramperWidgetLoading />;
+  if (isError || !session) {
+    return <OnramperWidgetError onRetry={() => void refetch()} />;
+  }
+
+  return (
+    <iframe
+      src={session.url}
+      title="Buy crypto"
+      height={ONRAMPER_WIDGET_HEIGHT}
+      width={ONRAMPER_WIDGET_WIDTH}
+      allow="accelerometer; autoplay; camera; gyroscope; payment"
+      style={{
+        border: 0,
+        borderRadius: 16,
+        maxWidth: '100%',
+        alignSelf: 'center',
+      }}
+    />
+  );
+};
+
+export default OnramperWidget;
diff --git a/components/BuyCrypto/OnramperWidget/OnramperWidgetStates.tsx b/components/BuyCrypto/OnramperWidget/OnramperWidgetStates.tsx
new file mode 100644
index 000000000..114974e55
--- /dev/null
+++ b/components/BuyCrypto/OnramperWidget/OnramperWidgetStates.tsx
@@ -0,0 +1,41 @@
+import { ActivityIndicator, View } from 'react-native';
+
+import { Button } from '@/components/ui/button';
+import { Text } from '@/components/ui/text';
+
+export interface OnramperWidgetProps {
+  /**
+   * Called when a provider redirects back to us, on the platforms that redirect
+   * at all. Advisory only — not every provider honours a redirect, so the
+   * webhook stays the source of truth for whether the buy happened.
+   */
+  onOutcome?: (outcome: 'success' | 'failure') => void;
+}
+
+/** Height Onramper sizes the widget for; the sheet reserves it either way. */
+export const ONRAMPER_WIDGET_HEIGHT = 630;
+export const ONRAMPER_WIDGET_WIDTH = 420;
+
+export const OnramperWidgetLoading = () => (
+  <View className="w-full items-center justify-center" style={{ height: ONRAMPER_WIDGET_HEIGHT }}>
+    <ActivityIndicator color="white" />
+  </View>
+);
+
+/**
+ * Shown when the URL could not be minted at all — a signed-out session, or our
+ * backend refusing. Distinct from a widget that loaded and then failed, which
+ * Onramper reports inside the frame.
+ */
+export const OnramperWidgetError = ({ onRetry }: { onRetry: () => void }) => (
+  <View
+    className="w-full items-center justify-center gap-y-4 px-6"
+    style={{ height: ONRAMPER_WIDGET_HEIGHT }}
+  >
+    <Text className="text-center text-base text-white">Couldn&apos;t start the buy flow.</Text>
+    <Text className="text-center text-sm text-white/60">Check your connection and try again.</Text>
+    <Button variant="brand" className="h-12 rounded-full px-8" onPress={onRetry}>
+      <Text className="text-base font-bold text-black">Try again</Text>
+    </Button>
+  </View>
+);
diff --git a/components/BuyCrypto/Transfi/BuyCryptoFlow.tsx b/components/BuyCrypto/Transfi/BuyCryptoFlow.tsx
index a91b87eef..334f7ebeb 100644
--- a/components/BuyCrypto/Transfi/BuyCryptoFlow.tsx
+++ b/components/BuyCrypto/Transfi/BuyCryptoFlow.tsx
@@ -1,3 +1,4 @@
+import { OnramperWidget } from '@/components/BuyCrypto/OnramperWidget/OnramperWidget';
 import { BuyCryptoNavigationProvider } from '@/components/BuyCrypto/Transfi/BuyCryptoNavigation';
 import { TransfiAmount } from '@/components/BuyCrypto/Transfi/TransfiAmount';
 import { TransfiCurrencySelector } from '@/components/BuyCrypto/Transfi/TransfiCurrencySelector';
@@ -40,6 +41,12 @@ export const BuyCryptoFlowContent = ({
         return <TransfiProfileForm />;
       case DEPOSIT_MODAL.OPEN_BUY_CRYPTO_ERROR.name:
         return <TransfiError />;
+      // Onramper's hosted widget. It lives here rather than in a switch of its
+      // own because this is the generic embed point: the card funding modals
+      // render whatever DepositModal they are handed, so one case reaches all
+      // three of them.
+      case DEPOSIT_MODAL.OPEN_ONRAMPER_WIDGET.name:
+        return <OnramperWidget />;
       default:
         return null;
     }
diff --git a/components/Card/CardDirectDepositModalDesktop.tsx b/components/Card/CardDirectDepositModalDesktop.tsx
index 7635ee917..405dac48c 100644
--- a/components/Card/CardDirectDepositModalDesktop.tsx
+++ b/components/Card/CardDirectDepositModalDesktop.tsx
@@ -34,7 +34,7 @@ import {
   getEmbeddedBuyCryptoTarget,
 } from '@/lib/buyCryptoFlow';
 import { cleanupThirdwebStyles, client, thirdwebTheme, thirdwebWallets } from '@/lib/thirdweb';
-import { DepositModal, RainApplicationStatus } from '@/lib/types';
+import { CardProvider, DepositModal, RainApplicationStatus } from '@/lib/types';
 import { withRefreshToken } from '@/lib/utils';
 import { getAllowedTokensForChain, getVaultDepositConfig } from '@/lib/vaults';
 import { useCardDepositStore } from '@/store/useCardDepositStore';
@@ -230,6 +230,9 @@ export default function CardDirectDepositModal({
     [handleBuyCryptoPress, resetTransfi, setTransfiCurrency],
   );
 
+  // Onramper's hosted widget, rendered inside this modal by the same embedded
+  // navigator the TransFi screens use — so back and the title come from
+  // lib/buyCryptoFlow, not from a step of our own.
   // "Deposit from an external wallet" — connect a crypto wallet, then send.
   const handleConnectWallet = useCallback(async () => {
     try {
@@ -391,6 +394,7 @@ export default function CardDirectDepositModal({
           address={depositAddress}
           symbol={selectedToken}
           chainId={selectedChainId ?? 0}
+          cardProvider={CardProvider.RAIN}
           onChangeNetwork={handleBack}
           onDepositDetected={handleDepositDetected}
         />
diff --git a/components/Card/CardDirectDepositModalMobile.tsx b/components/Card/CardDirectDepositModalMobile.tsx
index 98b3fcb12..9ccd0a20f 100644
--- a/components/Card/CardDirectDepositModalMobile.tsx
+++ b/components/Card/CardDirectDepositModalMobile.tsx
@@ -28,7 +28,7 @@ import {
   getBuyCryptoTitle,
   getEmbeddedBuyCryptoTarget,
 } from '@/lib/buyCryptoFlow';
-import { DepositModal, RainApplicationStatus } from '@/lib/types';
+import { CardProvider, DepositModal, RainApplicationStatus } from '@/lib/types';
 import { withRefreshToken } from '@/lib/utils';
 import { useCardDepositStore } from '@/store/useCardDepositStore';
 import { useDepositStore } from '@/store/useDepositStore';
@@ -208,6 +208,9 @@ export default function CardDirectDepositModalMobile({
     [handleBuyCryptoPress, resetTransfi, setTransfiCurrency],
   );
 
+  // Onramper's hosted widget, rendered inside this modal by the same embedded
+  // navigator the TransFi screens use — so back and the title come from
+  // lib/buyCryptoFlow, not from a step of our own.
   const handleTransferFromWallet = useCallback(() => {
     handleOpenChange(false);
     setDepositModal(CARD_DEPOSIT_MODAL.OPEN_INTERNAL_FORM);
@@ -318,6 +321,7 @@ export default function CardDirectDepositModalMobile({
           address={depositAddress}
           symbol={selectedToken}
           chainId={selectedChainId ?? 0}
+          cardProvider={CardProvider.RAIN}
           onChangeNetwork={handleBack}
           onDepositDetected={handleDepositDetected}
         />
diff --git a/components/Card/CardFund/CardFundDepositAddress.tsx b/components/Card/CardFund/CardFundDepositAddress.tsx
index ae730847c..6f13595ae 100644
--- a/components/Card/CardFund/CardFundDepositAddress.tsx
+++ b/components/Card/CardFund/CardFundDepositAddress.tsx
@@ -14,10 +14,11 @@ import {
 } from '@/components/Card/CardFund/constants';
 import DepositScanningIndicator from '@/components/Card/CardFund/DepositScanningIndicator';
 import CopyToClipboard from '@/components/CopyToClipboard';
+import DepositFeeNotice from '@/components/DepositOption/DepositFeeNotice';
 import { Button } from '@/components/ui/button';
 import { Text } from '@/components/ui/text';
 import { useDetectedDirectDeposit } from '@/hooks/useDetectedDirectDeposit';
-import { DetectedDirectDepositResponse } from '@/lib/types';
+import { CardProvider, DetectedDirectDepositResponse } from '@/lib/types';
 import { eclipseAddress } from '@/lib/utils';
 
 /** Design caps the QR at 259px; below that it tracks the card width. */
@@ -29,6 +30,11 @@ type CardFundDepositAddressProps = {
   address?: string;
   symbol: string;
   chainId: number;
+  /**
+   * The issuer this funding flow is for. It decides which chains the deposit is
+   * charged on, so each modal names its own rather than this screen asking.
+   */
+  cardProvider: CardProvider;
   /** Returns to network selection — the chevron on the network summary row. */
   onChangeNetwork: () => void;
   /**
@@ -43,6 +49,7 @@ const CardFundDepositAddress = ({
   address,
   symbol,
   chainId,
+  cardProvider,
   onChangeNetwork,
   onDepositDetected,
 }: CardFundDepositAddressProps) => {
@@ -126,6 +133,8 @@ const CardFundDepositAddress = ({
         </View>
       </View>
 
+      <DepositFeeNotice product="card" provider={cardProvider} chainId={chainId} symbol={symbol} />
+
       <Pressable
         className="flex-row items-center justify-center gap-x-1 web:hover:opacity-70"
         onPress={() => Linking.openURL(CARD_FUND_LEARN_URL)}
diff --git a/components/Card/CardFund/CardFundOptions.tsx b/components/Card/CardFund/CardFundOptions.tsx
index a9f16ef9f..007ed9d74 100644
--- a/components/Card/CardFund/CardFundOptions.tsx
+++ b/components/Card/CardFund/CardFundOptions.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import { Image } from 'expo-image';
+import { CreditCard } from 'lucide-react-native';
 
 import FundExternalWallet from '@/assets/images/fund-external-wallet';
 import FundMoveSavings from '@/assets/images/fund-move-savings';
@@ -36,6 +37,11 @@ type CardFundOptionsProps = {
    * hide the local-currency rows entirely.
    */
   onLocalCurrencyPress?: (code: string) => void;
+  /**
+   * Opens Onramper's hosted widget. Omit to hide the row — the funding modals
+   * opt in individually, as they do for the local-currency rows.
+   */
+  onBuyCryptoPress?: () => void;
   isExternalWalletLoading?: boolean;
   /**
    * Which groups this issuer offers. Defaults to the full Rain set, so the
@@ -56,6 +62,7 @@ const CardFundOptions = ({
   onExternalWalletPress,
   onUsdPress,
   onLocalCurrencyPress,
+  onBuyCryptoPress,
   isExternalWalletLoading,
   sections = RAIN_CARD_FUND_SECTIONS,
   moveFromSolidCopy = CARD_FUND_MOVE_COPY.rain,
@@ -65,7 +72,7 @@ const CardFundOptions = ({
   // desktop/mobile modals have always hidden these rows.
   const showLocalCurrencies = sections.localCurrencies && !!onLocalCurrencyPress;
   const showCashDeposit = sections.cashDeposit || showLocalCurrencies;
-  const showOther = sections.moveFromSolid || sections.externalWallet;
+  const showOther = sections.moveFromSolid || sections.externalWallet || !!onBuyCryptoPress;
 
   return (
     <View className="gap-y-8">
@@ -132,6 +139,14 @@ const CardFundOptions = ({
               isLoading={isExternalWalletLoading}
             />
           ) : null}
+          {onBuyCryptoPress ? (
+            <CardFundRow
+              icon={<CreditCard color="white" size={22} strokeWidth={1.5} />}
+              title="Buy crypto"
+              subtitle="Card, Apple Pay, Google Pay and more"
+              onPress={onBuyCryptoPress}
+            />
+          ) : null}
         </CardFundGroup>
       ) : null}
 
diff --git a/components/Card/NewCardDetails/CardActionsRow.tsx b/components/Card/NewCardDetails/CardActionsRow.tsx
index 2cc539d7d..f46541e4b 100644
--- a/components/Card/NewCardDetails/CardActionsRow.tsx
+++ b/components/Card/NewCardDetails/CardActionsRow.tsx
@@ -3,7 +3,7 @@ import { ActivityIndicator, Pressable, StyleSheet, View } from 'react-native';
 import { Image } from 'expo-image';
 
 import CardDirectDepositModal from '@/components/Card/CardDirectDepositModal';
-import WirexCardFundModal from '@/components/Card/WirexCardFundModal';
+import DepositOptionModal from '@/components/DepositOption/DepositOptionModal';
 import { Text } from '@/components/ui/text';
 import { useCardProvider } from '@/hooks/useCardProvider';
 import { useWirexThreeDs } from '@/hooks/useWirexThreeDs';
@@ -100,7 +100,11 @@ const CardActionsRow = ({
     <View className="flex-row items-start justify-center">
       {canAddFunds && !canDepositToCard(provider) && (
         <View style={styles.item}>
-          <WirexCardFundModal
+          {/* A Wirex card holds no balance of its own — settlement takes the
+              stablecoin from the Safe — so funding the wallet is funding the
+              card, and they get the wallet deposit flow rather than one of
+              their own. */}
+          <DepositOptionModal
             trigger={
               <CircleAction label="Add funds">
                 <Image
diff --git a/components/Card/NewCardDetails/__tests__/CardActionsRow.test.tsx b/components/Card/NewCardDetails/__tests__/CardActionsRow.test.tsx
index 211876341..c99ccf967 100644
--- a/components/Card/NewCardDetails/__tests__/CardActionsRow.test.tsx
+++ b/components/Card/NewCardDetails/__tests__/CardActionsRow.test.tsx
@@ -15,7 +15,7 @@ jest.mock('@/hooks/useWirexThreeDs', () => ({
   useWirexThreeDs: () => ({ requests: [] }),
 }));
 jest.mock('@/lib/assets', () => ({ getAsset: (asset: string) => asset }));
-jest.mock('@/components/Card/WirexCardFundModal', () => 'WirexCardFundModal');
+jest.mock('@/components/DepositOption/DepositOptionModal', () => 'DepositOptionModal');
 jest.mock('@/components/Card/CardDirectDepositModal', () => 'CardDirectDepositModal');
 jest.mock('@/components/ui/text', () => ({ Text: 'Text' }));
 
@@ -40,20 +40,24 @@ afterEach(() => {
   mockProvider = CardProvider.WIREX;
 });
 
-test('opens Wirex Add funds in the card funding popup instead of a route', () => {
+// A Wirex card holds no balance of its own, so funding the wallet is funding the
+// card — they get the wallet deposit flow, not a card-funding one.
+test('sends Wirex Add funds to the wallet deposit flow', () => {
   const tree = render();
 
-  expect(tree.root.findAllByType('WirexCardFundModal')).toHaveLength(1);
+  expect(tree.root.findAllByType('DepositOptionModal')).toHaveLength(1);
   expect(tree.root.findAllByType('CardDirectDepositModal')).toHaveLength(0);
 
   act(() => tree.unmount());
 });
 
-test('keeps Rain Add funds in its direct-deposit popup', () => {
+// A Rain card is prefunded and separate from the Safe, so it keeps "Fund your
+// card" — the wallet flow would put the money somewhere it cannot be spent from.
+test('keeps Rain Add funds on the card funding flow', () => {
   mockProvider = CardProvider.RAIN;
   const tree = render();
 
-  expect(tree.root.findAllByType('WirexCardFundModal')).toHaveLength(0);
+  expect(tree.root.findAllByType('DepositOptionModal')).toHaveLength(0);
   expect(tree.root.findAllByType('CardDirectDepositModal')).toHaveLength(1);
 
   act(() => tree.unmount());
diff --git a/components/Card/WirexCardFundModal.tsx b/components/Card/WirexCardFundModal.tsx
index f3ae04467..a8b760b23 100644
--- a/components/Card/WirexCardFundModal.tsx
+++ b/components/Card/WirexCardFundModal.tsx
@@ -211,6 +211,9 @@ export default function WirexCardFundModal({
     [handleBuyCryptoPress, resetTransfi, setTransfiCurrency],
   );
 
+  // Onramper's hosted widget, rendered inside this modal by the same embedded
+  // navigator the TransFi screens use — so back and the title come from
+  // lib/buyCryptoFlow, not from a step of our own.
   const handleMoveFromWalletPress = useCallback(() => {
     track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, {
       deposit_method: 'wirex_move_from_wallet',
@@ -359,6 +362,7 @@ export default function WirexCardFundModal({
         address={depositAddress}
         symbol={selectedToken}
         chainId={selectedChainId ?? 0}
+        cardProvider={CardProvider.WIREX}
         onChangeNetwork={handleBack}
         onDepositDetected={handleDepositDetected}
       />
diff --git a/components/DepositOption/DepositCashOptions.tsx b/components/DepositOption/DepositCashOptions.tsx
new file mode 100644
index 000000000..fe5ec7799
--- /dev/null
+++ b/components/DepositOption/DepositCashOptions.tsx
@@ -0,0 +1,164 @@
+import { useMemo, useState } from 'react';
+import { Pressable } from 'react-native';
+import { Image } from 'expo-image';
+import { Minus, Plus } from 'lucide-react-native';
+
+import CardFundGroup from '@/components/Card/CardFund/CardFundGroup';
+import CardFundRow from '@/components/Card/CardFund/CardFundRow';
+import { CARD_FUND_USD_ICON } from '@/components/Card/CardFund/constants';
+import {
+  CARD_FUND_LOCAL_CURRENCIES,
+  getCardFundLocalPaymentMethods,
+} from '@/components/Card/CardFund/localCurrencies';
+import { Text } from '@/components/ui/text';
+import { DEPOSIT_MODAL } from '@/constants/modals';
+import { TRACKING_EVENTS } from '@/constants/tracking-events';
+import { useBuyCryptoEntry } from '@/hooks/useBuyCryptoEntry';
+import { useCardStatus } from '@/hooks/useCardStatus';
+import useGeoCompliance from '@/hooks/useGeoCompliance';
+import { useOnrampAutomation } from '@/hooks/useOnrampAutomation';
+import { useVirtualAccountProvider } from '@/hooks/useVirtualAccountProvider';
+import { track } from '@/lib/analytics';
+import { getAsset } from '@/lib/assets';
+import { RainApplicationStatus } from '@/lib/types';
+import { useDepositStore } from '@/store/useDepositStore';
+import { useTransfiStore } from '@/store/useTransfiStore';
+
+import VirtualAccountApplyDialog from './VirtualAccountDetails/VirtualAccountApplyDialog';
+
+const ICON_SIZE = 36;
+/** Matches the muted row text the "Show more" footer sits beside. */
+const SHOW_MORE_ICON_COLOR = 'rgba(255,255,255,0.7)';
+/**
+ * USD is funded by the virtual account, which only takes ACH and wire. The
+ * local currencies show their committed corridor list (localCurrencies.tsx).
+ */
+const USD_PAYMENT_METHOD_CHIPS = ['ACH', 'Wire'];
+const FEATURED_LOCAL_CURRENCY_CODES = ['EUR', 'BRL', 'BDT', 'PHP'] as const;
+const ADDITIONAL_LOCAL_CURRENCY_CODES = ['MXN'] as const;
+
+/**
+ * How many currencies "Cash" accepts, USD included — the number the chooser's
+ * icon cluster counts down from for its "+N" circle, so the two stay in step
+ * when a corridor is added.
+ */
+export const DEPOSIT_CASH_CURRENCY_COUNT =
+  1 + FEATURED_LOCAL_CURRENCY_CODES.length + ADDITIONAL_LOCAL_CURRENCY_CODES.length;
+
+/** The flags the chooser's "Cash" row shows, in the order this screen lists them. */
+export const DEPOSIT_CASH_CLUSTER_ICONS = [CARD_FUND_USD_ICON, getAsset('images/flag-eur.png')];
+
+/**
+ * "Deposit with cash" — the cash branch of the deposit chooser. USD opens the
+ * virtual account (its own bank details, funded by ACH/wire); every other
+ * currency opens the TransFi onramp preseeded with it.
+ */
+const DepositCashOptions = () => {
+  const setModal = useDepositStore(state => state.setModal);
+  const resetTransfi = useTransfiStore(state => state.reset);
+  const setTransfiCurrency = useTransfiStore(state => state.setFiatCurrency);
+  const [isVirtualAccountApplyOpen, setIsVirtualAccountApplyOpen] = useState(false);
+  const [showAllCurrencies, setShowAllCurrencies] = useState(false);
+  const { data: cardStatus } = useCardStatus();
+  const isRainApproved = cardStatus?.rainApplicationStatus === RainApplicationStatus.APPROVED;
+  const { data: existingAutomation } = useOnrampAutomation(isRainApproved);
+  const { provider: virtualAccountProvider } = useVirtualAccountProvider();
+  const { isBuyCryptoAvailable } = useGeoCompliance();
+  const { handleBuyCryptoPress } = useBuyCryptoEntry();
+
+  const localCurrencies = useMemo(() => {
+    const visibleCodes = showAllCurrencies
+      ? [...FEATURED_LOCAL_CURRENCY_CODES, ...ADDITIONAL_LOCAL_CURRENCY_CODES]
+      : FEATURED_LOCAL_CURRENCY_CODES;
+
+    return visibleCodes
+      .map(code => CARD_FUND_LOCAL_CURRENCIES.find(currency => currency.code === code))
+      .filter((currency): currency is (typeof CARD_FUND_LOCAL_CURRENCIES)[number] => !!currency);
+  }, [showAllCurrencies]);
+
+  const handleUsdPress = () => {
+    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, {
+      deposit_method: 'bank_transfer',
+      provider: virtualAccountProvider,
+    });
+    // A Wirex user has no Rain automation and never will, so the Rain apply
+    // pitch is not their next step — their details screen owns activation for
+    // both rails. The other entry points into this flow already route on the
+    // provider; this one did not, which is how Wirex users reached a "Verify
+    // now" that could only bounce them off the Rain KYC gate.
+    if (virtualAccountProvider === 'wirex' || existingAutomation) {
+      setModal(DEPOSIT_MODAL.OPEN_VIRTUAL_ACCOUNT_DETAILS);
+      return;
+    }
+    setIsVirtualAccountApplyOpen(true);
+  };
+
+  const handleLocalCurrencyPress = (code: string) => {
+    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, {
+      deposit_method: 'buy_crypto',
+      currency: code,
+    });
+    resetTransfi();
+    setTransfiCurrency(code);
+
+    if (!isBuyCryptoAvailable) {
+      setModal(DEPOSIT_MODAL.OPEN_BUY_CRYPTO);
+      return;
+    }
+
+    void handleBuyCryptoPress();
+  };
+
+  return (
+    <>
+      <CardFundGroup>
+        <CardFundRow
+          className="min-h-[93px]"
+          icon={
+            <Image
+              source={CARD_FUND_USD_ICON}
+              style={{ width: ICON_SIZE, height: ICON_SIZE, borderRadius: ICON_SIZE / 2 }}
+              contentFit="cover"
+            />
+          }
+          title="USD"
+          chips={USD_PAYMENT_METHOD_CHIPS}
+          onPress={handleUsdPress}
+        />
+        {localCurrencies.map(currency => (
+          <CardFundRow
+            key={currency.code}
+            className="min-h-[93px]"
+            icon={currency.icon}
+            title={currency.code}
+            chips={getCardFundLocalPaymentMethods(currency.code)}
+            onPress={() => handleLocalCurrencyPress(currency.code)}
+          />
+        ))}
+        {/* Owned here rather than by CardFundGroup's own footer: the toggle also
+            decides which corridors are in the list at all, and so whether their
+            payment methods are fetched. */}
+        <Pressable
+          className="h-[49px] flex-row items-center justify-center gap-x-2 web:hover:bg-card-hover"
+          onPress={() => setShowAllCurrencies(current => !current)}
+        >
+          {showAllCurrencies ? (
+            <Minus color={SHOW_MORE_ICON_COLOR} size={15} />
+          ) : (
+            <Plus color={SHOW_MORE_ICON_COLOR} size={15} />
+          )}
+          <Text className="text-sm font-medium text-white/70">
+            {showAllCurrencies ? 'Show less' : 'Show more'}
+          </Text>
+        </Pressable>
+      </CardFundGroup>
+
+      <VirtualAccountApplyDialog
+        isOpen={isVirtualAccountApplyOpen}
+        onClose={() => setIsVirtualAccountApplyOpen(false)}
+      />
+    </>
+  );
+};
+
+export default DepositCashOptions;
diff --git a/components/DepositOption/DepositCryptoOptions.tsx b/components/DepositOption/DepositCryptoOptions.tsx
new file mode 100644
index 000000000..01c9ae9b6
--- /dev/null
+++ b/components/DepositOption/DepositCryptoOptions.tsx
@@ -0,0 +1,71 @@
+import { View } from 'react-native';
+
+import FundExternalWallet from '@/assets/images/fund-external-wallet';
+import HomeQR from '@/assets/images/home-qr';
+import CardFundGroup from '@/components/Card/CardFund/CardFundGroup';
+import CardFundRow from '@/components/Card/CardFund/CardFundRow';
+import { DEPOSIT_MODAL } from '@/constants/modals';
+import { TRACKING_EVENTS } from '@/constants/tracking-events';
+import { useDimension } from '@/hooks/useDimension';
+import { track } from '@/lib/analytics';
+import { useDepositStore } from '@/store/useDepositStore';
+
+const CryptoIcon = ({ children }: { children: React.ReactNode }) => (
+  <View className="h-[37px] w-[37px] items-center justify-center rounded-full bg-[#333333]">
+    {children}
+  </View>
+);
+
+/**
+ * "Receive crypto" — the crypto branch of the deposit chooser: take the deposit
+ * address and send from anywhere, or connect an external wallet and push the
+ * transfer from here.
+ */
+const DepositCryptoOptions = () => {
+  const { isDesktop } = useDimension();
+  const setModal = useDepositStore(state => state.setModal);
+
+  const handleShowAddressPress = () => {
+    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, { deposit_method: 'deposit_directly' });
+    // Via the token list: the address is the same on every chain, so the
+    // currency is the choice that matters. The chain follows from it by default
+    // and can be changed from the address screen.
+    setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TOKEN);
+  };
+
+  const handleConnectWalletPress = () => {
+    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, { deposit_method: 'wallet' });
+    setModal(DEPOSIT_MODAL.OPEN_CONNECT_WALLET);
+  };
+
+  return (
+    <CardFundGroup>
+      <CardFundRow
+        icon={
+          <CryptoIcon>
+            <HomeQR width={25} height={25} />
+          </CryptoIcon>
+        }
+        title="Show deposit address"
+        subtitle="Transfer from any wallet or exchange"
+        onPress={handleShowAddressPress}
+      />
+      {/* External-wallet connect is desktop-only (thirdweb's connect modal), so a
+          phone is offered the address alone. */}
+      {isDesktop && (
+        <CardFundRow
+          icon={
+            <CryptoIcon>
+              <FundExternalWallet width={26} height={26} />
+            </CryptoIcon>
+          }
+          title="Connect wallet"
+          subtitle="One-click deposit from 500+ wallets"
+          onPress={handleConnectWalletPress}
+        />
+      )}
+    </CardFundGroup>
+  );
+};
+
+export default DepositCryptoOptions;
diff --git a/components/DepositOption/DepositFeeNotice.tsx b/components/DepositOption/DepositFeeNotice.tsx
new file mode 100644
index 000000000..052b5ef37
--- /dev/null
+++ b/components/DepositOption/DepositFeeNotice.tsx
@@ -0,0 +1,50 @@
+import { Text } from '@/components/ui/text';
+import { CardProvider } from '@/lib/types';
+import { cn } from '@/lib/utils';
+import {
+  DepositFeeProduct,
+  formatDepositFeePercent,
+  getDepositFeeBps,
+} from '@/lib/utils/depositFee';
+
+type DepositFeeNoticeProps = {
+  product: DepositFeeProduct;
+  /**
+   * The card issuer the flow serves. Passed in rather than looked up, because a
+   * flow built for one issuer ("Fund your card" is Rain's) has to quote that
+   * issuer's fee whatever the issuer query says in the meantime.
+   */
+  provider: CardProvider | null | undefined;
+  /** Chain the deposit is sent on. */
+  chainId: number;
+  /** Currency being sent. */
+  symbol?: string;
+  /** Share token a savings deposit mints. */
+  vaultToken?: string;
+  className?: string;
+};
+
+/**
+ * The fee line under a deposit address. Renders nothing when the deposit is
+ * free; `getDepositFeeBps` decides when that is.
+ */
+const DepositFeeNotice = ({
+  product,
+  provider,
+  chainId,
+  symbol,
+  vaultToken,
+  className,
+}: DepositFeeNoticeProps) => {
+  const bps = getDepositFeeBps({ provider, product, chainId, symbol, vaultToken });
+
+  if (!bps) return null;
+
+  return (
+    <Text className={cn('text-center text-sm text-white/50', className)}>
+      {`${formatDepositFeePercent(bps)} fee will be charged for deposits on this network`}
+    </Text>
+  );
+};
+
+export default DepositFeeNotice;
diff --git a/components/DepositOption/DepositIconCluster.tsx b/components/DepositOption/DepositIconCluster.tsx
new file mode 100644
index 000000000..b0bcf4383
--- /dev/null
+++ b/components/DepositOption/DepositIconCluster.tsx
@@ -0,0 +1,54 @@
+import React from 'react';
+import { ImageSourcePropType, View } from 'react-native';
+import { Image } from 'expo-image';
+
+import { Text } from '@/components/ui/text';
+
+const ICON_SIZE = 28;
+/** How far each circle slides under the one before it. */
+const OVERLAP = 9;
+/** Matches `bg-card`, so the circles read as cut out of the row behind them. */
+const RING_COLOR = '#1C1C1C';
+
+const CIRCLE_STYLE = {
+  width: ICON_SIZE,
+  height: ICON_SIZE,
+  borderRadius: ICON_SIZE / 2,
+  borderWidth: 1.5,
+  borderColor: RING_COLOR,
+};
+
+type DepositIconClusterProps = {
+  /** Sample of what the method accepts — token logos, currency flags. */
+  icons: ImageSourcePropType[];
+  /** Everything not shown, rendered as a trailing "+N" circle. Hidden at zero. */
+  overflowCount?: number;
+};
+
+/**
+ * The overlapping-circle icon the "Deposit with" rows carry instead of a single
+ * glyph: a few of the assets or currencies the method accepts, with a "+N"
+ * circle standing in for the rest.
+ */
+const DepositIconCluster = ({ icons, overflowCount = 0 }: DepositIconClusterProps) => (
+  <View className="flex-row items-center">
+    {icons.map((icon, index) => (
+      <View
+        key={index}
+        style={{ marginLeft: index === 0 ? 0 : -OVERLAP, zIndex: icons.length - index }}
+      >
+        <Image source={icon} style={CIRCLE_STYLE} contentFit="cover" />
+      </View>
+    ))}
+    {overflowCount > 0 ? (
+      <View
+        className="items-center justify-center bg-[#333333]"
+        style={{ ...CIRCLE_STYLE, marginLeft: -OVERLAP }}
+      >
+        <Text className="text-xs font-medium leading-none text-white/70">{`+${overflowCount}`}</Text>
+      </View>
+    ) : null}
+  </View>
+);
+
+export default DepositIconCluster;
diff --git a/components/DepositOption/DepositMethodRow.tsx b/components/DepositOption/DepositMethodRow.tsx
new file mode 100644
index 000000000..7081eb2e8
--- /dev/null
+++ b/components/DepositOption/DepositMethodRow.tsx
@@ -0,0 +1,39 @@
+import { ReactNode } from 'react';
+import { Pressable, View } from 'react-native';
+import { ChevronRight } from 'lucide-react-native';
+
+import { Text } from '@/components/ui/text';
+
+type DepositMethodRowProps = {
+  /** The method's icon cluster, rendered on its own line above the title. */
+  icon: ReactNode;
+  title: string;
+  subtitle: string;
+  onPress: () => void;
+};
+
+/**
+ * A row of the "Deposit with" chooser.
+ *
+ * Unlike `CardFundRow`, the icon sits above the title rather than beside it.
+ * That is what the design asks for, and it is also what makes the row readable:
+ * an icon cluster is far wider than a single glyph, and next to one the subtitle
+ * was left with about 200px and wrapped onto two cramped lines.
+ */
+const DepositMethodRow = ({ icon, title, subtitle, onPress }: DepositMethodRowProps) => (
+  <Pressable
+    className="flex-row items-center gap-x-3 px-5 py-5 web:transition-colors web:hover:bg-card-hover"
+    onPress={onPress}
+  >
+    <View className="flex-1 items-start gap-y-3">
+      {icon}
+      <View className="gap-y-1">
+        <Text className="text-xl font-semibold leading-tight text-primary">{title}</Text>
+        <Text className="text-sm leading-5 text-white/70">{subtitle}</Text>
+      </View>
+    </View>
+    <ChevronRight color="white" size={20} />
+  </Pressable>
+);
+
+export default DepositMethodRow;
diff --git a/components/DepositOption/DepositModalProvider.tsx b/components/DepositOption/DepositModalProvider.tsx
index 70e721d9f..d08d7189c 100644
--- a/components/DepositOption/DepositModalProvider.tsx
+++ b/components/DepositOption/DepositModalProvider.tsx
@@ -22,6 +22,7 @@ const DepositModalProvider = () => {
     disableScroll,
     fillViewportHeight,
     hideHeader,
+    mobilePresentation,
     actionButton,
     shouldAnimate,
     isForward,
@@ -62,6 +63,7 @@ const DepositModalProvider = () => {
         disableScroll={disableScroll}
         fillViewportHeight={fillViewportHeight}
         hideHeader={hideHeader}
+        mobilePresentation={mobilePresentation}
       >
         {getContent()}
       </ResponsiveModal>
diff --git a/components/DepositOption/DepositTypeSelection.tsx b/components/DepositOption/DepositTypeSelection.tsx
index 020911155..ff3f819f9 100644
--- a/components/DepositOption/DepositTypeSelection.tsx
+++ b/components/DepositOption/DepositTypeSelection.tsx
@@ -1,183 +1,95 @@
-import { useMemo, useState } from 'react';
-import { Pressable, View } from 'react-native';
-import { Image } from 'expo-image';
-import { Minus, Plus } from 'lucide-react-native';
+import { View } from 'react-native';
 
-import FundExternalWallet from '@/assets/images/fund-external-wallet';
-import HomeQR from '@/assets/images/home-qr';
 import CardFundGroup from '@/components/Card/CardFund/CardFundGroup';
-import CardFundRow from '@/components/Card/CardFund/CardFundRow';
-import { CARD_FUND_USD_ICON } from '@/components/Card/CardFund/constants';
-import {
-  CARD_FUND_LOCAL_CURRENCIES,
-  getCardFundLocalPaymentMethods,
-} from '@/components/Card/CardFund/localCurrencies';
+import { Button } from '@/components/ui/button';
 import { Text } from '@/components/ui/text';
 import { DEPOSIT_MODAL } from '@/constants/modals';
 import { TRACKING_EVENTS } from '@/constants/tracking-events';
-import { useBuyCryptoEntry } from '@/hooks/useBuyCryptoEntry';
-import { useCardStatus } from '@/hooks/useCardStatus';
 import { useDimension } from '@/hooks/useDimension';
-import useGeoCompliance from '@/hooks/useGeoCompliance';
-import { useOnrampAutomation } from '@/hooks/useOnrampAutomation';
-import { useVirtualAccountProvider } from '@/hooks/useVirtualAccountProvider';
 import { track } from '@/lib/analytics';
-import { RainApplicationStatus } from '@/lib/types';
+import { getAsset } from '@/lib/assets';
+import { getCryptoDepositEntry } from '@/lib/walletDepositFlow';
 import { useDepositStore } from '@/store/useDepositStore';
-import { useTransfiStore } from '@/store/useTransfiStore';
 
-import VirtualAccountApplyDialog from './VirtualAccountDetails/VirtualAccountApplyDialog';
+import { DEPOSIT_CASH_CLUSTER_ICONS, DEPOSIT_CASH_CURRENCY_COUNT } from './DepositCashOptions';
+import DepositIconCluster from './DepositIconCluster';
+import DepositMethodRow from './DepositMethodRow';
 
-const ICON_SIZE = 36;
-const FEATURED_LOCAL_CURRENCY_CODES = ['EUR', 'BRL', 'BDT', 'PHP'] as const;
-const ADDITIONAL_LOCAL_CURRENCY_CODES = ['MXN'] as const;
+const DEPOSIT_CRYPTO_CLUSTER_ICONS = [
+  getAsset('images/deposit-crypto-usdc.png'),
+  getAsset('images/deposit-crypto-usdt.png'),
+  getAsset('images/eth.png'),
+];
 
-const CryptoIcon = ({ children }: { children: React.ReactNode }) => (
-  <View className="h-[37px] w-[37px] items-center justify-center rounded-full bg-[#333333]">
-    {children}
-  </View>
-);
+type DepositTypeSelectionProps = {
+  /** Dismisses the whole deposit flow — the drawer's own "Close" button. */
+  onClose: () => void;
+};
 
-const DepositTypeSelection = () => {
-  const { isDesktop } = useDimension();
+/**
+ * "Deposit with" — the first step of the wallet deposit flow, and only a fork:
+ * crypto sent to the deposit address, or cash through a bank or local ramp.
+ * Each branch owns the methods underneath it (see `DepositCryptoOptions` and
+ * `DepositCashOptions`), which is what keeps this short enough to be a drawer on
+ * a phone rather than the full-height sheet the later steps use.
+ */
+const DepositTypeSelection = ({ onClose }: DepositTypeSelectionProps) => {
+  const { isDesktop, isScreenMedium } = useDimension();
   const setModal = useDepositStore(state => state.setModal);
-  const resetTransfi = useTransfiStore(state => state.reset);
-  const setTransfiCurrency = useTransfiStore(state => state.setFiatCurrency);
-  const [isVirtualAccountApplyOpen, setIsVirtualAccountApplyOpen] = useState(false);
-  const [showAllCurrencies, setShowAllCurrencies] = useState(false);
-  const { data: cardStatus } = useCardStatus();
-  const isRainApproved = cardStatus?.rainApplicationStatus === RainApplicationStatus.APPROVED;
-  const { data: existingAutomation } = useOnrampAutomation(isRainApproved);
-  const { provider: virtualAccountProvider } = useVirtualAccountProvider();
-  const { isBuyCryptoAvailable } = useGeoCompliance();
-  const { handleBuyCryptoPress } = useBuyCryptoEntry();
-
-  const localCurrencies = useMemo(() => {
-    const visibleCodes = showAllCurrencies
-      ? [...FEATURED_LOCAL_CURRENCY_CODES, ...ADDITIONAL_LOCAL_CURRENCY_CODES]
-      : FEATURED_LOCAL_CURRENCY_CODES;
-
-    return visibleCodes
-      .map(code => CARD_FUND_LOCAL_CURRENCIES.find(currency => currency.code === code))
-      .filter((currency): currency is (typeof CARD_FUND_LOCAL_CURRENCIES)[number] => !!currency);
-  }, [showAllCurrencies]);
-
-  const handleCashPress = () => {
-    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, {
-      deposit_method: 'bank_transfer',
-      provider: virtualAccountProvider,
-    });
-    // A Wirex user has no Rain automation and never will, so the Rain apply
-    // pitch is not their next step — their details screen owns activation for
-    // both rails. The other two entry points into this flow already route on
-    // the provider; this one did not, which is how Wirex users reached a
-    // "Verify now" that could only bounce them off the Rain KYC gate.
-    if (virtualAccountProvider === 'wirex' || existingAutomation) {
-      setModal(DEPOSIT_MODAL.OPEN_VIRTUAL_ACCOUNT_DETAILS);
-      return;
-    }
-    setIsVirtualAccountApplyOpen(true);
-  };
-
-  const handleShowAddressPress = () => {
-    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, { deposit_method: 'deposit_directly' });
-    setModal(DEPOSIT_MODAL.OPEN_PUBLIC_ADDRESS);
-  };
 
-  const handleConnectWalletPress = () => {
-    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, { deposit_method: 'wallet' });
-    setModal(DEPOSIT_MODAL.OPEN_CONNECT_WALLET);
+  const handleCryptoPress = () => {
+    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, { deposit_method: 'crypto' });
+    setModal(getCryptoDepositEntry(isDesktop));
   };
 
-  const handleLocalCurrencyPress = (code: string) => {
-    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, {
-      deposit_method: 'buy_crypto',
-      currency: code,
-    });
-    resetTransfi();
-    setTransfiCurrency(code);
-
-    if (!isBuyCryptoAvailable) {
-      setModal(DEPOSIT_MODAL.OPEN_BUY_CRYPTO);
-      return;
-    }
-
-    void handleBuyCryptoPress();
+  const handleCashPress = () => {
+    track(TRACKING_EVENTS.DEPOSIT_METHOD_SELECTED, { deposit_method: 'cash' });
+    setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CASH);
   };
 
   return (
-    <>
-      <View className="gap-y-8">
-        <CardFundGroup label="Crypto deposit">
-          <CardFundRow
-            icon={
-              <CryptoIcon>
-                <HomeQR width={25} height={25} />
-              </CryptoIcon>
-            }
-            title="Show deposit address"
-            subtitle="Transfer from any wallet or exchange"
-            onPress={handleShowAddressPress}
-          />
-          {isDesktop && (
-            <CardFundRow
-              icon={
-                <CryptoIcon>
-                  <FundExternalWallet width={26} height={26} />
-                </CryptoIcon>
-              }
-              title="Connect wallet"
-              subtitle="One-click deposit from 500+ wallets"
-              onPress={handleConnectWalletPress}
-            />
-          )}
-        </CardFundGroup>
-
-        <CardFundGroup label="Cash deposit">
-          <CardFundRow
-            className="min-h-[93px]"
-            icon={
-              <Image
-                source={CARD_FUND_USD_ICON}
-                style={{ width: ICON_SIZE, height: ICON_SIZE, borderRadius: ICON_SIZE / 2 }}
-                contentFit="cover"
-              />
-            }
-            title="USD"
-            chips={['ACH', 'Wire']}
-            onPress={handleCashPress}
-          />
-          {localCurrencies.map(currency => (
-            <CardFundRow
-              key={currency.code}
-              className="min-h-[93px]"
-              icon={currency.icon}
-              title={currency.code}
-              chips={getCardFundLocalPaymentMethods(currency.code)}
-              onPress={() => handleLocalCurrencyPress(currency.code)}
-            />
-          ))}
-          <Pressable
-            className="h-[49px] flex-row items-center justify-center gap-x-2 web:hover:bg-card-hover"
-            onPress={() => setShowAllCurrencies(current => !current)}
-          >
-            {showAllCurrencies ? (
-              <Minus color="rgba(255,255,255,0.7)" size={15} />
-            ) : (
-              <Plus color="rgba(255,255,255,0.7)" size={15} />
-            )}
-            <Text className="text-sm font-medium text-white/70">
-              {showAllCurrencies ? 'Show less' : 'Show more'}
-            </Text>
-          </Pressable>
-        </CardFundGroup>
+    <View className="gap-y-6">
+      {/* The drawer carries its own header: a grab handle (small screens, where it
+          is a real drag affordance) above a centred title, with no back or close
+          control — this is the first step, and "Close" is the button below. */}
+      <View className="gap-y-5">
+        {!isScreenMedium ? (
+          <View className="h-[5px] w-[73px] self-center rounded-full bg-white/20" />
+        ) : null}
+        <Text className="text-center text-xl font-semibold text-white">Deposit with</Text>
       </View>
 
-      <VirtualAccountApplyDialog
-        isOpen={isVirtualAccountApplyOpen}
-        onClose={() => setIsVirtualAccountApplyOpen(false)}
-      />
-    </>
+      <CardFundGroup>
+        <DepositMethodRow
+          icon={<DepositIconCluster icons={DEPOSIT_CRYPTO_CLUSTER_ICONS} />}
+          title="Crypto"
+          subtitle="Transfer from any wallet or exchange"
+          onPress={handleCryptoPress}
+        />
+        <DepositMethodRow
+          icon={
+            <DepositIconCluster
+              icons={DEPOSIT_CASH_CLUSTER_ICONS}
+              overflowCount={DEPOSIT_CASH_CURRENCY_COUNT - DEPOSIT_CASH_CLUSTER_ICONS.length}
+            />
+          }
+          title="Cash"
+          subtitle="Transfer from your bank account or with local ramps"
+          onPress={handleCashPress}
+        />
+      </CardFundGroup>
+
+      <Button
+        variant="brand"
+        className="h-12 w-full rounded-full"
+        onPress={onClose}
+        // The drawer has no close control of its own, so this is the only way out
+        // for a screen reader that never reaches the backdrop.
+        accessibilityLabel="Close"
+      >
+        <Text className="text-base font-bold text-black">Close</Text>
+      </Button>
+    </View>
   );
 };
 
diff --git a/components/DepositOption/DepositWalletConnector.web.tsx b/components/DepositOption/DepositWalletConnector.web.tsx
index 5977a3782..9d32bba2e 100644
--- a/components/DepositOption/DepositWalletConnector.web.tsx
+++ b/components/DepositOption/DepositWalletConnector.web.tsx
@@ -34,7 +34,9 @@ const DepositWalletConnector = () => {
     })
       .then(wallet => {
         if (!wallet) {
-          setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+          // Dismissing the connect popup goes back to where the row was tapped,
+          // not two levels up to the chooser.
+          setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO);
           return;
         }
 
@@ -50,7 +52,7 @@ const DepositWalletConnector = () => {
           error: String(error),
           deposit_method: 'wallet',
         });
-        setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+        setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO);
       })
       .finally(cleanupThirdwebStyles);
   }, [activeAccount?.address, connect, setModal]);
diff --git a/components/DepositOption/WalletDepositAddress/WalletDepositSelectors.tsx b/components/DepositOption/WalletDepositAddress/WalletDepositSelectors.tsx
new file mode 100644
index 000000000..091d7eb29
--- /dev/null
+++ b/components/DepositOption/WalletDepositAddress/WalletDepositSelectors.tsx
@@ -0,0 +1,179 @@
+import { useMemo } from 'react';
+import { ImageSourcePropType, Pressable, StyleSheet, View } from 'react-native';
+import { Image } from 'expo-image';
+import { Check, ChevronDown } from 'lucide-react-native';
+
+import { Text } from '@/components/ui/text';
+import { DEPOSIT_MODAL } from '@/constants/modals';
+import { cn } from '@/lib/utils';
+import { useDepositStore } from '@/store/useDepositStore';
+
+import {
+  getWalletDepositNetworks,
+  getWalletDepositNetworksForToken,
+  getWalletDepositTokenIcon,
+} from './constants';
+
+const PILL_ICON_STYLE = { width: 20, height: 20, borderRadius: 10 };
+const ROW_ICON_STYLE = { width: 28, height: 28, borderRadius: 14 };
+/** `h-[35px]` on the pill plus the gap the list sits below the row. */
+const LIST_TOP = 35 + 12;
+/** Tall enough to cover the QR card the open list floats over. */
+const BACKDROP_HEIGHT = 900;
+
+const styles = StyleSheet.create({
+  overlay: {
+    position: 'absolute',
+    top: LIST_TOP,
+    left: 0,
+    right: 0,
+  },
+  backdrop: {
+    height: BACKDROP_HEIGHT,
+  },
+});
+
+const Pill = ({
+  icon,
+  label,
+  isOpen,
+  onPress,
+  accessibilityLabel,
+}: {
+  icon?: ImageSourcePropType;
+  label: string;
+  isOpen?: boolean;
+  onPress: () => void;
+  accessibilityLabel: string;
+}) => (
+  <Pressable
+    accessibilityRole="button"
+    accessibilityLabel={accessibilityLabel}
+    onPress={onPress}
+    className="h-[35px] flex-row items-center gap-x-2 rounded-full bg-card px-3 web:transition-colors web:hover:bg-card-hover"
+  >
+    {icon ? (
+      <Image source={icon} style={PILL_ICON_STYLE} contentFit="cover" />
+    ) : (
+      <View style={PILL_ICON_STYLE} />
+    )}
+    <Text className="text-base font-semibold leading-none text-white">{label}</Text>
+    <ChevronDown
+      size={16}
+      color="rgba(255,255,255,0.6)"
+      style={isOpen ? { transform: [{ rotate: '180deg' }] } : undefined}
+    />
+  </Pressable>
+);
+
+type WalletDepositSelectorsProps = {
+  chainId: number;
+  symbol: string;
+  isNetworkOpen: boolean;
+  onToggleNetwork: () => void;
+};
+
+/**
+ * The currency and network pills above the QR, in that order: the currency is
+ * what was picked first and what the minimum is quoted in, so it leads.
+ *
+ * They open differently on purpose. The currency has its own step, which is also
+ * the first step of the flow. The network drops a list down in place, because
+ * changing it is an adjustment to the screen you are already on — sending that
+ * one to a full screen made a small change feel like starting again.
+ */
+const WalletDepositSelectors = ({
+  chainId,
+  symbol,
+  isNetworkOpen,
+  onToggleNetwork,
+}: WalletDepositSelectorsProps) => {
+  const setModal = useDepositStore(state => state.setModal);
+  const setWalletDeposit = useDepositStore(state => state.setWalletDeposit);
+
+  const network = useMemo(
+    () => getWalletDepositNetworks().find(item => item.chainId === chainId),
+    [chainId],
+  );
+
+  return (
+    <View className="flex-row items-center justify-center gap-x-2">
+      <Pill
+        icon={getWalletDepositTokenIcon(chainId, symbol)}
+        label={symbol}
+        onPress={() => {
+          setWalletDeposit({ isChangingToken: true });
+          setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TOKEN);
+        }}
+        accessibilityLabel="Choose currency"
+      />
+      <Pill
+        icon={network?.icon}
+        label={network?.name ?? '—'}
+        isOpen={isNetworkOpen}
+        onPress={onToggleNetwork}
+        accessibilityLabel="Choose network"
+      />
+    </View>
+  );
+};
+
+type WalletDepositNetworkListProps = {
+  chainId: number;
+  symbol: string;
+  onSelect: (chainId: number) => void;
+  onDismiss: () => void;
+};
+
+/**
+ * The network list, floating under the pills over the content below.
+ *
+ * Plain views, and rendered as the screen's last child. Both matter: an
+ * `Animated.View` does not resolve nativewind's `className`, so wrapping the
+ * card would drop its background, and paint order is what puts it in front —
+ * `zIndex` does not carry from a nested child over a later sibling.
+ *
+ * It offers only the chains carrying the chosen currency, so changing network
+ * can never quietly change the currency with it.
+ */
+export const WalletDepositNetworkList = ({
+  chainId,
+  symbol,
+  onSelect,
+  onDismiss,
+}: WalletDepositNetworkListProps) => {
+  const networks = useMemo(() => getWalletDepositNetworksForToken(symbol), [symbol]);
+
+  return (
+    <>
+      {/* Tapping what the list covers dismisses it, as tapping outside would. */}
+      <Pressable
+        accessibilityLabel="Close the list"
+        style={[styles.overlay, styles.backdrop]}
+        onPress={onDismiss}
+      />
+
+      <View
+        className="overflow-hidden rounded-[15px] bg-card web:shadow-[0_12px_32px_rgba(0,0,0,0.45)]"
+        style={styles.overlay}
+      >
+        {networks.map((item, index) => (
+          <Pressable
+            key={item.chainId}
+            onPress={() => onSelect(item.chainId)}
+            className={cn(
+              'flex-row items-center gap-x-3 px-[18px] py-3 web:transition-colors web:hover:bg-card-hover',
+              index > 0 && 'border-t border-white/[0.06]',
+            )}
+          >
+            <Image source={item.icon} style={ROW_ICON_STYLE} contentFit="cover" />
+            <Text className="flex-1 text-base font-semibold text-white">{item.name}</Text>
+            {item.chainId === chainId ? <Check size={18} color="#94F27F" /> : null}
+          </Pressable>
+        ))}
+      </View>
+    </>
+  );
+};
+
+export default WalletDepositSelectors;
diff --git a/components/DepositOption/WalletDepositAddress/WalletDepositTokens.tsx b/components/DepositOption/WalletDepositAddress/WalletDepositTokens.tsx
new file mode 100644
index 000000000..21961ea31
--- /dev/null
+++ b/components/DepositOption/WalletDepositAddress/WalletDepositTokens.tsx
@@ -0,0 +1,61 @@
+import { useMemo } from 'react';
+import { View } from 'react-native';
+import { Image } from 'expo-image';
+import { Check } from 'lucide-react-native';
+
+import CardFundGroup from '@/components/Card/CardFund/CardFundGroup';
+import CardFundRow from '@/components/Card/CardFund/CardFundRow';
+import { DEPOSIT_MODAL } from '@/constants/modals';
+import { useDepositStore } from '@/store/useDepositStore';
+
+import { getAllWalletDepositTokens, resolveWalletDepositChain } from './constants';
+
+const TOKEN_ICON_STYLE = { width: 36, height: 36, borderRadius: 18 };
+
+/**
+ * "Select token" — which currency the deposit address is for, and the first step
+ * after "Show deposit address".
+ *
+ * It lists every currency some chain accepts. The chain follows from the pick
+ * (see `resolveWalletDepositChain`), and the address screen's network pill is
+ * there to change it.
+ */
+const WalletDepositTokens = () => {
+  const setModal = useDepositStore(state => state.setModal);
+  const setWalletDeposit = useDepositStore(state => state.setWalletDeposit);
+  const walletDeposit = useDepositStore(state => state.walletDeposit);
+
+  // Only marked when the user is coming back to change it. Arriving here on the
+  // way in, nothing has been chosen yet, and a tick against a currency they never
+  // picked reads as a decision already made for them.
+  const selected = walletDeposit.isChangingToken ? walletDeposit.symbol : undefined;
+
+  const tokens = useMemo(() => getAllWalletDepositTokens(), []);
+
+  const handleSelect = (symbol: string) => {
+    setWalletDeposit({
+      symbol,
+      chainId: resolveWalletDepositChain(symbol, walletDeposit.chainId),
+      isChangingToken: false,
+    });
+    setModal(DEPOSIT_MODAL.OPEN_PUBLIC_ADDRESS);
+  };
+
+  return (
+    <View>
+      <CardFundGroup>
+        {tokens.map(token => (
+          <CardFundRow
+            key={token.symbol}
+            icon={<Image source={token.icon} style={TOKEN_ICON_STYLE} contentFit="cover" />}
+            title={token.symbol}
+            trailing={token.symbol === selected ? <Check size={20} color="#94F27F" /> : <View />}
+            onPress={() => handleSelect(token.symbol)}
+          />
+        ))}
+      </CardFundGroup>
+    </View>
+  );
+};
+
+export default WalletDepositTokens;
diff --git a/components/DepositOption/WalletDepositAddress/__tests__/walletDepositConstants.test.ts b/components/DepositOption/WalletDepositAddress/__tests__/walletDepositConstants.test.ts
new file mode 100644
index 000000000..962dfb434
--- /dev/null
+++ b/components/DepositOption/WalletDepositAddress/__tests__/walletDepositConstants.test.ts
@@ -0,0 +1,243 @@
+import { arbitrum, base, fuse, mainnet, polygon } from 'viem/chains';
+
+import {
+  getAllWalletDepositTokens,
+  getDefaultWalletDepositSelection,
+  getWalletDepositMinimum,
+  getWalletDepositNetworks,
+  getWalletDepositNetworksForToken,
+  getWalletDepositTokenIcon,
+  getWalletDepositTokens,
+  resolveWalletDepositChain,
+  resolveWalletDepositMinimum,
+  resolveWalletDepositSymbol,
+  usesDirectDepositAddress,
+} from '@/components/DepositOption/WalletDepositAddress/constants';
+import { CardProvider, DepositAsset } from '@/lib/types';
+
+// The module resolves icons through the asset barrel; what is under test is
+// which chains and currencies are offered and what each pairing's floor is.
+jest.mock('@/lib/assets', () => ({ getAsset: (path: string) => path }));
+
+describe('getWalletDepositMinimum', () => {
+  it('asks for more on Ethereum than on the chains its deposits are cheap to move on', () => {
+    expect(getWalletDepositMinimum(mainnet.id, 'USDC')).toBe(10);
+    expect(getWalletDepositMinimum(base.id, 'USDC')).toBe(1);
+    expect(getWalletDepositMinimum(arbitrum.id, 'USDT')).toBe(1);
+  });
+
+  // A floor is a number of tokens, so an asset that is not worth ~$1 a unit needs
+  // its own — 10 ETH would be an absurd minimum, 1 FUSE a meaningless one.
+  it('overrides the chain floor for currencies that are not worth ~$1 a unit', () => {
+    expect(getWalletDepositMinimum(mainnet.id, 'ETH')).toBe(0.005);
+    expect(getWalletDepositMinimum(mainnet.id, 'WETH')).toBe(0.005);
+    expect(getWalletDepositMinimum(fuse.id, 'FUSE')).toBe(500);
+  });
+
+  it('falls back to a floor rather than none for an unlisted chain', () => {
+    expect(getWalletDepositMinimum(999_999, 'USDC')).toBe(1);
+  });
+});
+
+describe('getWalletDepositTokens', () => {
+  it('lists the currencies the chain actually carries', () => {
+    expect(getWalletDepositTokens(mainnet.id).map(token => token.symbol)).toEqual([
+      'USDC',
+      'USDT',
+      'ETH',
+      'WETH',
+    ]);
+    // Base is USDC only — USDT there is deliberately not offered.
+    expect(getWalletDepositTokens(base.id).map(token => token.symbol)).toEqual(['USDC']);
+  });
+
+  it('returns nothing for a chain that is not supported', () => {
+    expect(getWalletDepositTokens(999_999)).toEqual([]);
+  });
+});
+
+describe('getWalletDepositTokenIcon', () => {
+  // Most chains' USDC entry carries no icon of its own, which used to leave the
+  // currency pill blank everywhere but Ethereum.
+  it('falls back to the currency icon when the chain entry carries none', () => {
+    expect(getWalletDepositTokenIcon(polygon.id, 'USDC')).toBe('images/usdc-4x.png');
+  });
+
+  it('prefers the icon on the chain entry when there is one', () => {
+    expect(getWalletDepositTokenIcon(mainnet.id, 'USDC')).not.toBe('images/usdc-4x.png');
+  });
+});
+
+describe('getWalletDepositNetworks', () => {
+  it('offers only chains with a currency to deposit, in display order', () => {
+    const networks = getWalletDepositNetworks();
+
+    expect(networks.length).toBeGreaterThan(0);
+    expect(networks.every(network => getWalletDepositTokens(network.chainId).length > 0)).toBe(
+      true,
+    );
+    expect(networks[0].chainId).toBe(mainnet.id);
+  });
+});
+
+/**
+ * Which address the screen hands out. The minted one is watched by the deposit
+ * pipeline and resolves by issuer; the Safe is neither. Getting this wrong
+ * either strands a transfer or sends it to someone's card instead of their
+ * wallet.
+ */
+describe('usesDirectDepositAddress', () => {
+  it('mints for a Wirex cardholder sending a stablecoin', () => {
+    expect(usesDirectDepositAddress('USDC', CardProvider.WIREX)).toBe(true);
+    expect(usesDirectDepositAddress('USDT', CardProvider.WIREX)).toBe(true);
+  });
+
+  // Minting resolves by issuer: for Rain it would deliver to the card, and with
+  // no card there is no issuer to resolve. Both see the Safe, for everything.
+  it('keeps the Safe for everyone who is not a Wirex cardholder', () => {
+    expect(usesDirectDepositAddress('USDC', CardProvider.RAIN)).toBe(false);
+    expect(usesDirectDepositAddress('USDC', null)).toBe(false);
+    expect(usesDirectDepositAddress('USDC', undefined)).toBe(false);
+  });
+
+  // These have no route through the pipeline — they land in the Safe and stay as
+  // the token that was sent, so there the Safe is the right answer.
+  it('keeps the Safe for the currencies with no route, even for Wirex', () => {
+    expect(usesDirectDepositAddress('ETH', CardProvider.WIREX)).toBe(false);
+    expect(usesDirectDepositAddress('WETH', CardProvider.WIREX)).toBe(false);
+    expect(usesDirectDepositAddress('FUSE', CardProvider.WIREX)).toBe(false);
+    expect(usesDirectDepositAddress('WFUSE', CardProvider.WIREX)).toBe(false);
+  });
+});
+
+describe('resolveWalletDepositMinimum', () => {
+  const asset = (over: Partial<DepositAsset>): DepositAsset => ({
+    chainId: mainnet.id,
+    chainName: 'Ethereum',
+    symbol: 'USDC',
+    address: '0x0',
+    decimals: 6,
+    minimum: '10',
+    ...over,
+  });
+
+  // The pipeline's figure is the only enforced one, so it wins whenever present.
+  it('prefers the published minimum over the committed estimate', () => {
+    const assets = [asset({ symbol: 'USDC', minimum: '25' })];
+    expect(resolveWalletDepositMinimum(mainnet.id, 'USDC', assets)).toBe(25);
+  });
+
+  it('falls back when the pipeline has not answered', () => {
+    expect(resolveWalletDepositMinimum(mainnet.id, 'USDC', undefined)).toBe(10);
+    expect(resolveWalletDepositMinimum(base.id, 'USDC', [])).toBe(1);
+  });
+
+  // The pipeline credits the wrapped contract; the screen offers the native.
+  it('matches a native asset through its wrapped equivalent', () => {
+    const assets = [
+      asset({ symbol: 'WETH', minimum: '0.004', decimals: 18 }),
+      asset({ chainId: fuse.id, chainName: 'Fuse', symbol: 'WFUSE', minimum: '500' }),
+    ];
+
+    expect(resolveWalletDepositMinimum(mainnet.id, 'ETH', assets)).toBe(0.004);
+    expect(resolveWalletDepositMinimum(mainnet.id, 'WETH', assets)).toBe(0.004);
+    expect(resolveWalletDepositMinimum(fuse.id, 'FUSE', assets)).toBe(500);
+  });
+
+  it('does not take a published minimum from the wrong chain', () => {
+    const assets = [asset({ chainId: base.id, chainName: 'Base', minimum: '99' })];
+    expect(resolveWalletDepositMinimum(mainnet.id, 'USDC', assets)).toBe(10);
+  });
+
+  // A malformed or zero figure would quote "Send at least 0", which is no floor.
+  it('ignores a published minimum that is not a usable number', () => {
+    expect(resolveWalletDepositMinimum(mainnet.id, 'USDC', [asset({ minimum: '0' })])).toBe(10);
+    expect(resolveWalletDepositMinimum(mainnet.id, 'USDC', [asset({ minimum: 'n/a' })])).toBe(10);
+  });
+});
+
+describe('resolveWalletDepositSymbol', () => {
+  it('carries a currency over to a chain that accepts it', () => {
+    expect(resolveWalletDepositSymbol(base.id, 'USDC')).toBe('USDC');
+    expect(resolveWalletDepositSymbol(mainnet.id, 'USDT')).toBe('USDT');
+  });
+
+  // Otherwise the screen would quote a minimum for a pairing that does not exist.
+  it('falls back when the chain does not carry it', () => {
+    expect(resolveWalletDepositSymbol(base.id, 'USDT')).toBe('USDC');
+    expect(resolveWalletDepositSymbol(base.id, 'ETH')).toBe('USDC');
+    expect(resolveWalletDepositSymbol(fuse.id, 'ETH')).toBe('FUSE');
+  });
+
+  it("picks the chain's first currency when none was chosen yet", () => {
+    expect(resolveWalletDepositSymbol(mainnet.id, undefined)).toBe('USDC');
+  });
+
+  it('has nothing to offer for an unsupported chain', () => {
+    expect(resolveWalletDepositSymbol(999_999, 'USDC')).toBeUndefined();
+  });
+});
+
+describe('getDefaultWalletDepositSelection', () => {
+  /**
+   * Fuse, not Ethereum. The address shown is the user's Safe on whichever chain
+   * is picked — it is not a bridge — so a deposit made on the default lands on
+   * the default. Everything the balance is then spent on (the card, the vaults,
+   * the annual membership charge) is on Fuse, and the membership charge can
+   * only ever move Fuse USDC.e.
+   */
+  it('opens on USDC over Fuse', () => {
+    expect(getDefaultWalletDepositSelection()).toEqual({ chainId: fuse.id, symbol: 'USDC' });
+  });
+
+  it('offers USDC on the chain it opens on', () => {
+    const { chainId, symbol } = getDefaultWalletDepositSelection();
+    expect(getWalletDepositTokens(chainId).map(token => token.symbol)).toContain(symbol);
+  });
+});
+
+describe('getAllWalletDepositTokens', () => {
+  it('lists every currency some chain accepts, once', () => {
+    const symbols = getAllWalletDepositTokens().map(token => token.symbol);
+    expect(new Set(symbols).size).toBe(symbols.length);
+    expect(symbols).toEqual(expect.arrayContaining(['USDC', 'USDT', 'ETH', 'FUSE']));
+  });
+
+  // Derived from chain order alone this read USDC, FUSE, USDT, WFUSE, ETH —
+  // Fuse's pair riding up the list purely because Fuse is the default chain.
+  it("leads with the currencies people look for, not the default chain's", () => {
+    const symbols = getAllWalletDepositTokens().map(token => token.symbol);
+    expect(symbols.slice(0, 3)).toEqual(['USDC', 'USDT', 'ETH']);
+  });
+});
+
+describe('getWalletDepositNetworksForToken', () => {
+  it('only offers the chains that carry the currency', () => {
+    expect(getWalletDepositNetworksForToken('ETH').map(network => network.chainId)).toEqual([
+      mainnet.id,
+    ]);
+    expect(getWalletDepositNetworksForToken('USDT').map(network => network.chainId)).not.toContain(
+      base.id,
+    );
+  });
+
+  it('offers every chain when no currency is chosen', () => {
+    expect(getWalletDepositNetworksForToken(undefined)).toEqual(getWalletDepositNetworks());
+  });
+});
+
+describe('resolveWalletDepositChain', () => {
+  it('opens on Fuse when Fuse carries the currency', () => {
+    expect(resolveWalletDepositChain('USDC')).toBe(fuse.id);
+  });
+
+  it('falls back to a chain that carries it when Fuse does not', () => {
+    expect(resolveWalletDepositChain('ETH')).toBe(mainnet.id);
+  });
+
+  // Changing only the currency from the address screen should not move the chain.
+  it('keeps the current chain when it carries the currency', () => {
+    expect(resolveWalletDepositChain('USDC', polygon.id)).toBe(polygon.id);
+    expect(resolveWalletDepositChain('ETH', polygon.id)).toBe(mainnet.id);
+  });
+});
diff --git a/components/DepositOption/WalletDepositAddress/constants.ts b/components/DepositOption/WalletDepositAddress/constants.ts
new file mode 100644
index 000000000..ee1465f57
--- /dev/null
+++ b/components/DepositOption/WalletDepositAddress/constants.ts
@@ -0,0 +1,274 @@
+import { ImageSourcePropType } from 'react-native';
+import { arbitrum, base, bsc, fuse, mainnet, polygon } from 'viem/chains';
+
+import { BRIDGE_TOKENS } from '@/constants/bridge';
+import { getAsset } from '@/lib/assets';
+import { CardProvider, DepositAsset } from '@/lib/types';
+import { getAllowedTokensForChain, getVaultDepositConfig } from '@/lib/vaults';
+
+export type WalletDepositNetwork = {
+  chainId: number;
+  name: string;
+  icon: ImageSourcePropType;
+};
+
+export type WalletDepositToken = {
+  symbol: string;
+  icon: ImageSourcePropType;
+};
+
+/** Deposits land on the Safe within roughly the same window on every chain. */
+export const WALLET_DEPOSIT_ESTIMATED_TIME = '~3 min';
+
+export const WALLET_DEPOSIT_LEARN_URL =
+  'https://support.solid.xyz/en/articles/14431132-supported-networks-and-tokens-on-solid';
+
+/**
+ * Smallest deposit worth sending, in token units, per chain.
+ *
+ * A transfer to the deposit address is picked up and credited by a backend leg
+ * that pays gas on the source chain, so anything under the floor costs more to
+ * move than it is worth and is neither credited nor returned — which is what the
+ * warning under the QR is telling the user. Ethereum's gas is why its floor is an
+ * order of magnitude above every other chain's.
+ *
+ * These are the single source of truth for the minimum shown on the deposit
+ * address screen; change them here rather than in the copy.
+ */
+const MINIMUM_DEPOSIT_BY_CHAIN: Record<number, number> = {
+  [mainnet.id]: 10,
+  [polygon.id]: 1,
+  [base.id]: 1,
+  [arbitrum.id]: 1,
+  [bsc.id]: 1,
+  [fuse.id]: 1,
+};
+
+/**
+ * Overrides for the assets that are not worth ~$1 a unit, so every floor lands in
+ * roughly the same place in dollars. Each of these exists on exactly one chain
+ * (ETH/WETH on Ethereum, FUSE/WFUSE on Fuse), so the symbol alone identifies it.
+ */
+const MINIMUM_DEPOSIT_BY_TOKEN: Record<string, number> = {
+  ETH: 0.005,
+  WETH: 0.005,
+  FUSE: 500,
+  WFUSE: 500,
+};
+
+/** Used for a chain with no entry above, rather than claiming there is no floor. */
+const DEFAULT_MINIMUM_DEPOSIT = 1;
+
+/** The stablecoins the deposit pipeline has a route for. */
+const DIRECT_DEPOSIT_SYMBOLS = new Set(['USDC', 'USDT']);
+
+/**
+ * Whether the deposit address is one the pipeline mints, rather than the Safe.
+ *
+ * Both halves have to hold:
+ *
+ * - A Wirex cardholder. The address is minted against the card destination, and
+ *   the backend resolves that by issuer: for Wirex it delivers to their Safe on
+ *   Fuse, which is the same balance their card settles from. For a Rain
+ *   cardholder it would deliver to the card, and for someone with no card there
+ *   is no issuer to resolve — so everyone else is shown the Safe, everywhere.
+ * - A stablecoin. ETH, WETH, FUSE and WFUSE have no route through the pipeline;
+ *   they land in the Safe and stay as the token that was sent, so there the Safe
+ *   address is the right answer rather than a fallback.
+ */
+export const usesDirectDepositAddress = (
+  symbol: string,
+  provider: CardProvider | null | undefined,
+): boolean => provider === CardProvider.WIREX && DIRECT_DEPOSIT_SYMBOLS.has(symbol);
+
+/**
+ * The order "Select token" leads with. The stablecoins people actually deposit
+ * come first, then ETH; everything else follows in network order.
+ */
+const TOKEN_DISPLAY_ORDER = ['USDC', 'USDT', 'ETH'];
+
+/**
+ * The contract the pipeline credits for a native asset. It lists WETH and WFUSE;
+ * the deposit screen offers ETH and FUSE, which are the same floor.
+ */
+const WRAPPED_EQUIVALENT: Record<string, string> = {
+  ETH: 'WETH',
+  FUSE: 'WFUSE',
+};
+
+/** Icons for tokens whose `BRIDGE_TOKENS` entry carries none (e.g. USDC off mainnet). */
+const TOKEN_ICON_FALLBACKS: Record<string, ImageSourcePropType> = {
+  USDC: getAsset('images/usdc-4x.png'),
+  USDT: getAsset('images/usdt.png'),
+  ETH: getAsset('images/eth.png'),
+  WETH: getAsset('images/weth.png'),
+  FUSE: getAsset('images/fuse-4x.png'),
+  WFUSE: getAsset('images/wfuse.png'),
+};
+
+export const getWalletDepositTokenIcon = (chainId: number, symbol: string): ImageSourcePropType => {
+  const icon = BRIDGE_TOKENS[chainId]?.tokens?.[symbol]?.icon;
+  return icon ?? TOKEN_ICON_FALLBACKS[symbol] ?? TOKEN_ICON_FALLBACKS.USDC;
+};
+
+/** The currencies that chain accepts, in the order `BRIDGE_TOKENS` lists them. */
+export const getWalletDepositTokens = (chainId: number): WalletDepositToken[] =>
+  getAllowedTokensForChain(chainId).map(symbol => ({
+    symbol,
+    icon: getWalletDepositTokenIcon(chainId, symbol),
+  }));
+
+/**
+ * Chains the wallet can be funded on, in display order.
+ *
+ * The deposit address is the user's Safe, which is the same address on every
+ * chain — the choice here only decides which currencies are on offer, what the
+ * minimum is, and which logo the QR carries.
+ */
+export const getWalletDepositNetworks = (): WalletDepositNetwork[] => {
+  const { supportedChains } = getVaultDepositConfig();
+
+  return Object.entries(BRIDGE_TOKENS)
+    .map(([id, chain]) => ({ chainId: Number(id), chain }))
+    .filter(({ chainId, chain }) => supportedChains.includes(chainId) && !chain.isComingSoon)
+    .filter(({ chainId }) => getWalletDepositTokens(chainId).length > 0)
+    .sort((a, b) => a.chain.sort - b.chain.sort)
+    .map(({ chainId, chain }) => ({ chainId, name: chain.name, icon: chain.icon }));
+};
+
+/**
+ * The currency to show once `chainId` is chosen.
+ *
+ * A currency carries over between chains when the new one accepts it, so picking
+ * a chain does not silently reset a deliberate choice. When it does not — USDT
+ * is not offered on Base, ETH only exists on Ethereum — it falls back to what
+ * the chain does carry, rather than leaving the screen quoting a minimum for a
+ * pairing that does not exist.
+ */
+export const resolveWalletDepositSymbol = (
+  chainId: number,
+  symbol?: string,
+): string | undefined => {
+  const tokens = getWalletDepositTokens(chainId);
+  return tokens.some(token => token.symbol === symbol) ? symbol : tokens[0]?.symbol;
+};
+
+/**
+ * The committed estimate, used when the pipeline has not answered.
+ *
+ * Kept as the fallback rather than deleted: a screen that shows no minimum while
+ * a request is in flight, or when it fails, is worse than one showing an
+ * approximate figure immediately. `resolveWalletDepositMinimum` prefers the
+ * live number whenever there is one.
+ */
+export const getWalletDepositMinimum = (chainId: number, symbol: string): number =>
+  MINIMUM_DEPOSIT_BY_TOKEN[symbol] ?? MINIMUM_DEPOSIT_BY_CHAIN[chainId] ?? DEFAULT_MINIMUM_DEPOSIT;
+
+/**
+ * The minimum to show for a pairing, preferring what the deposit pipeline says.
+ *
+ * The pipeline's figure is the only one that is enforced, and it is derived from
+ * a dollar floor at a price the backend controls — so quoting it is the only way
+ * the screen and the service cannot disagree. `assets` being absent (loading,
+ * failed, or an older backend) falls back to the committed table.
+ *
+ * Native assets are matched through their wrapped equivalents: the pipeline
+ * credits WETH and WFUSE contracts, while the screen offers ETH and FUSE, and
+ * the floor is the same either way.
+ */
+export const resolveWalletDepositMinimum = (
+  chainId: number,
+  symbol: string,
+  assets?: DepositAsset[],
+): number => {
+  const wanted = WRAPPED_EQUIVALENT[symbol] ?? symbol;
+  const published = assets?.find(asset => asset.chainId === chainId && asset.symbol === wanted);
+  const parsed = published ? Number(published.minimum) : NaN;
+
+  return Number.isFinite(parsed) && parsed > 0 ? parsed : getWalletDepositMinimum(chainId, symbol);
+};
+
+/**
+ * The pairing the screen opens on: USDC on Fuse, falling back if either is off.
+ *
+ * Fuse rather than Ethereum because this address is the user's Safe on the
+ * chain they pick, not a bridge — what lands on Ethereum stays on Ethereum.
+ * Everything the app then spends that balance on lives on Fuse: the card, the
+ * vaults, and the annual membership charge, which can only ever move Fuse
+ * USDC.e. Opening on Ethereum put the most expensive gas and the one chain the
+ * balance cannot be used from in front of the user by default.
+ */
+export const getDefaultWalletDepositSelection = (): { chainId: number; symbol: string } => {
+  const networks = getWalletDepositNetworks();
+  const chainId = networks.some(network => network.chainId === fuse.id)
+    ? fuse.id
+    : (networks[0]?.chainId ?? mainnet.id);
+  const tokens = getWalletDepositTokens(chainId);
+  const symbol =
+    tokens.find(token => token.symbol === 'USDC')?.symbol ?? tokens[0]?.symbol ?? 'USDC';
+
+  return { chainId, symbol };
+};
+
+/**
+ * Every currency the deposit address can take, each once, for "Select token" —
+ * the first step, taken before any chain is chosen.
+ *
+ * `TOKEN_DISPLAY_ORDER` leads, because a list derived from chain order put FUSE
+ * and WFUSE above USDT and ETH purely because Fuse is the default chain, which
+ * is not the order anyone looks for them in. Whatever is not named there follows
+ * in network order. Each is drawn with the icon of the first chain carrying it.
+ */
+export const getAllWalletDepositTokens = (): WalletDepositToken[] => {
+  const { chainId: defaultChainId } = getDefaultWalletDepositSelection();
+  const chainIds = [
+    defaultChainId,
+    ...getWalletDepositNetworks()
+      .map(network => network.chainId)
+      .filter(chainId => chainId !== defaultChainId),
+  ];
+  const seen = new Set<string>();
+  const tokens = chainIds.flatMap(chainId =>
+    getWalletDepositTokens(chainId).filter(token => {
+      if (seen.has(token.symbol)) return false;
+      seen.add(token.symbol);
+      return true;
+    }),
+  );
+
+  const rank = (symbol: string) => {
+    const index = TOKEN_DISPLAY_ORDER.indexOf(symbol);
+    return index === -1 ? TOKEN_DISPLAY_ORDER.length : index;
+  };
+
+  return [...tokens].sort((a, b) => rank(a.symbol) - rank(b.symbol));
+};
+
+/**
+ * The chains "Select chain" offers once a currency is chosen: only those that
+ * carry it, so switching chain can never quietly switch the currency too. All of
+ * them when nothing is chosen yet, or no chain carries it.
+ */
+export const getWalletDepositNetworksForToken = (symbol?: string): WalletDepositNetwork[] => {
+  const networks = getWalletDepositNetworks();
+  const carrying = networks.filter(network =>
+    getWalletDepositTokens(network.chainId).some(token => token.symbol === symbol),
+  );
+
+  return carrying.length ? carrying : networks;
+};
+
+/**
+ * The chain the address opens on once `symbol` is picked.
+ *
+ * The current chain when it carries the currency, so changing only the currency
+ * from the address screen keeps the chain. Otherwise the default chain (see
+ * `getDefaultWalletDepositSelection`) if it carries it, else the first that does.
+ */
+export const resolveWalletDepositChain = (symbol: string, currentChainId?: number): number => {
+  const carrying = getWalletDepositNetworksForToken(symbol).map(network => network.chainId);
+  if (currentChainId !== undefined && carrying.includes(currentChainId)) return currentChainId;
+
+  const { chainId: defaultChainId } = getDefaultWalletDepositSelection();
+  return carrying.includes(defaultChainId) ? defaultChainId : (carrying[0] ?? defaultChainId);
+};
diff --git a/components/DepositOption/WalletDepositAddress/index.tsx b/components/DepositOption/WalletDepositAddress/index.tsx
new file mode 100644
index 000000000..129072daf
--- /dev/null
+++ b/components/DepositOption/WalletDepositAddress/index.tsx
@@ -0,0 +1,248 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { ActivityIndicator, ImageSourcePropType, Linking, Pressable, View } from 'react-native';
+import QRCode from 'react-native-qrcode-svg';
+import * as Clipboard from 'expo-clipboard';
+import { Image } from 'expo-image';
+import { ChevronRight } from 'lucide-react-native';
+
+import { CARD_FUND_DESTINATION_TYPE } from '@/components/Card/CardFund/constants';
+import DepositScanningIndicator from '@/components/Card/CardFund/DepositScanningIndicator';
+import CopyToClipboard from '@/components/CopyToClipboard';
+import DepositFeeNotice from '@/components/DepositOption/DepositFeeNotice';
+import { Button } from '@/components/ui/button';
+import { Text } from '@/components/ui/text';
+import { useCardProvider } from '@/hooks/useCardProvider';
+import { useDepositAssets } from '@/hooks/useDepositAssets';
+import { useDetectedDirectDeposit } from '@/hooks/useDetectedDirectDeposit';
+import { useWalletDepositAddress } from '@/hooks/useWalletDepositAddress';
+import { eclipseAddress, formatNumber } from '@/lib/utils';
+import { useDepositStore } from '@/store/useDepositStore';
+
+import {
+  getDefaultWalletDepositSelection,
+  getWalletDepositNetworks,
+  getWalletDepositTokenIcon,
+  resolveWalletDepositMinimum,
+  resolveWalletDepositSymbol,
+  WALLET_DEPOSIT_LEARN_URL,
+} from './constants';
+import WalletDepositSelectors, { WalletDepositNetworkList } from './WalletDepositSelectors';
+
+/** Design caps the QR at 259px; below that it tracks the card width. */
+const QR_MAX_SIZE = 259;
+/** Inset shared by both halves of the card, so the QR and address line up. */
+const CARD_PADDING = 20;
+/**
+ * Margin of plain background left around the modules. The library keeps the
+ * element at `size` and scales the modules down to make room, so this buys the
+ * 20px corner radius something to cut into: a radius R bites at most R - R/√2
+ * (≈ 5.9px here) into the corner, well inside the ~9px margin, which keeps the
+ * rounding clear of the finder patterns a scanner needs intact.
+ */
+const QR_QUIET_ZONE = 10;
+const INLINE_ICON_STYLE = { width: 16, height: 16, borderRadius: 8 };
+
+/**
+ * "Deposit Address" — where a crypto deposit into the wallet is sent.
+ *
+ * The address is the user's Safe, which is the same on every chain, so the chain
+ * and currency pills do not change it: they decide which currencies are on offer,
+ * what the minimum transfer is, and which chain the QR is labelled for. Sending
+ * a currency the chosen chain does not list, or less than its minimum, is what
+ * the copy under the QR is there to prevent.
+ */
+const WalletDepositAddress = () => {
+  // Chain and currency are both chosen on steps of their own, so the selection
+  // lives in the store rather than here (see `walletDeposit`). This screen only
+  // reads it.
+  const walletDeposit = useDepositStore(state => state.walletDeposit);
+  const setWalletDeposit = useDepositStore(state => state.setWalletDeposit);
+  const fallback = useMemo(() => getDefaultWalletDepositSelection(), []);
+  const chainId = walletDeposit.chainId ?? fallback.chainId;
+  const symbol = walletDeposit.symbol ?? fallback.symbol;
+  const [copied, setCopied] = useState(false);
+  const [qrSize, setQrSize] = useState(QR_MAX_SIZE);
+  const [isNetworkOpen, setIsNetworkOpen] = useState(false);
+
+  const network = useMemo(
+    () => getWalletDepositNetworks().find(item => item.chainId === chainId),
+    [chainId],
+  );
+  // Stablecoins get an address the pipeline mints and watches; ETH and FUSE get
+  // the Safe, which is where they land and stay.
+  const { address, isError: hasAddressError, isMinted } = useWalletDepositAddress(chainId, symbol);
+  // Wirex cardholders and people with no card both land here, and only the
+  // cardholders are charged — see `getDepositFeeBps`.
+  const { provider } = useCardProvider();
+  const tokenIcon = getWalletDepositTokenIcon(chainId, symbol);
+  // The pipeline's own floor when it has answered, the committed estimate until
+  // then — never a blank, which is the one thing this line must not show.
+  const { data: depositAssets } = useDepositAssets();
+  const minimum = resolveWalletDepositMinimum(chainId, symbol, depositAssets?.assets);
+
+  // Only a minted address is watched, so only then is there anything to scan for.
+  // The Safe is not registered with the pipeline; saying "scanning" over it would
+  // be describing a poll that can never come back positive.
+  const isScanning = !!address && isMinted;
+  const { isDetected } = useDetectedDirectDeposit({
+    enabled: isScanning,
+    destinationType: CARD_FUND_DESTINATION_TYPE,
+  });
+
+  useEffect(() => {
+    if (!copied) return;
+    const timer = setTimeout(() => setCopied(false), 1500);
+    return () => clearTimeout(timer);
+  }, [copied]);
+
+  const handleCopy = useCallback(async () => {
+    if (!address) return;
+    await Clipboard.setStringAsync(address);
+    setCopied(true);
+  }, [address]);
+
+  // The list only offers chains carrying the current currency, so this should
+  // never have to change it — resolved anyway rather than trusting that.
+  const handleSelectNetwork = useCallback(
+    (nextChainId: number) => {
+      setWalletDeposit({
+        chainId: nextChainId,
+        symbol: resolveWalletDepositSymbol(nextChainId, symbol) ?? symbol,
+      });
+      setIsNetworkOpen(false);
+    },
+    [setWalletDeposit, symbol],
+  );
+
+  return (
+    <View className="gap-y-6">
+      <WalletDepositSelectors
+        chainId={chainId}
+        symbol={symbol}
+        isNetworkOpen={isNetworkOpen}
+        onToggleNetwork={() => setIsNetworkOpen(open => !open)}
+      />
+
+      {/* The card's own padding sits on each section rather than the card, so the
+          divider between the QR and the address runs its full width. */}
+      <View className="overflow-hidden rounded-[20px] bg-card">
+        <View
+          className="w-full items-center"
+          style={{ padding: CARD_PADDING }}
+          onLayout={event =>
+            setQrSize(
+              Math.min(Math.round(event.nativeEvent.layout.width) - CARD_PADDING * 2, QR_MAX_SIZE),
+            )
+          }
+        >
+          <View
+            className="items-center justify-center overflow-hidden rounded-[20px]"
+            style={{ width: qrSize, height: qrSize }}
+          >
+            {hasAddressError ? (
+              <Text className="px-6 text-center text-sm text-white/70">
+                Could not load the deposit address. Close and try again.
+              </Text>
+            ) : address ? (
+              <QRCode
+                value={address}
+                size={qrSize}
+                color="white"
+                backgroundColor="#1C1C1C"
+                // Keeps the rounded corners clear of the finder patterns: a corner
+                // clipped into is a corner a scanner can fail to locate.
+                quietZone={QR_QUIET_ZONE}
+                logo={network?.icon as ImageSourcePropType}
+                logoSize={Math.round(qrSize * 0.154)}
+                logoBorderRadius={Math.round(qrSize * 0.077)}
+                logoBackgroundColor="transparent"
+              />
+            ) : (
+              <ActivityIndicator color="white" />
+            )}
+          </View>
+        </View>
+
+        <View className="h-px bg-white/[0.08]" />
+
+        <View
+          className="flex-row items-center justify-center"
+          style={{ paddingHorizontal: CARD_PADDING, paddingVertical: CARD_PADDING * 0.75 }}
+        >
+          <Text className="text-lg font-medium text-white">
+            {address ? eclipseAddress(address, 7, 5) : '—'}
+          </Text>
+          {address ? (
+            <CopyToClipboard
+              text={address}
+              className="h-8 w-8 bg-transparent web:hover:bg-transparent web:active:bg-transparent"
+              iconClassName="text-white"
+            />
+          ) : null}
+        </View>
+      </View>
+
+      <View className="gap-y-3">
+        <View className="flex-row flex-wrap items-center justify-center gap-x-1.5 gap-y-1">
+          <Text className="text-base font-medium text-white">Send at least</Text>
+          <Image source={tokenIcon} style={INLINE_ICON_STYLE} contentFit="cover" />
+          {/* Up to 4 decimals, none forced: "10 USDC" and "0.005 ETH" both read right. */}
+          <Text className="text-base font-medium text-white">{`${formatNumber(minimum, 4, 0)} ${symbol} on the`}</Text>
+          {network?.icon ? (
+            <Image source={network.icon} style={INLINE_ICON_STYLE} contentFit="cover" />
+          ) : null}
+          <Text className="text-base font-medium text-white">{`${network?.name ?? ''} chain to this address`}</Text>
+        </View>
+        <Text className="text-center text-sm text-white/50">
+          Deposits below the minimum will not be credited or refunded
+        </Text>
+        <DepositFeeNotice
+          product="wallet"
+          provider={provider}
+          chainId={chainId}
+          symbol={symbol}
+          className="mt-2"
+        />
+        <Pressable
+          className="flex-row items-center justify-center gap-x-1 web:hover:opacity-70"
+          onPress={() => Linking.openURL(WALLET_DEPOSIT_LEARN_URL)}
+        >
+          <Text className="text-sm text-white">Learn about deposits</Text>
+          <ChevronRight color="white" size={16} />
+        </Pressable>
+      </View>
+
+      {isScanning ? (
+        <View className="flex-row items-center gap-x-2 self-center rounded-[18px] bg-[#333333] px-4 py-2">
+          <Text className="text-sm leading-4 text-white">
+            {isDetected ? 'Deposit detected' : 'Scanning for deposits'}
+          </Text>
+          <DepositScanningIndicator />
+        </View>
+      ) : null}
+
+      <Button
+        variant="brand"
+        className="h-12 w-full rounded-full"
+        onPress={handleCopy}
+        disabled={!address}
+      >
+        <Text className="text-base font-bold text-black">
+          {copied ? 'Address copied' : 'Copy address'}
+        </Text>
+      </Button>
+
+      {/* Last child, so paint order puts the open list over everything above. */}
+      {isNetworkOpen ? (
+        <WalletDepositNetworkList
+          chainId={chainId}
+          symbol={symbol}
+          onSelect={handleSelectNetwork}
+          onDismiss={() => setIsNetworkOpen(false)}
+        />
+      ) : null}
+    </View>
+  );
+};
+
+export default WalletDepositAddress;
diff --git a/components/DepositOption/__tests__/DepositFeeNotice.test.tsx b/components/DepositOption/__tests__/DepositFeeNotice.test.tsx
new file mode 100644
index 000000000..54d92ee33
--- /dev/null
+++ b/components/DepositOption/__tests__/DepositFeeNotice.test.tsx
@@ -0,0 +1,81 @@
+import React from 'react';
+import { base, fuse, mainnet } from 'viem/chains';
+
+import DepositFeeNotice from '@/components/DepositOption/DepositFeeNotice';
+import { CardProvider } from '@/lib/types';
+
+// eslint-disable-next-line @typescript-eslint/no-require-imports
+const { act, create } = require('react-test-renderer');
+
+jest.mock('@/components/ui/text', () => ({ Text: 'Text' }));
+jest.mock('@/lib/utils', () => ({
+  cn: (...classes: unknown[]) => classes.filter(Boolean).join(' '),
+}));
+
+const FEE_LINE = '0.03% fee will be charged for deposits on this network';
+
+const render = (element: React.ReactElement) => {
+  let tree: any;
+  act(() => {
+    tree = create(element);
+  });
+  const texts = tree.root.findAllByType('Text').map((node: any) => node.props.children);
+  act(() => tree.unmount());
+  return texts;
+};
+
+test('warns a Rain cardholder funding their card off Base, and not on it', () => {
+  const notice = (chainId: number) =>
+    render(
+      <DepositFeeNotice
+        product="card"
+        provider={CardProvider.RAIN}
+        chainId={chainId}
+        symbol="USDC"
+      />,
+    );
+
+  expect(notice(mainnet.id)).toEqual([FEE_LINE]);
+  expect(notice(fuse.id)).toEqual([FEE_LINE]);
+  expect(notice(base.id)).toEqual([]);
+});
+
+test('warns a Wirex cardholder sending a stablecoin to the wallet off Fuse, and only then', () => {
+  const notice = (chainId: number, symbol: string) =>
+    render(
+      <DepositFeeNotice
+        product="wallet"
+        provider={CardProvider.WIREX}
+        chainId={chainId}
+        symbol={symbol}
+      />,
+    );
+
+  expect(notice(base.id, 'USDC')).toEqual([FEE_LINE]);
+  expect(notice(mainnet.id, 'USDT')).toEqual([FEE_LINE]);
+  expect(notice(fuse.id, 'USDC')).toEqual([]);
+  expect(notice(mainnet.id, 'ETH')).toEqual([]);
+});
+
+test('shows nothing on the wallet deposit to someone with no card', () => {
+  expect(
+    render(
+      <DepositFeeNotice product="wallet" provider={null} chainId={mainnet.id} symbol="USDC" />,
+    ),
+  ).toEqual([]);
+});
+
+test("follows the vault's chain on a savings deposit", () => {
+  const notice = (chainId: number) =>
+    render(
+      <DepositFeeNotice
+        product="savings"
+        provider={CardProvider.RAIN}
+        chainId={chainId}
+        vaultToken="soUSD"
+      />,
+    );
+
+  expect(notice(mainnet.id)).toEqual([]);
+  expect(notice(base.id)).toEqual([FEE_LINE]);
+});
diff --git a/components/DepositToVault/DepositToVaultForm.tsx b/components/DepositToVault/DepositToVaultForm.tsx
index 72f5ae08f..3f74bfa8b 100644
--- a/components/DepositToVault/DepositToVaultForm.tsx
+++ b/components/DepositToVault/DepositToVaultForm.tsx
@@ -85,8 +85,15 @@ function DepositToVaultForm() {
   const { isScreenMedium } = useDimension();
   const { vault, depositConfig } = useVaultDepositConfig();
   const { data: vaultExchangeRate } = useVaultExchangeRate(vault.name);
-  const { ethereumTokens, fuseTokens, polygonTokens, baseTokens, arbitrumTokens, bscTokens } =
-    useWalletTokens();
+  const {
+    ethereumTokens,
+    fuseTokens,
+    polygonTokens,
+    baseTokens,
+    arbitrumTokens,
+    bscTokens,
+    isLoading: isLoadingWalletTokens,
+  } = useWalletTokens();
 
   // Sum across all (chain, token) pairs the selected vault accepts. If nothing
   // depositable is held in the user's wallet, show the empty state.
@@ -117,6 +124,11 @@ function DepositToVaultForm() {
     });
   }, [ethereumTokens, fuseTokens, polygonTokens, baseTokens, arbitrumTokens, bscTokens, vault]);
 
+  // Balances start empty, so "no depositable balance" only means something once
+  // they have loaded. A balance already in hand is enough to show the form even
+  // while a refresh is in flight.
+  const isBalanceUnknown = isLoadingWalletTokens && !hasDepositableBalance;
+
   const vaultToken = vault.vaultToken ?? 'soUSD';
   const vaultTokenIcon =
     vault.name === 'USDC' ? getAsset('images/sousd-4x.png') : getAsset(vault.icon);
@@ -243,6 +255,9 @@ function DepositToVaultForm() {
   const useSolidForFuse = isFuseVault && depositFromSolid;
   const useSolidForEth = isEthVault && depositFromSolid;
   const useSolidForUsdc = !isFuseVault && !isEthVault && depositFromSolid;
+  // Exactly one of the three holds whenever the deposit comes from the Solid
+  // balance, which is also when the form has no external wallet to name.
+  const isDepositFromSolid = useSolidForFuse || useSolidForEth || useSolidForUsdc;
 
   // Synthesize a TokenBalance for the WalletTokenButton when depositFromSolid
   const selectedWalletToken: TokenBalance | null = useMemo(() => {
@@ -560,18 +575,25 @@ function DepositToVaultForm() {
   return (
     <Pressable onPress={Platform.OS === 'web' ? undefined : Keyboard.dismiss}>
       <View className="gap-1">
-        <View className="gap-2">
-          <Text className="text-muted-foreground">
-            {useSolidForFuse || useSolidForEth || useSolidForUsdc ? '' : 'From wallet'}
-          </Text>
-          {!useSolidForFuse && !useSolidForEth && !useSolidForUsdc && <ConnectedWalletDropdown />}
-        </View>
+        {!isDepositFromSolid && (
+          <View className="gap-2">
+            <Text className="text-muted-foreground">From wallet</Text>
+            <ConnectedWalletDropdown />
+          </View>
+        )}
         <View className="gap-1" style={{ zIndex: 50 }}>
           <Text className="text-base text-muted-foreground">Destination</Text>
           <VaultSelectorDropdown />
         </View>
         <View className="gap-2">
-          {!hasDepositableBalance ? (
+          {isBalanceUnknown ? (
+            // This form is the savings deposit entry point, so balances are
+            // usually still in flight on first open. Waiting here keeps the user
+            // off an empty state that a loaded balance is about to contradict.
+            <View className="mt-12 items-center">
+              <ActivityIndicator size="small" color="white" />
+            </View>
+          ) : !hasDepositableBalance ? (
             <EmptyDepositTokens vault={vault} />
           ) : (
             <>
diff --git a/components/DepositToVault/EmptyDepositTokens.tsx b/components/DepositToVault/EmptyDepositTokens.tsx
index 51ea57091..2f0afd884 100644
--- a/components/DepositToVault/EmptyDepositTokens.tsx
+++ b/components/DepositToVault/EmptyDepositTokens.tsx
@@ -55,12 +55,26 @@ type EmptyDepositTokensProps = {
 
 const EmptyDepositTokens = ({ vault }: EmptyDepositTokensProps) => {
   const supportedTokens = useMemo(() => getSupportedTokens(vault), [vault]);
+  // The headline stacks the symbols ("USDC/USDT"); the sentence below reads them
+  // out ("USDC or USDT").
+  const tokenPair = supportedTokens.map(t => t.symbol).join('/');
   const tokenList = supportedTokens.map(t => t.symbol).join(' or ');
 
-  const setModal = useDepositStore(useShallow(state => state.setModal));
+  const { setModal, setDepositFromSolid } = useDepositStore(
+    useShallow(state => ({
+      setModal: state.setModal,
+      setDepositFromSolid: state.setDepositFromSolid,
+    })),
+  );
 
   const handleDepositPress = () => {
-    setModal(DEPOSIT_MODAL.OPEN_OPTIONS);
+    // There is nothing in the wallet to move into the vault, so this leaves the
+    // deposit-from-Solid flow for the one that gets money into the wallet. The
+    // flag has to go with it: left set, the steps behind "Fund your wallet"
+    // would still resolve to the vault deposit form, without the wallet
+    // provider an external deposit needs.
+    setDepositFromSolid(false);
+    setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
   };
 
   return (
@@ -88,7 +102,7 @@ const EmptyDepositTokens = ({ vault }: EmptyDepositTokensProps) => {
       </View>
       <View className="mt-3 items-center gap-1 rounded-2xl px-12">
         <Text className="text-center text-lg font-semibold text-white">
-          You don’t have {tokenList} balance
+          You don’t have {tokenPair} balance
         </Text>
         {tokenList && (
           <Text className="text-center text-sm text-muted-foreground">
@@ -98,7 +112,7 @@ const EmptyDepositTokens = ({ vault }: EmptyDepositTokensProps) => {
         )}
       </View>
       <Button variant="brand" className="mt-8 h-12 w-full rounded-xl" onPress={handleDepositPress}>
-        <Text className="text-base font-bold">Add Funds</Text>
+        <Text className="text-base font-bold">Add funds</Text>
       </Button>
     </View>
   );
diff --git a/components/Earn/EarnAssetRow.tsx b/components/Earn/EarnAssetRow.tsx
new file mode 100644
index 000000000..01b54a108
--- /dev/null
+++ b/components/Earn/EarnAssetRow.tsx
@@ -0,0 +1,53 @@
+import { Pressable, View } from 'react-native';
+
+import StockLogo from '@/components/Stocks/StockLogo';
+import Skeleton from '@/components/ui/skeleton';
+import { Text } from '@/components/ui/text';
+
+interface EarnAssetRowProps {
+  ticker: string;
+  name: string;
+  /** Secondary line: the asset's sector when browsing, the holding size when held. */
+  caption: string;
+  logoUrl?: string;
+  /** The unit price when browsing, the position's worth when held. Undefined until it lands. */
+  value?: number;
+  onPress: () => void;
+}
+
+const formatUsd = (value: number) =>
+  `$${value.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
+
+/** One tokenized asset row, in either the positions list or the catalog. */
+export const EarnAssetRow = ({
+  ticker,
+  name,
+  caption,
+  logoUrl,
+  value,
+  onPress,
+}: EarnAssetRowProps) => (
+  <Pressable
+    accessibilityLabel={`${name}, ${caption}`}
+    accessibilityRole="button"
+    onPress={onPress}
+    className="flex-row items-center gap-3 rounded-2xl py-2.5 transition-all active:opacity-70"
+  >
+    <StockLogo ticker={ticker} logoColor="#1C1C1C" logoUrl={logoUrl} size={38} />
+
+    <View className="min-w-0 flex-1 gap-0.5">
+      <Text className="text-[15px] font-semibold leading-5 text-white" numberOfLines={1}>
+        {name}
+      </Text>
+      <Text className="text-[13px] leading-4 text-white/50" numberOfLines={1}>
+        {caption}
+      </Text>
+    </View>
+
+    {value === undefined ? (
+      <Skeleton className="h-5 w-20 rounded-full bg-white/10" />
+    ) : (
+      <Text className="text-[15px] font-semibold leading-5 text-white">{formatUsd(value)}</Text>
+    )}
+  </Pressable>
+);
diff --git a/components/Earn/EarnInvestSection.tsx b/components/Earn/EarnInvestSection.tsx
new file mode 100644
index 000000000..67fa71a0f
--- /dev/null
+++ b/components/Earn/EarnInvestSection.tsx
@@ -0,0 +1,312 @@
+import { type ReactNode, useMemo, useRef, useState } from 'react';
+import {
+  type NativeScrollEvent,
+  type NativeSyntheticEvent,
+  Pressable,
+  ScrollView,
+  TextInput,
+  View,
+} from 'react-native';
+import { Href, router } from 'expo-router';
+import { Search, X } from 'lucide-react-native';
+
+import { Text } from '@/components/ui/text';
+import { useXStockHoldings } from '@/hooks/useXStockHoldings';
+import { useXStockPrices } from '@/hooks/useXStockPrices';
+import { useXStocksTokens, XStockToken } from '@/hooks/useXStocksTokens';
+
+import { EarnAssetRow } from './EarnAssetRow';
+import {
+  EARN_CATEGORIES,
+  EARN_PREVIEW_COUNT,
+  type EarnCategoryKey,
+  formatAssetName,
+  formatShares,
+  getAssetSector,
+  searchTokens,
+  selectCategoryTokens,
+} from './earnCatalog';
+
+/** Roughly seven rows — tall enough to feel like a list, short enough that the
+ *  page's own scroll is still reachable by the time you hit the bottom. */
+const EXPANDED_MAX_HEIGHT = 400;
+
+/** Rows added per page while scrolling the expanded list. */
+const EXPANDED_PAGE_SIZE = 20;
+
+/** Distance from the bottom at which the next page is pulled in. */
+const LOAD_MORE_THRESHOLD = 240;
+
+const DISCLAIMER =
+  'Tokenized assets carry market risk and can lose value. ' +
+  'Availability depends on your region. Not investment advice.';
+
+/**
+ * Trading lives on the Stocks screen, so a row hands it the ticker and the
+ * side to open on: a catalog row is something to buy, a position is something
+ * the user already owns and would be selling.
+ */
+const openStock = (token: XStockToken, action: 'buy' | 'sell' = 'buy') =>
+  router.push({ pathname: '/stocks', params: { ticker: token.symbol, action } } as Href);
+
+/**
+ * Scrolls its own rows once expanded, and is a plain View before that. The
+ * collapsed preview is short enough to sit in the page's scroll, and nesting a
+ * scroll view around it would capture drags the page should have had.
+ */
+const ListContainer = ({
+  isExpanded,
+  onScroll,
+  children,
+}: {
+  isExpanded: boolean;
+  onScroll: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
+  children: ReactNode;
+}) =>
+  isExpanded ? (
+    <ScrollView
+      style={{ maxHeight: EXPANDED_MAX_HEIGHT }}
+      nestedScrollEnabled
+      onScroll={onScroll}
+      scrollEventThrottle={16}
+      showsVerticalScrollIndicator={false}
+      keyboardShouldPersistTaps="handled"
+    >
+      {children}
+    </ScrollView>
+  ) : (
+    <View>{children}</View>
+  );
+
+/** Figma — the tokenized-asset catalog beneath the Earn vault tiles. */
+export const EarnInvestSection = () => {
+  const [activeCategory, setActiveCategory] = useState<EarnCategoryKey>('popular');
+  const [isSearching, setIsSearching] = useState(false);
+  const [query, setQuery] = useState('');
+  const [isExpanded, setIsExpanded] = useState(false);
+  const [renderLimit, setRenderLimit] = useState(EXPANDED_PAGE_SIZE);
+  const inputRef = useRef<TextInput>(null);
+
+  const { tokens } = useXStocksTokens();
+  const { holdings, isLoading: isHoldingsLoading } = useXStockHoldings();
+
+  // Holdings carry no logo of their own, so they borrow the catalog's.
+  const tokensBySymbol = useMemo(() => new Map(tokens.map(t => [t.symbol, t])), [tokens]);
+
+  // Searching scans the whole catalog; expanding drops the curation entirely
+  // and lists everything; otherwise it's the active category's curated picks.
+  const listedTokens = useMemo(() => {
+    if (isSearching && query.trim()) {
+      return searchTokens(tokens, query, isExpanded ? tokens.length : EARN_PREVIEW_COUNT);
+    }
+    return isExpanded ? tokens : selectCategoryTokens(tokens, activeCategory);
+  }, [tokens, isSearching, query, activeCategory, isExpanded]);
+
+  // Only the rows on screen are mounted, and only those get priced — the price
+  // hook is one query per ticker, so each page costs only its own new tickers.
+  const visibleTokens = useMemo(
+    () => (isExpanded ? listedTokens.slice(0, renderLimit) : listedTokens),
+    [isExpanded, listedTokens, renderLimit],
+  );
+
+  const pricedSymbols = useMemo(
+    () => [...new Set([...visibleTokens.map(t => t.symbol), ...holdings.map(h => h.ticker)])],
+    [visibleTokens, holdings],
+  );
+  const prices = useXStockPrices(pricedSymbols);
+
+  const collapse = () => {
+    setIsExpanded(false);
+    setRenderLimit(EXPANDED_PAGE_SIZE);
+  };
+
+  const expand = () => {
+    setIsExpanded(true);
+    setRenderLimit(EXPANDED_PAGE_SIZE);
+  };
+
+  // Picking a category is a request for that curated view, so it drops out of
+  // the full listing rather than filtering it.
+  const selectCategory = (key: EarnCategoryKey) => {
+    setActiveCategory(key);
+    collapse();
+  };
+
+  const handleScroll = ({ nativeEvent }: NativeSyntheticEvent<NativeScrollEvent>) => {
+    const { contentOffset, contentSize, layoutMeasurement } = nativeEvent;
+    const distanceFromEnd = contentSize.height - contentOffset.y - layoutMeasurement.height;
+
+    if (distanceFromEnd < LOAD_MORE_THRESHOLD) {
+      setRenderLimit(limit => Math.min(limit + EXPANDED_PAGE_SIZE, listedTokens.length));
+    }
+  };
+
+  const openSearch = () => {
+    setIsSearching(true);
+    // Focus lands after the input mounts on the next frame.
+    requestAnimationFrame(() => inputRef.current?.focus());
+  };
+
+  const closeSearch = () => {
+    setIsSearching(false);
+    setQuery('');
+    collapse();
+  };
+
+  // The positions panel is for people who already hold something, so it is absent
+  // rather than empty for everyone else, and held back while the holdings read is
+  // in flight: appearing and then vanishing reads worse than arriving a beat late.
+  //
+  // The catalog below is deliberately not gated on it. It is the only route from
+  // Earn into buying a first stock, so it has to render for holders and
+  // non-holders alike, and it must not wait on a chain read to do so.
+  const hasPositions = !isHoldingsLoading && holdings.length > 0;
+
+  return (
+    <View className="mt-8">
+      <Text className="text-[18px] font-semibold leading-6 text-white">Invest</Text>
+
+      {hasPositions && (
+        <>
+          <Text className="mt-1 text-[14px] leading-5 text-white/50">Your positions</Text>
+
+          <View className="mt-4 overflow-hidden rounded-[20px] bg-[#1C1C1C] px-4 py-2">
+            {holdings.map(holding => {
+              const token = tokensBySymbol.get(holding.ticker);
+              const price = prices[holding.ticker];
+
+              return (
+                <EarnAssetRow
+                  key={holding.ticker}
+                  ticker={holding.ticker}
+                  name={formatAssetName(holding.ticker, holding.name)}
+                  caption={formatShares(holding.shares)}
+                  logoUrl={token?.logoUrl}
+                  value={price === undefined ? undefined : holding.shares * price}
+                  onPress={() => token && openStock(token, 'sell')}
+                />
+              );
+            })}
+          </View>
+        </>
+      )}
+
+      {/* Falls back to the section's subtitle slot when nothing sits above it. */}
+      <Text className={`text-[14px] leading-5 text-white/50 ${hasPositions ? 'mt-6' : 'mt-1'}`}>
+        Buy, sell and use as collateral
+      </Text>
+
+      {isSearching ? (
+        <View className="my-4 h-10 flex-row items-center gap-2 rounded-full bg-[#1C1C1C] px-4">
+          <Search size={16} color="rgba(255,255,255,0.5)" />
+          <TextInput
+            ref={inputRef}
+            value={query}
+            onChangeText={setQuery}
+            placeholder="Search assets"
+            placeholderTextColor="rgba(255,255,255,0.4)"
+            autoCapitalize="none"
+            autoCorrect={false}
+            returnKeyType="search"
+            className="flex-1 bg-transparent text-[14px] text-white web:focus:outline-none"
+          />
+          <Pressable
+            accessibilityLabel="Close search"
+            accessibilityRole="button"
+            onPress={closeSearch}
+            hitSlop={8}
+            className="active:opacity-70"
+          >
+            <X size={16} color="rgba(255,255,255,0.5)" />
+          </Pressable>
+        </View>
+      ) : (
+        <View className="my-4 flex-row items-center gap-2">
+          <Pressable
+            accessibilityLabel="Search assets"
+            accessibilityRole="button"
+            onPress={openSearch}
+            className="size-9 items-center justify-center rounded-full bg-[#1C1C1C] transition-all active:opacity-70"
+          >
+            <Search size={16} color="rgba(255,255,255,0.6)" />
+          </Pressable>
+
+          <ScrollView
+            horizontal
+            showsHorizontalScrollIndicator={false}
+            contentContainerClassName="gap-2"
+            keyboardShouldPersistTaps="handled"
+          >
+            {EARN_CATEGORIES.map(category => {
+              const isActive = category.key === activeCategory;
+
+              return (
+                <Pressable
+                  key={category.key}
+                  accessibilityRole="button"
+                  accessibilityState={{ selected: isActive }}
+                  onPress={() => selectCategory(category.key)}
+                  className={`h-9 justify-center rounded-full px-4 transition-all active:opacity-80 ${
+                    isActive ? 'bg-white' : 'bg-[#1C1C1C]'
+                  }`}
+                >
+                  {/* Colour set inline, not by class: `Text` merges its own
+                      base `text-foreground` with this one, and that resolution
+                      has bitten this codebase before — see the `brand` note in
+                      ui/button.tsx, where the label intermittently came out
+                      white on a light background. A style wins outright. */}
+                  <Text
+                    className="text-[14px] font-medium leading-4"
+                    style={{ color: isActive ? '#000000' : 'rgba(255, 255, 255, 0.6)' }}
+                  >
+                    {category.label}
+                  </Text>
+                </Pressable>
+              );
+            })}
+          </ScrollView>
+        </View>
+      )}
+
+      {/* The rows group into one panel so the list reads as a single surface
+          rather than a handful of items floating on the page background. Only
+          the expanded list scrolls: a nested scroll view around the short
+          preview would swallow drags meant for the page. */}
+      <View className="overflow-hidden rounded-[20px] bg-[#1C1C1C] px-4 py-2">
+        <ListContainer isExpanded={isExpanded} onScroll={handleScroll}>
+          {visibleTokens.map(token => (
+            <EarnAssetRow
+              key={token.symbol}
+              ticker={token.symbol}
+              name={formatAssetName(token.symbol, token.name)}
+              caption={getAssetSector(token.symbol)}
+              logoUrl={token.logoUrl}
+              value={prices[token.symbol]}
+              onPress={() => openStock(token)}
+            />
+          ))}
+
+          {visibleTokens.length === 0 && (
+            <View className="items-center py-6">
+              <Text className="text-[14px] text-white/50">No assets match “{query.trim()}”</Text>
+            </View>
+          )}
+        </ListContainer>
+      </View>
+
+      <Pressable
+        accessibilityLabel={isExpanded ? 'Show fewer assets' : `Browse all ${tokens.length} assets`}
+        accessibilityRole="button"
+        accessibilityState={{ expanded: isExpanded }}
+        onPress={isExpanded ? collapse : expand}
+        className="mt-4 h-[52px] items-center justify-center rounded-full bg-[#1C1C1C] transition-all active:scale-[0.98] active:opacity-90"
+      >
+        <Text className="text-[15px] font-medium leading-5 text-white">
+          {isExpanded ? 'Show less' : `Browse all ${tokens.length} assets`}
+        </Text>
+      </Pressable>
+
+      <Text className="mt-4 text-center text-[11px] leading-4 text-white/35">{DISCLAIMER}</Text>
+    </View>
+  );
+};
diff --git a/components/Earn/EarnScreen.tsx b/components/Earn/EarnScreen.tsx
index cdb46cc9b..09b5c331f 100644
--- a/components/Earn/EarnScreen.tsx
+++ b/components/Earn/EarnScreen.tsx
@@ -10,6 +10,7 @@ import Skeleton from '@/components/ui/skeleton';
 import { Text } from '@/components/ui/text';
 import { useMaxAPY } from '@/hooks/useAnalytics';
 import { useTotalSavingsUSD } from '@/hooks/useTotalSavingsUSD';
+import { type AssetPath } from '@/lib/assets';
 import { VaultType } from '@/lib/types';
 
 import {
@@ -17,25 +18,34 @@ import {
   resolveVaultApy,
   type VaultAmounts,
 } from './earnPortfolio';
-import { EarnVaultCard } from './EarnVaultCard';
+import { EarnVaultTile } from './EarnVaultTile';
+import { useVaultDetailPrefetch } from './useVaultDetailPrefetch';
 
-const VAULT_CARDS = [
+const VAULT_TILES = [
   {
     type: VaultType.USDC,
     assetName: 'USD',
-    background: 'images/earn-usd-card-background.png' as const,
+    background: 'images/earn-usd-tile-background.png',
+    icon: 'images/earn-usd-icon.png',
   },
   {
     type: VaultType.ETH,
     assetName: 'ETH',
-    background: 'images/earn-eth-card-background.png' as const,
+    background: 'images/earn-eth-tile-background.png',
+    icon: 'images/earn-eth-icon.png',
   },
   {
     type: VaultType.FUSE,
     assetName: 'FUSE',
-    background: 'images/earn-fuse-card-background.png' as const,
+    background: 'images/earn-fuse-tile-background.png',
+    icon: 'images/earn-fuse-icon.png',
   },
-] as const;
+] as const satisfies readonly {
+  type: VaultType;
+  assetName: string;
+  background: AssetPath;
+  icon: AssetPath;
+}[];
 
 const openVault = (vaultType: VaultType) =>
   router.push({ pathname: '/savings', params: { vault: vaultType } } as Href);
@@ -46,9 +56,18 @@ const formatDailyEarnings = (value: number) =>
     maximumFractionDigits: 2,
   });
 
+/** Splits the tiles into rows so a half-width tile keeps its width when it is alone. */
+const chunkIntoRows = <T,>(items: T[], perRow = 2): T[][] =>
+  items.reduce<T[][]>((rows, item, index) => {
+    if (index % perRow === 0) rows.push([]);
+    rows[rows.length - 1].push(item);
+    return rows;
+  }, []);
+
 /** Figma 24766:2010 — the portfolio-level entry page for every savings vault. */
 export default function EarnScreen() {
   const [isHelpOpen, setIsHelpOpen] = useState(false);
+  useVaultDetailPrefetch();
   const { data: portfolioTotal, valuesByVault, isLoading } = useTotalSavingsUSD();
   const usdcApy = useMaxAPY(VaultType.USDC);
   const ethApy = useMaxAPY(VaultType.ETH);
@@ -69,6 +88,21 @@ export default function EarnScreen() {
     ? calculateEstimatedDailyEarnings(valuesByVault, apyByVault)
     : 0;
 
+  // Every vault gets a tile regardless of its rate — a vault at 0% is still
+  // somewhere to deposit, and a grid that changes shape with the rates is
+  // harder to build muscle memory for than one that doesn't.
+  const tiles = VAULT_TILES.map(vault => (
+    <EarnVaultTile
+      key={vault.type}
+      assetName={vault.assetName}
+      apy={apyByVault[vault.type]}
+      isApyLoading={apyLoadingByVault[vault.type]}
+      background={vault.background}
+      icon={vault.icon}
+      onPress={() => openVault(vault.type)}
+    />
+  ));
+
   return (
     <PageLayout
       mobileTitle={null}
@@ -101,13 +135,11 @@ export default function EarnScreen() {
 
           <BalancePillRow>
             {isLoading || areApysLoading ? (
-              <Skeleton className="h-[35px] w-[137px] rounded-full bg-white/10" />
+              <Skeleton className="h-6 w-[120px] rounded-full bg-white/10" />
             ) : (
-              <View className="h-[35px] justify-center rounded-full bg-[#1C1C1C] px-4">
-                <Text className="text-[16px] leading-[18px] text-[#94F27F]">
-                  +${formatDailyEarnings(estimatedToday)} today
-                </Text>
-              </View>
+              <Text className="text-[16px] leading-5 text-[#94F27F]">
+                +${formatDailyEarnings(estimatedToday)} today
+              </Text>
             )}
           </BalancePillRow>
         </View>
@@ -117,15 +149,11 @@ export default function EarnScreen() {
         </Text>
 
         <View className="gap-4">
-          {VAULT_CARDS.map(vault => (
-            <EarnVaultCard
-              key={vault.type}
-              assetName={vault.assetName}
-              apy={apyByVault[vault.type]}
-              background={vault.background}
-              isApyLoading={apyLoadingByVault[vault.type]}
-              onPress={() => openVault(vault.type)}
-            />
+          {chunkIntoRows(tiles).map((row, index) => (
+            <View key={index} className="flex-row gap-4">
+              {row}
+              {row.length === 1 && <View className="flex-1" />}
+            </View>
           ))}
         </View>
       </View>
diff --git a/components/Earn/EarnVaultCard.tsx b/components/Earn/EarnVaultCard.tsx
deleted file mode 100644
index 9bc3430b8..000000000
--- a/components/Earn/EarnVaultCard.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import { Pressable, StyleSheet, View } from 'react-native';
-import { Image } from 'expo-image';
-
-import Skeleton from '@/components/ui/skeleton';
-import { Text } from '@/components/ui/text';
-import { type AssetPath, getAsset } from '@/lib/assets';
-
-import { formatVaultApyLabel } from './earnPortfolio';
-
-interface EarnVaultCardProps {
-  assetName: string;
-  apy: number;
-  background: AssetPath;
-  isApyLoading: boolean;
-  onPress: () => void;
-}
-
-/** One Figma banknote-textured entry point into a savings vault. */
-export const EarnVaultCard = ({
-  assetName,
-  apy,
-  background,
-  isApyLoading,
-  onPress,
-}: EarnVaultCardProps) => (
-  <Pressable
-    accessibilityLabel={`Earn interest on ${assetName}`}
-    accessibilityRole="button"
-    onPress={onPress}
-    className="h-[149px] overflow-hidden rounded-[20px] bg-[#1C1C1C] transition-all active:scale-[0.98] active:opacity-90"
-  >
-    <Image
-      source={getAsset(background)}
-      contentFit="cover"
-      pointerEvents="none"
-      style={StyleSheet.absoluteFill}
-    />
-
-    <View className="flex-1 justify-between px-6 pb-6 pt-[25px]">
-      <View>
-        <Text className="text-[18px] font-semibold leading-5 text-white">Earn on {assetName}</Text>
-        <Text className="mt-1 text-[14px] leading-4 text-white/70">
-          Earn interest on your {assetName}
-        </Text>
-      </View>
-
-      {isApyLoading ? (
-        <Skeleton className="h-[26px] w-20 rounded-full bg-white/10" />
-      ) : (
-        <View className="h-[26px] items-center justify-center self-start rounded-full bg-white/10 px-[11px]">
-          <Text className="text-[16px] font-medium leading-4 text-[#94F27F]">
-            {formatVaultApyLabel(apy)}
-          </Text>
-        </View>
-      )}
-    </View>
-  </Pressable>
-);
diff --git a/components/Earn/EarnVaultTile.tsx b/components/Earn/EarnVaultTile.tsx
new file mode 100644
index 000000000..54554fa2f
--- /dev/null
+++ b/components/Earn/EarnVaultTile.tsx
@@ -0,0 +1,66 @@
+import { Pressable, StyleSheet, View } from 'react-native';
+import { Image } from 'expo-image';
+
+import Skeleton from '@/components/ui/skeleton';
+import { Text } from '@/components/ui/text';
+import { type AssetPath, getAsset } from '@/lib/assets';
+
+import { formatVaultApyLabel } from './earnPortfolio';
+
+interface EarnVaultTileProps {
+  assetName: string;
+  apy: number;
+  isApyLoading: boolean;
+  background: AssetPath;
+  icon: AssetPath;
+  onPress: () => void;
+}
+
+/** One textured half-width entry point into a savings vault. */
+export const EarnVaultTile = ({
+  assetName,
+  apy,
+  isApyLoading,
+  background,
+  icon,
+  onPress,
+}: EarnVaultTileProps) => (
+  <Pressable
+    accessibilityLabel={`Earn interest on ${assetName}`}
+    accessibilityRole="button"
+    onPress={onPress}
+    className="h-[170px] flex-1 overflow-hidden rounded-[20px] bg-[#1C1C1C] transition-all active:scale-[0.98] active:opacity-90"
+  >
+    <Image
+      source={getAsset(background)}
+      contentFit="fill"
+      pointerEvents="none"
+      style={StyleSheet.absoluteFill}
+    />
+
+    <View className="flex-1 justify-between p-4">
+      <View className="items-start gap-2">
+        <Text className="text-[16px] font-semibold leading-5 text-white">Earn on {assetName}</Text>
+
+        {isApyLoading ? (
+          <Skeleton className="h-[26px] w-[72px] rounded-full bg-white/10" />
+        ) : (
+          <View className="h-[26px] justify-center rounded-full border border-[#94F27F]/15 bg-[#94F27F]/10 px-[10px]">
+            <Text className="text-[14px] font-medium leading-4 text-[#94F27F]">
+              {formatVaultApyLabel(apy)}
+            </Text>
+          </View>
+        )}
+      </View>
+
+      {/* The badge circle is baked into the icon asset, so this renders at the
+          full 52px with no wrapper — a View behind it would double the ring. */}
+      <Image
+        source={getAsset(icon)}
+        contentFit="contain"
+        style={{ width: 52, height: 52 }}
+        alt={`${assetName} icon`}
+      />
+    </View>
+  </Pressable>
+);
diff --git a/components/Earn/__tests__/earnCatalog.test.ts b/components/Earn/__tests__/earnCatalog.test.ts
new file mode 100644
index 000000000..875286682
--- /dev/null
+++ b/components/Earn/__tests__/earnCatalog.test.ts
@@ -0,0 +1,133 @@
+import {
+  EARN_PREVIEW_COUNT,
+  formatAssetName,
+  formatShares,
+  getAssetSector,
+  searchTokens,
+  selectCategoryTokens,
+} from '@/components/Earn/earnCatalog';
+import { XStockToken } from '@/hooks/useXStocksTokens';
+
+const token = (symbol: string, name = `${symbol} name`): XStockToken => ({
+  symbol,
+  name,
+  contractAddress: '0x0000000000000000000000000000000000000000',
+  logoUrl: `https://example.test/${symbol}.png`,
+});
+
+describe('formatAssetName', () => {
+  it('drops the issuer suffix from the display name', () => {
+    expect(formatAssetName('TSLAx', 'Tesla xStock')).toBe('Tesla');
+  });
+
+  it('leaves a name without the suffix untouched', () => {
+    expect(formatAssetName('TSLAx', 'Tesla')).toBe('Tesla');
+  });
+
+  it('keeps the original name when stripping would leave nothing', () => {
+    expect(formatAssetName('WEIRDx', 'xStock')).toBe('xStock');
+  });
+
+  it('prefers the curated name over an unhelpful issuer name', () => {
+    expect(formatAssetName('VTIx', 'Vanguard xStock')).toBe('Total Market ETF');
+    expect(formatAssetName('SPYx', 'SP 500 xStock')).toBe('S&P 500 ETF');
+    expect(formatAssetName('PALLx', 'abrdn Physical Palladium Shares xStock')).toBe('Palladium');
+  });
+});
+
+describe('getAssetSector', () => {
+  it('returns the curated sector caption', () => {
+    expect(getAssetSector('TSLAx')).toBe('Equity · Auto');
+    expect(getAssetSector('GLDx')).toBe('Metals · Gold');
+  });
+
+  it('falls back for a ticker with no caption', () => {
+    expect(getAssetSector('WHOKNOWSx')).toBe('Tokenized equity');
+  });
+});
+
+describe('selectCategoryTokens', () => {
+  const tokens = [token('NVDAx'), token('SPYx'), token('TSLAx'), token('VTIx'), token('GLDx')];
+
+  it('returns the curated order, not the source order', () => {
+    expect(selectCategoryTokens(tokens, 'popular').map(t => t.symbol)).toEqual([
+      'TSLAx',
+      'SPYx',
+      'NVDAx',
+      'VTIx',
+    ]);
+  });
+
+  it('skips curated tickers that are not in the token list', () => {
+    expect(selectCategoryTokens([token('SPYx')], 'popular').map(t => t.symbol)).toEqual(['SPYx']);
+  });
+
+  it('caps the preview at the requested limit', () => {
+    expect(selectCategoryTokens(tokens, 'popular', 2)).toHaveLength(2);
+  });
+
+  it('previews five rows by default', () => {
+    expect(EARN_PREVIEW_COUNT).toBe(5);
+  });
+});
+
+describe('searchTokens', () => {
+  const tokens = [
+    token('NVDAx', 'NVIDIA xStock'),
+    token('TSLAx', 'Tesla xStock'),
+    token('VTIx', 'Vanguard xStock'),
+    token('SPYx', 'SP 500 xStock'),
+  ];
+
+  it('matches on ticker', () => {
+    expect(searchTokens(tokens, 'nvda').map(t => t.symbol)).toEqual(['NVDAx']);
+  });
+
+  it('matches on display name, case-insensitively', () => {
+    expect(searchTokens(tokens, 'tesla').map(t => t.symbol)).toEqual(['TSLAx']);
+  });
+
+  it('searches the curated name, not the issuer name', () => {
+    // VTIx is "Vanguard xStock" upstream but shown as "Total Market ETF".
+    expect(searchTokens(tokens, 'total market').map(t => t.symbol)).toEqual(['VTIx']);
+  });
+
+  it('ranks a ticker prefix above a mid-name match', () => {
+    const [first] = searchTokens(
+      [token('SPCXx', 'SpaceX xStock'), token('SPYx', 'SP 500 xStock')],
+      'sp',
+    );
+    expect(first.symbol).toBe('SPCXx');
+  });
+
+  it('returns nothing for a blank query', () => {
+    expect(searchTokens(tokens, '   ')).toEqual([]);
+  });
+
+  it('returns nothing when there is no match', () => {
+    expect(searchTokens(tokens, 'zzzz')).toEqual([]);
+  });
+
+  it('caps results at the limit', () => {
+    expect(searchTokens(tokens, 'x', 2)).toHaveLength(2);
+  });
+});
+
+describe('formatShares', () => {
+  it('always shows two decimals, so a column of holdings aligns', () => {
+    expect(formatShares(4.2)).toBe('4.20 shares');
+    expect(formatShares(14.2)).toBe('14.20 shares');
+  });
+
+  it('groups thousands', () => {
+    expect(formatShares(1234.5)).toBe('1,234.50 shares');
+  });
+
+  it('rounds beyond two decimals rather than overflowing the row', () => {
+    expect(formatShares(0.123456)).toBe('0.12 shares');
+  });
+
+  it('singularises exactly one share', () => {
+    expect(formatShares(1)).toBe('1.00 share');
+  });
+});
diff --git a/components/Earn/__tests__/earnPortfolio.test.ts b/components/Earn/__tests__/earnPortfolio.test.ts
index 66bdf9279..e5128bdf9 100644
--- a/components/Earn/__tests__/earnPortfolio.test.ts
+++ b/components/Earn/__tests__/earnPortfolio.test.ts
@@ -59,7 +59,8 @@ describe('resolveVaultApy', () => {
 });
 
 describe('formatVaultApyLabel', () => {
-  it('includes the percent symbol in the APY label', () => {
+  it('renders one decimal place, matching the vault tile design', () => {
     expect(formatVaultApyLabel(4.5)).toBe('4.5% APY');
+    expect(formatVaultApyLabel(4)).toBe('4.0% APY');
   });
 });
diff --git a/components/Earn/earnCatalog.ts b/components/Earn/earnCatalog.ts
new file mode 100644
index 000000000..88004e3b8
--- /dev/null
+++ b/components/Earn/earnCatalog.ts
@@ -0,0 +1,151 @@
+import { XStockToken } from '@/hooks/useXStocksTokens';
+
+export type EarnCategoryKey = 'popular' | 'tech' | 'etf' | 'metals';
+
+export const EARN_CATEGORIES: { key: EarnCategoryKey; label: string }[] = [
+  { key: 'popular', label: 'Popular' },
+  { key: 'tech', label: 'Tech' },
+  { key: 'etf', label: 'ETFs' },
+  { key: 'metals', label: 'Metals' },
+];
+
+/**
+ * Curated, ordered picks per category. Order is the display order — the Earn
+ * page only previews the first few, so the strongest names lead each list.
+ */
+const CATEGORY_TICKERS: Record<EarnCategoryKey, string[]> = {
+  popular: ['TSLAx', 'SPCXx', 'SPYx', 'NVDAx', 'VTIx', 'AAPLx', 'COINx', 'PLTRx'],
+  tech: ['AAPLx', 'NVDAx', 'MSFTx', 'GOOGLx', 'METAx', 'AMZNx', 'AMDx', 'AVGOx'],
+  etf: ['SPYx', 'QQQx', 'VTIx', 'VOOx', 'IWMx', 'SMHx', 'SGOVx', 'IEMGx'],
+  metals: ['GLDx', 'SLVx', 'PPLTx', 'PALLx', 'GDXx', 'COPXx', 'URAx'],
+};
+
+/**
+ * Sector caption shown under each name. Kept explicit rather than derived from
+ * the token name so the list reads like a brokerage screen instead of repeating
+ * the issuer's "… xStock" naming.
+ */
+const SECTOR_BY_TICKER: Record<string, string> = {
+  AAPLx: 'Equity · Consumer tech',
+  AMDx: 'Equity · Semis',
+  AMZNx: 'Equity · E-commerce',
+  AVGOx: 'Equity · Semis',
+  COINx: 'Equity · Crypto',
+  COPXx: 'Metals · Copper miners',
+  GDXx: 'Metals · Gold miners',
+  GLDx: 'Metals · Gold',
+  GOOGLx: 'Equity · Internet',
+  IEMGx: 'Index · Emerging markets',
+  IWMx: 'Index · Small cap',
+  METAx: 'Equity · Social',
+  MSFTx: 'Equity · Software',
+  NVDAx: 'Equity · Semis',
+  PALLx: 'Metals · Palladium',
+  PLTRx: 'Equity · Software',
+  PPLTx: 'Metals · Platinum',
+  QQQx: 'Index · Nasdaq-100',
+  SGOVx: 'Index · Treasuries',
+  SLVx: 'Metals · Silver',
+  SMHx: 'Index · Semis',
+  SPCXx: 'Equity · Space',
+  SPYx: 'Index · S&P 500',
+  TSLAx: 'Equity · Auto',
+  URAx: 'Metals · Uranium',
+  VOOx: 'Index · S&P 500',
+  VTIx: 'Index · Total market',
+};
+
+const DEFAULT_SECTOR = 'Tokenized equity';
+
+/**
+ * Display names for tickers whose issuer name reads badly in a list — either
+ * because it is the fund house rather than the fund ("Vanguard" for VTI) or
+ * because it is the full legal name ("abrdn Physical Palladium Shares").
+ */
+const NAME_OVERRIDES: Record<string, string> = {
+  COPXx: 'Copper Miners ETF',
+  GDXx: 'Gold Miners ETF',
+  IEMGx: 'Emerging Markets ETF',
+  IWMx: 'Russell 2000 ETF',
+  NVDAx: 'Nvidia',
+  PALLx: 'Palladium',
+  PPLTx: 'Platinum',
+  QQQx: 'Nasdaq-100 ETF',
+  SGOVx: 'Treasury Bond ETF',
+  SLVx: 'Silver',
+  SMHx: 'Semiconductor ETF',
+  SPYx: 'S&P 500 ETF',
+  URAx: 'Uranium ETF',
+  VOOx: 'Vanguard S&P 500',
+  VTIx: 'Total Market ETF',
+};
+
+/** How many rows the Earn page previews before the "Browse all" CTA. */
+export const EARN_PREVIEW_COUNT = 5;
+
+/** "Tesla xStock" → "Tesla" — the wrapper suffix is noise in a list of names. */
+export const formatAssetName = (ticker: string, name: string) => {
+  const override = NAME_OVERRIDES[ticker];
+  if (override) return override;
+
+  return name.replace(/\s*xstock$/i, '').trim() || name;
+};
+
+export const getAssetSector = (ticker: string) => SECTOR_BY_TICKER[ticker] ?? DEFAULT_SECTOR;
+
+/**
+ * Resolve a category's curated tickers against the tokens we actually have,
+ * preserving the curated order and silently dropping anything unlisted so a
+ * catalog change can never leave a hole in the row list.
+ */
+export const selectCategoryTokens = (
+  tokens: XStockToken[],
+  category: EarnCategoryKey,
+  limit = EARN_PREVIEW_COUNT,
+): XStockToken[] => {
+  const bySymbol = new Map(tokens.map(token => [token.symbol, token]));
+
+  return CATEGORY_TICKERS[category]
+    .map(symbol => bySymbol.get(symbol))
+    .filter((token): token is XStockToken => !!token)
+    .slice(0, limit);
+};
+
+/**
+ * Free-text search across the whole catalog, not just the active category.
+ * Ticker matches rank above name matches, and a prefix match above a match
+ * buried mid-string, so typing "NV" surfaces NVDAx rather than every name
+ * that happens to contain those letters.
+ */
+export const searchTokens = (
+  tokens: XStockToken[],
+  query: string,
+  limit = EARN_PREVIEW_COUNT,
+): XStockToken[] => {
+  const needle = query.trim().toLowerCase();
+  if (!needle) return [];
+
+  const scored = tokens
+    .map(token => {
+      const symbol = token.symbol.toLowerCase();
+      const name = formatAssetName(token.symbol, token.name).toLowerCase();
+
+      if (symbol.startsWith(needle)) return { token, score: 0 };
+      if (name.startsWith(needle)) return { token, score: 1 };
+      if (symbol.includes(needle)) return { token, score: 2 };
+      if (name.includes(needle)) return { token, score: 3 };
+      return null;
+    })
+    .filter((match): match is { token: XStockToken; score: number } => !!match);
+
+  return scored
+    .sort((a, b) => a.score - b.score)
+    .slice(0, limit)
+    .map(match => match.token);
+};
+
+/** "4.21 shares" — the secondary line on a held position. */
+export const formatShares = (shares: number) =>
+  `${shares.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })} ${
+    shares === 1 ? 'share' : 'shares'
+  }`;
diff --git a/components/Earn/useVaultDetailPrefetch.ts b/components/Earn/useVaultDetailPrefetch.ts
new file mode 100644
index 000000000..9332d724a
--- /dev/null
+++ b/components/Earn/useVaultDetailPrefetch.ts
@@ -0,0 +1,38 @@
+import { useEffect } from 'react';
+import { InteractionManager } from 'react-native';
+import { useQueryClient } from '@tanstack/react-query';
+
+import { VAULTS } from '@/constants/vaults';
+import {
+  DEFAULT_HISTORICAL_APY_DAYS,
+  historicalApyQueryOptions,
+  vaultBreakdownQueryOptions,
+} from '@/hooks/useAnalytics';
+
+/**
+ * Warms the two queries the vault detail screen cannot inherit from Earn.
+ *
+ * Balances and APYs are already prefetched app-wide in `(protected)/_layout`,
+ * but the APY history and strategy breakdown are keyed per vault, so opening
+ * USD leaves ETH and FUSE just as cold — which is why every tile felt slow the
+ * first time it was tapped rather than only the first tile.
+ *
+ * Deferred until after interactions so these six requests queue behind Earn's
+ * own balance reads rather than competing with them for the connection.
+ */
+export const useVaultDetailPrefetch = () => {
+  const queryClient = useQueryClient();
+
+  useEffect(() => {
+    const task = InteractionManager.runAfterInteractions(() => {
+      for (const vault of VAULTS) {
+        queryClient.prefetchQuery(
+          historicalApyQueryOptions(DEFAULT_HISTORICAL_APY_DAYS, vault.type),
+        );
+        queryClient.prefetchQuery(vaultBreakdownQueryOptions(vault.name.toLowerCase()));
+      }
+    });
+
+    return () => task.cancel();
+  }, [queryClient]);
+};
diff --git a/components/Home/NewHome/OtherBalancesDropdown/index.tsx b/components/Home/NewHome/OtherBalancesDropdown/index.tsx
index b2c7677d2..483a2796f 100644
--- a/components/Home/NewHome/OtherBalancesDropdown/index.tsx
+++ b/components/Home/NewHome/OtherBalancesDropdown/index.tsx
@@ -320,12 +320,12 @@ export const SavingsBalanceRow = ({
 }) => (
   <BalanceRow color={SAVINGS_COLOR} label="Savings" value={savingsBalance} isLoading={isLoading}>
     <DepositTrigger
-      modal={DEPOSIT_MODAL.OPEN_SAVINGS_FUND}
+      modal={DEPOSIT_MODAL.OPEN_FORM}
       preserveSelectedVault
       source="home_other_balances"
       onBeforeOpen={() => {
         onDismiss?.();
-        useDepositStore.getState().setDepositFromSolid(false);
+        useDepositStore.getState().setDepositFromSolid(true);
       }}
       trigger={<AddButton />}
     />
diff --git a/components/Home/NewHome/WalletActions.tsx b/components/Home/NewHome/WalletActions.tsx
index 7911e1cb5..99bbe7790 100644
--- a/components/Home/NewHome/WalletActions.tsx
+++ b/components/Home/NewHome/WalletActions.tsx
@@ -4,7 +4,6 @@ import { Platform, Pressable, StyleSheet, useWindowDimensions, View } from 'reac
 import HomeSend from '@/assets/images/home-send';
 import HomeSwap from '@/assets/images/home-swap';
 import CardDirectDepositModal from '@/components/Card/CardDirectDepositModal';
-import WirexCardFundModal from '@/components/Card/WirexCardFundModal';
 import DepositOptionModal from '@/components/DepositOption/DepositOptionModal';
 import SendModal from '@/components/Send/SendModal';
 import SlotTrigger from '@/components/SlotTrigger';
@@ -105,28 +104,22 @@ interface WalletActionsProps {
  *
  * - Rain cardholder → the card's direct-deposit address. The card is prefunded, so
  *   money has to land on the card itself before it can be spent.
- * - Wirex cardholder → the same "Fund your card" flow over the same deposit address,
- *   stablecoins only. Their card holds no balance of its own (Wirex pays the merchant
- *   and we take the stablecoin from their Safe on settlement), so the backend delivers
- *   the deposit to their Safe on Fuse rather than to a card — see `WirexCardFundModal`.
- *   `canDepositToCard` stays false for them: it answers "does this card hold a
- *   balance", which still governs the card action row and the balance breakdown.
- * - No card → the wallet deposit flow, unchanged.
+ * - Wirex cardholder → the wallet deposit flow, the same as someone with no card at
+ *   all. Their card holds no balance of its own: Wirex pays the merchant and we take
+ *   the stablecoin from their Safe on settlement, so funding the wallet IS funding the
+ *   card and a separate card-funding flow would be the same destination under another
+ *   name. `canDepositToCard` stays false for them, which is what routes them here.
+ * - No card → the wallet deposit flow.
  */
 const WalletActions = ({ hasFunds, hasCard }: WalletActionsProps) => {
   const { width } = useWindowDimensions();
   const { provider } = useCardProvider();
   const fundsGoToCard = Boolean(hasCard) && canDepositToCard(provider);
-  // Only a cardholder whose card cannot be deposited into, i.e. Wirex. A user with
-  // no card keeps the wallet route: savings is one of the places their money can
-  // go, not the only one.
-  const fundsGoToWirexCard = Boolean(hasCard) && !fundsGoToCard;
   // Only the crowded three-pill row needs to shrink; alone, "Add Funds" always fits.
   const compact = hasFunds && width > 0 && width < COMPACT_WIDTH;
   const showSwap = hasFunds && Platform.OS !== 'ios';
   const addFundsTrigger = <AddFundsTrigger fullWidth={!hasFunds} compact={compact} />;
   const [isCardModalOpen, setIsCardModalOpen] = useState(false);
-  const [isWirexModalOpen, setIsWirexModalOpen] = useState(false);
 
   return (
     <View className={cn('flex-row items-center', compact ? 'gap-2 px-3' : 'gap-3 px-4')}>
@@ -139,14 +132,6 @@ const WalletActions = ({ hasFunds, hasCard }: WalletActionsProps) => {
             <SlotTrigger onPress={() => setIsCardModalOpen(true)}>{addFundsTrigger}</SlotTrigger>
             <CardDirectDepositModal isOpen={isCardModalOpen} onOpenChange={setIsCardModalOpen} />
           </>
-        ) : fundsGoToWirexCard ? (
-          // Same SlotTrigger + controlled isOpen as the Rain branch above, and for
-          // the same reason: ResponsiveModal's own trigger prop routes through an
-          // asChild Slot chain that drops the pill's padding classes.
-          <>
-            <SlotTrigger onPress={() => setIsWirexModalOpen(true)}>{addFundsTrigger}</SlotTrigger>
-            <WirexCardFundModal isOpen={isWirexModalOpen} onOpenChange={setIsWirexModalOpen} />
-          </>
         ) : (
           <DepositOptionModal trigger={addFundsTrigger} />
         )}
diff --git a/components/ResponsiveModal.tsx b/components/ResponsiveModal.tsx
index 1ee783ad2..ebef21978 100644
--- a/components/ResponsiveModal.tsx
+++ b/components/ResponsiveModal.tsx
@@ -73,6 +73,16 @@ export interface ResponsiveModalProps {
    * overflowing and the overlay scrolling the header away).
    */
   fillViewportHeight?: boolean;
+  /**
+   * How the modal presents itself below the medium breakpoint.
+   *
+   * `sheet` (the default) is the near-full-screen card the multi-step deposit and
+   * send flows use: top-aligned under a 5vh gap and stretched to the bottom edge.
+   * `drawer` anchors a content-sized card to the bottom of the screen instead —
+   * for short, self-contained choices. Desktop is unaffected: both present as the
+   * usual centred modal.
+   */
+  mobilePresentation?: 'sheet' | 'drawer';
   /** Present the dialog edge-to-edge on iOS and Android. */
   nativeFullScreen?: boolean;
 }
@@ -100,11 +110,16 @@ const ResponsiveModal = ({
   disableScroll = false,
   hideHeader = false,
   fillViewportHeight = false,
+  mobilePresentation = 'sheet',
   nativeFullScreen = false,
 }: ResponsiveModalProps) => {
   const { isScreenMedium } = useDimension();
   const insets = useSafeAreaInsets();
-  const isNativeSmallScreen = Platform.OS !== 'web' && !isScreenMedium;
+  const isNativeSmall = Platform.OS !== 'web' && !isScreenMedium;
+  const isDrawer = mobilePresentation === 'drawer' && !isScreenMedium;
+  // A drawer is sized by its content, so it opts out of the stretched-to-the-
+  // bottom layout the full-height mobile sheet uses.
+  const isNativeSmallScreen = isNativeSmall && !isDrawer;
   // On web, opt into the flex layout (header fixed, body scrolls) that native
   // small screens already use, capping the card to the viewport (see below).
   const webFill = fillViewportHeight && Platform.OS === 'web';
@@ -175,15 +190,21 @@ const ResponsiveModal = ({
       <DialogContent
         style={useNativeFullScreen ? { height: '100%', maxHeight: '100%' } : undefined}
         overlayClassName={overlayClassName}
+        webPresentation={isDrawer ? 'bottom-sheet' : 'modal'}
+        nativePresentation={isDrawer ? 'bottom-sheet' : 'modal'}
         className={cn(
           // Desktop popups get a uniform 40px inset. Three of the four sides live
           // here; the bottom stays 0 so the scroll viewport (and its bottom fade)
           // reaches the card edge, and the matching 40px goes on the scroll
           // content container below.
           'px-4 pb-0 pt-4 md:max-w-lg md:px-10 md:pb-0 md:pt-10',
-          !isScreenMedium && !useNativeFullScreen
+          // `justify-start` is what DialogContent reads to top-align the sheet, so
+          // it is deliberately absent from the drawer, which anchors to the bottom,
+          // and from the full-screen presentation, which owns the whole viewport.
+          !isScreenMedium && !isDrawer && !useNativeFullScreen
             ? 'mt-[5vh] w-screen max-w-full justify-start'
             : '',
+          isDrawer ? 'w-screen max-w-full rounded-b-none rounded-t-[30px] pt-3' : '',
           useNativeFullScreen && 'h-full max-h-full w-full max-w-none rounded-none p-0',
           webFill && 'max-h-[90vh]',
           contentClassName, // Put last so overrides take effect
@@ -282,7 +303,7 @@ const ResponsiveModal = ({
                     // indicator / gesture bar on top of the base pb-4.
                     contentContainerStyle={{
                       ...(useFixedHeightLayout ? { flexGrow: 1 } : null),
-                      ...(isNativeSmallScreen ? { paddingBottom: 16 + insets.bottom } : null),
+                      ...(isNativeSmall ? { paddingBottom: 16 + insets.bottom } : null),
                     }}
                     style={useFixedHeightLayout ? { flex: 1 } : undefined}
                     showsVerticalScrollIndicator={false}
diff --git a/components/Savings/EmptyState.tsx b/components/Savings/EmptyState.tsx
index cdf1b96b7..63436f414 100644
--- a/components/Savings/EmptyState.tsx
+++ b/components/Savings/EmptyState.tsx
@@ -35,11 +35,11 @@ export default function SavingsEmptyState() {
                 <DashboardHeaderButtons hideSend hideDeposit />
                 <DepositTrigger
                   buttonText="Deposit"
-                  modal={DEPOSIT_MODAL.OPEN_SAVINGS_FUND}
+                  modal={DEPOSIT_MODAL.OPEN_FORM}
                   preserveSelectedVault
                   source="savings_empty_state_header"
                   onBeforeOpen={() => {
-                    useDepositStore.getState().setDepositFromSolid(false);
+                    useDepositStore.getState().setDepositFromSolid(true);
                   }}
                 />
               </View>
diff --git a/components/Savings/NewSavings/SavingsFundedActions.tsx b/components/Savings/NewSavings/SavingsFundedActions.tsx
index 88b93680e..9ac12dc93 100644
--- a/components/Savings/NewSavings/SavingsFundedActions.tsx
+++ b/components/Savings/NewSavings/SavingsFundedActions.tsx
@@ -3,11 +3,8 @@ import { Pressable, View } from 'react-native';
 import DepositTrigger from '@/components/DepositOption/DepositTrigger';
 import { Text } from '@/components/ui/text';
 import UnstakeModal from '@/components/Unstake/UnstakeModal';
-import { DEPOSIT_MODAL } from '@/constants/modals';
-import { VAULTS } from '@/constants/vaults';
+import { useVaultDepositEntry } from '@/hooks/useVaultDepositEntry';
 import { VaultType } from '@/lib/types';
-import { useDepositStore } from '@/store/useDepositStore';
-import { useSavingStore } from '@/store/useSavingStore';
 
 // Both DepositTrigger and UnstakeModal inject onPress via SlotTrigger.cloneElement,
 // so these trigger components MUST forward props to their root Pressable.
@@ -39,19 +36,15 @@ interface SavingsFundedActionsProps {
  * (unstake). Deposit pre-selects the currently chosen vault.
  */
 const SavingsFundedActions = ({ vaultType }: SavingsFundedActionsProps) => {
+  const { modal, onBeforeOpen } = useVaultDepositEntry(vaultType);
+
   return (
     <View className="flex-row items-center gap-3 px-4">
       <DepositTrigger
-        modal={DEPOSIT_MODAL.OPEN_SAVINGS_FUND}
+        modal={modal}
         preserveSelectedVault
         source="savings_add_funds"
-        onBeforeOpen={() => {
-          const index = VAULTS.findIndex(vault => vault.type === vaultType);
-          if (index >= 0) {
-            useSavingStore.getState().selectVaultForDeposit(index);
-          }
-          useDepositStore.getState().setDepositFromSolid(false);
-        }}
+        onBeforeOpen={onBeforeOpen}
         trigger={<DepositTriggerButton />}
       />
       <UnstakeModal trigger={<WithdrawTrigger />} />
diff --git a/components/Savings/NewSavings/StartEarningButton.tsx b/components/Savings/NewSavings/StartEarningButton.tsx
index 7df07b67d..fdacae412 100644
--- a/components/Savings/NewSavings/StartEarningButton.tsx
+++ b/components/Savings/NewSavings/StartEarningButton.tsx
@@ -2,12 +2,9 @@ import { Pressable, View } from 'react-native';
 
 import DepositTrigger from '@/components/DepositOption/DepositTrigger';
 import { Text } from '@/components/ui/text';
-import { DEPOSIT_MODAL } from '@/constants/modals';
-import { VAULTS } from '@/constants/vaults';
+import { useVaultDepositEntry } from '@/hooks/useVaultDepositEntry';
 import { VaultType } from '@/lib/types';
 import { cn } from '@/lib/utils';
-import { useDepositStore } from '@/store/useDepositStore';
-import { useSavingStore } from '@/store/useSavingStore';
 
 // DepositTrigger injects its open handler via SlotTrigger.cloneElement({ onPress }),
 // so this trigger MUST forward props to its root Pressable (same rule as the
@@ -44,19 +41,15 @@ const StartEarningButton = ({
   source = 'savings_start_earning',
   className,
 }: StartEarningButtonProps) => {
+  const { modal, onBeforeOpen } = useVaultDepositEntry(vaultType);
+
   return (
     <View className={cn('px-4', className)}>
       <DepositTrigger
-        modal={DEPOSIT_MODAL.OPEN_SAVINGS_FUND}
+        modal={modal}
         preserveSelectedVault
         source={source}
-        onBeforeOpen={() => {
-          const index = VAULTS.findIndex(vault => vault.type === vaultType);
-          if (index >= 0) {
-            useSavingStore.getState().selectVaultForDeposit(index);
-          }
-          useDepositStore.getState().setDepositFromSolid(false);
-        }}
+        onBeforeOpen={onBeforeOpen}
         trigger={<DepositTriggerButton label={label} />}
       />
     </View>
diff --git a/components/Savings/NewSavings/VaultApyHistoryCard.tsx b/components/Savings/NewSavings/VaultApyHistoryCard.tsx
index 88067915c..94bd2d048 100644
--- a/components/Savings/NewSavings/VaultApyHistoryCard.tsx
+++ b/components/Savings/NewSavings/VaultApyHistoryCard.tsx
@@ -6,7 +6,7 @@ import BarChart from '@/components/BarChart';
 import TooltipPopover from '@/components/Tooltip';
 import Skeleton from '@/components/ui/skeleton';
 import { Text } from '@/components/ui/text';
-import { useAPYs, useHistoricalAPY } from '@/hooks/useAnalytics';
+import { DEFAULT_HISTORICAL_APY_DAYS, useAPYs, useHistoricalAPY } from '@/hooks/useAnalytics';
 import { useDimension } from '@/hooks/useDimension';
 import { APYs, VaultType } from '@/lib/types';
 import { cn } from '@/lib/utils';
@@ -24,8 +24,11 @@ type ApyPeriod = {
   valueKey: keyof Pick<APYs, 'sevenDay' | 'fifteenDay' | 'thirtyDay'>;
 };
 
+// The first entry is what the card opens on, and therefore what Earn prefetches
+// (see useVaultDetailPrefetch). Reordering these without moving
+// DEFAULT_HISTORICAL_APY_DAYS makes that prefetch miss, silently.
 const APY_PERIODS: ApyPeriod[] = [
-  { days: '7', label: '7D', title: '7 Day APY', valueKey: 'sevenDay' },
+  { days: DEFAULT_HISTORICAL_APY_DAYS, label: '7D', title: '7 Day APY', valueKey: 'sevenDay' },
   { days: '15', label: '15D', title: '15 Day APY', valueKey: 'fifteenDay' },
   { days: '30', label: '30D', title: '30 Day APY', valueKey: 'thirtyDay' },
 ];
diff --git a/components/Savings/SavingDepositButton.tsx b/components/Savings/SavingDepositButton.tsx
index 357e7cf9d..5743b7aab 100644
--- a/components/Savings/SavingDepositButton.tsx
+++ b/components/Savings/SavingDepositButton.tsx
@@ -21,11 +21,11 @@ const SavingDepositButton = () => {
 
   return (
     <DepositTrigger
-      modal={DEPOSIT_MODAL.OPEN_SAVINGS_FUND}
+      modal={DEPOSIT_MODAL.OPEN_FORM}
       preserveSelectedVault
       source="savings_empty_state"
       onBeforeOpen={() => {
-        useDepositStore.getState().setDepositFromSolid(false);
+        useDepositStore.getState().setDepositFromSolid(true);
       }}
       trigger={getTrigger()}
     />
diff --git a/components/Savings/SavingsFund/SavingsFundDepositAddress.tsx b/components/Savings/SavingsFund/SavingsFundDepositAddress.tsx
index 908a3759e..c8794bdcd 100644
--- a/components/Savings/SavingsFund/SavingsFundDepositAddress.tsx
+++ b/components/Savings/SavingsFund/SavingsFundDepositAddress.tsx
@@ -9,6 +9,7 @@ import { ChevronDown, ChevronRight } from 'lucide-react-native';
 import CardFundGroup from '@/components/Card/CardFund/CardFundGroup';
 import CardFundRow from '@/components/Card/CardFund/CardFundRow';
 import CopyToClipboard from '@/components/CopyToClipboard';
+import DepositFeeNotice from '@/components/DepositOption/DepositFeeNotice';
 import {
   getSavingsFundNetworks,
   getSavingsFundToken,
@@ -17,6 +18,7 @@ import {
 } from '@/components/Savings/SavingsFund/constants';
 import { Button } from '@/components/ui/button';
 import { Text } from '@/components/ui/text';
+import { useCardProvider } from '@/hooks/useCardProvider';
 import { useDetectedDirectDeposit } from '@/hooks/useDetectedDirectDeposit';
 import { DetectedDirectDepositResponse } from '@/lib/types';
 import { eclipseAddress } from '@/lib/utils';
@@ -83,6 +85,7 @@ const SavingsFundDepositAddress = ({
     [symbol, chainId],
   );
   const vaultToken = getSavingsFundToken(symbol).vaultToken;
+  const { provider } = useCardProvider();
 
   useEffect(() => {
     if (!copied) return;
@@ -163,6 +166,13 @@ const SavingsFundDepositAddress = ({
         {`Send ${symbol} on ${network?.name ?? 'the selected network'} — it is deposited into savings as ${vaultToken}.`}
       </Text>
 
+      <DepositFeeNotice
+        product="savings"
+        provider={provider}
+        chainId={chainId}
+        vaultToken={vaultToken}
+      />
+
       <Pressable
         className="flex-row items-center justify-center gap-x-1 web:hover:opacity-70"
         onPress={() => Linking.openURL(SAVINGS_FUND_LEARN_URL)}
diff --git a/components/Savings/SavingsHeaderButtonsMobile.tsx b/components/Savings/SavingsHeaderButtonsMobile.tsx
index c14be307c..a46129dca 100644
--- a/components/Savings/SavingsHeaderButtonsMobile.tsx
+++ b/components/Savings/SavingsHeaderButtonsMobile.tsx
@@ -50,11 +50,11 @@ const SavingsHeaderButtonsMobile = ({
   return (
     <View className="flex-row items-center justify-center gap-8">
       <DepositTrigger
-        modal={DEPOSIT_MODAL.OPEN_SAVINGS_FUND}
+        modal={DEPOSIT_MODAL.OPEN_FORM}
         preserveSelectedVault
         source="savings_mobile"
         onBeforeOpen={() => {
-          useDepositStore.getState().setDepositFromSolid(false);
+          useDepositStore.getState().setDepositFromSolid(true);
         }}
         trigger={
           <CircleButton
diff --git a/components/Stocks/BuyStockModal.tsx b/components/Stocks/BuyStockModal.tsx
index b8acadcfd..cc0153fc3 100644
--- a/components/Stocks/BuyStockModal.tsx
+++ b/components/Stocks/BuyStockModal.tsx
@@ -53,12 +53,32 @@ type BuyStockModalProps = {
   isOpen: boolean;
   onClose: () => void;
   trigger: React.ReactNode;
+  /**
+   * Pre-selects a stock so the flow opens on the amount step instead of the
+   * picker — used when the user already named one by tapping its row. Callers
+   * must key the modal on the token so a different pick re-seeds these
+   * initial states; the modal stays mounted between opens.
+   */
+  initialToken?: XStockToken | null;
+  /**
+   * Where "back" goes from the first step when `initialToken` skipped the
+   * picker — there is no picker behind it, so the caller decides (typically
+   * returning to the screen the stock was tapped on). Falls back to closing.
+   */
+  onExit?: () => void;
 };
 
-export default function BuyStockModal({ isOpen, onClose, trigger }: BuyStockModalProps) {
-  const [step, setStep] = useState<BuyStep>('select');
+export default function BuyStockModal({
+  isOpen,
+  onClose,
+  trigger,
+  initialToken = null,
+  onExit,
+}: BuyStockModalProps) {
+  const initialStep: BuyStep = initialToken ? 'input' : 'select';
+  const [step, setStep] = useState<BuyStep>(initialStep);
   const [previousStep, setPreviousStep] = useState<BuyStep>('select');
-  const [selectedToken, setSelectedToken] = useState<XStockToken | null>(null);
+  const [selectedToken, setSelectedToken] = useState<XStockToken | null>(initialToken);
   const [amount, setAmount] = useState('50');
 
   const currentModal: ModalState = { name: step, number: STEP_NUMBERS[step] };
@@ -127,10 +147,20 @@ export default function BuyStockModal({ isOpen, onClose, trigger }: BuyStockModa
     setStep(next);
   }
 
+  function handleBackPress() {
+    if (step === 'review') return navigate('input');
+    // 'input' was reached directly from a pre-selected stock, so there is no
+    // picker behind it — leave the flow the way the user came in.
+    if (initialToken) return onExit ? onExit() : handleClose();
+    navigate('select');
+  }
+
   function handleClose() {
-    setStep('select');
+    // Reset to how this modal was opened, not to the picker: reopening a
+    // pre-selected stock should land on its amount step again.
+    setStep(initialStep);
     setPreviousStep('select');
-    setSelectedToken(null);
+    setSelectedToken(initialToken);
     setAmount('50');
     cowOrder.reset();
     onClose();
@@ -172,7 +202,7 @@ export default function BuyStockModal({ isOpen, onClose, trigger }: BuyStockModa
       title={stepTitle[step]}
       contentKey={step}
       showBackButton={step === 'input' || step === 'review'}
-      onBackPress={() => navigate(step === 'input' ? 'select' : 'input')}
+      onBackPress={handleBackPress}
       hideHeader={step === 'pending'}
     >
       {step === 'select' && <SelectTokenStep onTokenSelect={handleTokenSelect} />}
diff --git a/components/Stocks/SellStockModal.tsx b/components/Stocks/SellStockModal.tsx
index 7f475d282..66f4e8114 100644
--- a/components/Stocks/SellStockModal.tsx
+++ b/components/Stocks/SellStockModal.tsx
@@ -117,8 +117,13 @@ export default function SellStockModal({
   }, [quote, sharesAmount, stockPrice]);
 
   const usdAmount = sharesAmount * stockPrice;
-  const returnPct = holding ? ((stockPrice - holding.avgCost) / holding.avgCost) * 100 : 0;
-  const returnAbs = holding ? (stockPrice - holding.avgCost) * sharesAmount : 0;
+  // avgCost is 0 whenever it is unknown, which is always for on-chain holdings:
+  // a balanceOf carries no purchase price. Dividing by it yields Infinity, so
+  // the return is only computed — and only shown — when there is a basis for it.
+  const avgCost = holding?.avgCost ?? 0;
+  const hasCostBasis = avgCost > 0;
+  const returnPct = hasCostBasis ? ((stockPrice - avgCost) / avgCost) * 100 : 0;
+  const returnAbs = hasCostBasis ? (stockPrice - avgCost) * sharesAmount : 0;
 
   function navigate(next: SellStep) {
     setPreviousStep(step);
@@ -179,6 +184,7 @@ export default function SellStockModal({
           sharesAmount={sharesAmount}
           usdAmount={usdAmount}
           estimatedUsdc={estimatedUsdc}
+          hasCostBasis={hasCostBasis}
           returnPct={returnPct}
           returnAbs={returnAbs}
           quoteLoading={quoteLoading}
@@ -234,6 +240,7 @@ function SellInputStep({
   sharesAmount,
   usdAmount,
   estimatedUsdc,
+  hasCostBasis,
   returnPct,
   returnAbs,
   quoteLoading,
@@ -250,6 +257,7 @@ function SellInputStep({
   sharesAmount: number;
   usdAmount: number;
   estimatedUsdc: number;
+  hasCostBasis: boolean;
   returnPct: number;
   returnAbs: number;
   quoteLoading: boolean;
@@ -260,6 +268,7 @@ function SellInputStep({
 }) {
   const isPositiveReturn = returnPct >= 0;
   const hasContract = !!holding.contractAddress;
+  const avgCostLabel = holding.avgCost.toFixed(2);
 
   return (
     <View className="gap-8 pb-4">
@@ -369,10 +378,12 @@ function SellInputStep({
 
       {/* Stats */}
       <Text className="text-center text-xs text-[#808080]">
-        {holding.shares.toFixed(2)} {holding.ticker} available · Avg cost $
-        {holding.avgCost.toFixed(2)} · Est. return {isPositiveReturn ? '+' : ''}$
-        {returnAbs.toFixed(2)} ({isPositiveReturn ? '+' : ''}
-        {returnPct.toFixed(2)}%)
+        {holding.shares.toFixed(2)} {holding.ticker} available
+        {hasCostBasis
+          ? ` · Avg cost $${avgCostLabel} · Est. return ${isPositiveReturn ? '+' : ''}$${returnAbs.toFixed(
+              2,
+            )} (${isPositiveReturn ? '+' : ''}${returnPct.toFixed(2)}%)`
+          : ''}
       </Text>
 
       {/* CTA */}
diff --git a/components/ui/dialog.tsx b/components/ui/dialog.tsx
index 18b02bb32..4e36ac2e0 100644
--- a/components/ui/dialog.tsx
+++ b/components/ui/dialog.tsx
@@ -127,6 +127,12 @@ const DialogContent = React.forwardRef<
      * the dialog's transformed animation wrapper on small screens.
      */
     webPresentation?: 'modal' | 'bottom-sheet';
+    /**
+     * Native counterpart of `webPresentation`: anchors the card to the bottom of
+     * the screen instead of centring it, so a drawer reads the same on iOS and
+     * Android as it does on web-mobile. Ignored once the screen is medium or
+     * wider, where both platforms show a centred modal.
+     */
     nativePresentation?: 'modal' | 'bottom-sheet';
   }
 >(
@@ -153,6 +159,8 @@ const DialogContent = React.forwardRef<
     const { open } = DialogPrimitive.useRootContext();
     const isWebBottomSheet =
       Platform.OS === 'web' && !isScreenMedium && webPresentation === 'bottom-sheet';
+    const isNativeBottomSheet =
+      Platform.OS !== 'web' && !isScreenMedium && nativePresentation === 'bottom-sheet';
     // Top-aligned sheets are pushed down by `mt-[5vh]` (ResponsiveModal) and sit
     // inside an overlay with 8px padding, so a full-viewport height overflowed the
     // bottom of the screen by that much — clipping whatever the content ended with
@@ -273,27 +281,29 @@ const DialogContent = React.forwardRef<
     );
 
     if (Platform.OS !== 'web') {
-      const isBottomSheet = nativePresentation === 'bottom-sheet' && !isScreenMedium;
       return (
         <DialogPortal hostName={portalHost}>
           <DialogOverlay
             className={cn(shouldAlignTop && 'justify-start', overlayClassName)}
-            closeOnPress={isBottomSheet}
+            // A bottom sheet is dismissed by tapping the backdrop; every other
+            // native dialog keeps its explicit control as the only way out.
+            closeOnPress={isNativeBottomSheet}
           />
           <View
             style={StyleSheet.absoluteFill}
             pointerEvents="box-none"
             className={cn(
-              'flex items-center p-2',
-              isBottomSheet
-                ? 'justify-end p-0'
-                : shouldAlignTop
-                  ? 'justify-start'
+              'flex items-center',
+              isNativeBottomSheet ? 'p-0' : 'p-2',
+              shouldAlignTop
+                ? 'justify-start'
+                : isNativeBottomSheet
+                  ? 'justify-end'
                   : 'justify-center',
             )}
           >
             <Animated.View
-              style={isBottomSheet ? { width: '100%' } : undefined}
+              className={isNativeBottomSheet ? 'w-full' : undefined}
               entering={enteringAnimation}
               exiting={FadeOutDown.duration(180)}
             >
diff --git a/constants/bridge.ts b/constants/bridge.ts
index 95600b107..ad2d88ee8 100644
--- a/constants/bridge.ts
+++ b/constants/bridge.ts
@@ -89,6 +89,9 @@ export const BRIDGE_TOKENS: BridgeTokens = {
     bridgeSpeed: 2,
   },
   [base.id]: {
+    // USDC only. Base USDT is deliberately absent, not missed: every surface that
+    // offers a token on a chain reads this map, so listing it here is what would
+    // offer it for deposit, bridging and card funding.
     tokens: {
       USDC: {
         name: 'USDC',
@@ -96,14 +99,6 @@ export const BRIDGE_TOKENS: BridgeTokens = {
         version: '2',
         isPermit: false,
       },
-      USDT: {
-        name: 'USDT',
-        fullName: 'Tether USD',
-        address: '0xfde4C96c8593536E31F229EA8f37b2ADa2699bb2',
-        icon: require('@/assets/images/usdt.png'),
-        version: '1',
-        isPermit: false,
-      },
     },
     name: 'Base',
     icon: require('@/assets/images/base.png'),
diff --git a/constants/modals.ts b/constants/modals.ts
index 59c6930bf..be81a050b 100644
--- a/constants/modals.ts
+++ b/constants/modals.ts
@@ -11,6 +11,30 @@ export const DEPOSIT_MODAL = {
     name: 'open_deposit_type',
     number: 1.5,
   },
+  /**
+   * "Receive crypto" — the crypto branch of the "Deposit with" chooser: show the
+   * deposit address, or connect an external wallet.
+   */
+  OPEN_DEPOSIT_CRYPTO: {
+    name: 'open_deposit_crypto',
+    number: 1.7,
+  },
+  /**
+   * "Deposit with cash" — the cash branch of the "Deposit with" chooser: USD via
+   * the virtual account, or a local currency via the onramp.
+   */
+  OPEN_DEPOSIT_CASH: {
+    name: 'open_deposit_cash',
+    number: 1.8,
+  },
+  /**
+   * "Select token" — which currency the deposit address is for: the first step
+   * after "Show deposit address", and revisited from the address screen.
+   */
+  OPEN_DEPOSIT_TOKEN: {
+    name: 'open_deposit_token',
+    number: 1.95,
+  },
   OPEN_OPTIONS: {
     name: 'open_options',
     number: 2,
@@ -158,6 +182,11 @@ export const DEPOSIT_MODAL = {
     name: 'open_buy_crypto_profile',
     number: 27,
   },
+  /** Onramper's hosted widget — iframe on web, WebView on native. */
+  OPEN_ONRAMPER_WIDGET: {
+    name: 'open_onramper_widget',
+    number: 28,
+  },
 };
 
 export const SEND_MODAL = {
diff --git a/constants/vaults.ts b/constants/vaults.ts
index 16190ebc7..a9cba71d2 100644
--- a/constants/vaults.ts
+++ b/constants/vaults.ts
@@ -39,7 +39,7 @@ export const VAULTS: Vault[] = [
       supportedChains: BRIDGE_CHAIN_IDS,
       supportedTokens: ['USDC', 'USDT'],
     },
-    vaultName: 'USDC Savings',
+    vaultName: 'USD Yield',
   },
   {
     name: 'FUSE',
@@ -59,7 +59,7 @@ export const VAULTS: Vault[] = [
       supportedChains: [fuse.id],
       supportedTokens: ['WFUSE', 'FUSE'],
     },
-    vaultName: 'FUSE Savings',
+    vaultName: 'FUSE Yield',
   },
   {
     name: 'ETH',
@@ -83,6 +83,6 @@ export const VAULTS: Vault[] = [
       supportedChains: [mainnet.id],
       supportedTokens: ['WETH', 'ETH'],
     },
-    vaultName: 'ETH Savings',
+    vaultName: 'ETH Yield',
   },
 ];
diff --git a/hooks/useAnalytics.ts b/hooks/useAnalytics.ts
index 107e2b642..c1eff47dd 100644
--- a/hooks/useAnalytics.ts
+++ b/hooks/useAnalytics.ts
@@ -559,14 +559,18 @@ export const useTVL = () => {
   });
 };
 
+// Shared so the Earn screen can prefetch this on exactly the same key the
+// vault detail screen will read it from.
+export const vaultBreakdownQueryOptions = (vault?: string) => ({
+  queryKey: [ANALYTICS, 'vaultBreakdown', vault ?? 'usdc'],
+  queryFn: async () => {
+    const vaultBreakdown = await fetchVaultBreakdown(vault);
+    return formatVaultBreakdown(vaultBreakdown);
+  },
+});
+
 export const useVaultBreakdown = (vault?: string) => {
-  return useQuery({
-    queryKey: [ANALYTICS, 'vaultBreakdown', vault ?? 'usdc'],
-    queryFn: async () => {
-      const vaultBreakdown = await fetchVaultBreakdown(vault);
-      return formatVaultBreakdown(vaultBreakdown);
-    },
-  });
+  return useQuery(vaultBreakdownQueryOptions(vault));
 };
 
 // Query options for prefetching APYs
@@ -663,10 +667,19 @@ export const useCoinHistoricalChart = (
   });
 };
 
-export const useHistoricalAPY = (days: string = '30', vault?: VaultType) => {
-  const vaultKey = getAnalyticsVaultKey(vault);
-  return useQuery({
-    queryKey: [ANALYTICS, 'historicalAPY', days, vaultKey],
-    queryFn: async () => fetchHistoricalAPY(days, vault),
-  });
-};
+/**
+ * The period the vault detail chart opens on. Lives here rather than in the
+ * card so a prefetch keyed on it cannot silently drift from what the card
+ * actually requests — a mismatch just wastes the fetch, invisibly.
+ */
+export const DEFAULT_HISTORICAL_APY_DAYS = '7';
+
+// Shared so the Earn screen can prefetch this on exactly the same key the
+// vault detail screen will read it from.
+export const historicalApyQueryOptions = (days: string = '30', vault?: VaultType) => ({
+  queryKey: [ANALYTICS, 'historicalAPY', days, getAnalyticsVaultKey(vault)],
+  queryFn: async () => fetchHistoricalAPY(days, vault),
+});
+
+export const useHistoricalAPY = (days: string = '30', vault?: VaultType) =>
+  useQuery(historicalApyQueryOptions(days, vault));
diff --git a/hooks/useDepositAssets.ts b/hooks/useDepositAssets.ts
new file mode 100644
index 000000000..13ddef900
--- /dev/null
+++ b/hooks/useDepositAssets.ts
@@ -0,0 +1,26 @@
+import { useQuery } from '@tanstack/react-query';
+
+import { getDepositAssets } from '@/lib/api';
+
+export const DEPOSIT_ASSETS_QUERY_KEY = 'deposit-assets';
+
+/**
+ * The deposit pipeline's own asset list and minimums.
+ *
+ * Every consumer treats this as an improvement on its committed fallback rather
+ * than a requirement: the endpoint is config, it is the same answer for
+ * everyone, and a deposit screen that showed no minimum while it loaded would be
+ * worse than one showing an approximate figure immediately. So failures are not
+ * surfaced — `data` is simply absent and callers fall back.
+ *
+ * One retry rather than the default three: until the endpoint is deployed
+ * everywhere this 404s, and there is no point spending three requests to learn
+ * that on every mount.
+ */
+export const useDepositAssets = () =>
+  useQuery({
+    queryKey: [DEPOSIT_ASSETS_QUERY_KEY],
+    queryFn: getDepositAssets,
+    staleTime: 5 * 60 * 1000,
+    retry: 1,
+  });
diff --git a/hooks/useDepositOption.tsx b/hooks/useDepositOption.tsx
index 8accaec0b..5c00494f2 100644
--- a/hooks/useDepositOption.tsx
+++ b/hooks/useDepositOption.tsx
@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { ActivityIndicator, Platform, Pressable, PressableProps, View } from 'react-native';
-import { useRouter } from 'expo-router';
+import { Href, useRouter } from 'expo-router';
 import { Plus } from 'lucide-react-native';
 import { useShallow } from 'zustand/react/shallow';
 
@@ -8,6 +8,7 @@ import Trash from '@/assets/images/trash';
 import { BankTransferModalContent } from '@/components/BankTransfer/BankTransferModalContent';
 import { KycModalContent } from '@/components/BankTransfer/KycModalContent';
 import BuyCrypto from '@/components/BuyCrypto';
+import { OnramperWidget } from '@/components/BuyCrypto/OnramperWidget/OnramperWidget';
 import { TransfiAmount } from '@/components/BuyCrypto/Transfi/TransfiAmount';
 import { TransfiCurrencySelector } from '@/components/BuyCrypto/Transfi/TransfiCurrencySelector';
 import { TransfiError } from '@/components/BuyCrypto/Transfi/TransfiError';
@@ -21,17 +22,20 @@ import DepositEmailModal from '@/components/DepositEmailModal';
 import DepositNetworks from '@/components/DepositNetwork/DepositNetworks';
 import AddFundsToWalletForm from '@/components/DepositOption/AddFundsToWalletForm';
 import DepositBuyCryptoOptions from '@/components/DepositOption/DepositBuyCryptoOptions';
+import DepositCashOptions from '@/components/DepositOption/DepositCashOptions';
+import DepositCryptoOptions from '@/components/DepositOption/DepositCryptoOptions';
 import DepositDirectlyAddress from '@/components/DepositOption/DepositDirectlyAddress';
 import DepositDirectlyNetworks from '@/components/DepositOption/DepositDirectlyNetworks';
 import DepositDirectlyTokens from '@/components/DepositOption/DepositDirectlyTokens';
 import DepositExternalWalletOptions from '@/components/DepositOption/DepositExternalWalletOptions';
 import DepositOptions from '@/components/DepositOption/DepositOptions';
-import DepositPublicAddress from '@/components/DepositOption/DepositPublicAddress';
 import DepositTypeSelection from '@/components/DepositOption/DepositTypeSelection';
 import DepositWalletConnector from '@/components/DepositOption/DepositWalletConnector';
 import { VirtualAccountApplyModal } from '@/components/DepositOption/VirtualAccountDetails/VirtualAccountApplyModal';
 import { VirtualAccountDetailsModal } from '@/components/DepositOption/VirtualAccountDetails/VirtualAccountDetailsModal';
 import { VirtualAccountTosModal } from '@/components/DepositOption/VirtualAccountDetails/VirtualAccountTosModal';
+import WalletDepositAddress from '@/components/DepositOption/WalletDepositAddress';
+import WalletDepositTokens from '@/components/DepositOption/WalletDepositAddress/WalletDepositTokens';
 import { DepositTokenSelector, DepositToVaultForm } from '@/components/DepositToVault';
 import SavingsDepositTokenSelector from '@/components/DepositToVault/SavingsDepositTokenSelector';
 import SavingsFundScreen from '@/components/Savings/SavingsFund/SavingsFundScreen';
@@ -42,18 +46,22 @@ import { WirexBankAccountPane } from '@/components/WirexBankAccount/WirexBankAcc
 import { DEPOSIT_MODAL } from '@/constants/modals';
 import { path } from '@/constants/path';
 import { TRACKING_EVENTS } from '@/constants/tracking-events';
+import { VAULTS } from '@/constants/vaults';
+import { useDimension } from '@/hooks/useDimension';
 import { useDirectDepositSession } from '@/hooks/useDirectDepositSession';
 import useUser from '@/hooks/useUser';
 import { useVirtualAccountProvider } from '@/hooks/useVirtualAccountProvider';
 import { track } from '@/lib/analytics';
 import getTokenIcon from '@/lib/getTokenIcon';
-import { DepositModal } from '@/lib/types';
+import { DepositModal, VaultType } from '@/lib/types';
 import {
   getAllowedTokensForChain,
   getDefaultDepositSelection,
   getVaultDepositConfig,
 } from '@/lib/vaults';
+import { getDepositTokenBackTarget } from '@/lib/walletDepositFlow';
 import { useDepositStore } from '@/store/useDepositStore';
+import { useSavingStore } from '@/store/useSavingStore';
 
 import useResponsiveModal from './useResponsiveModal';
 
@@ -121,6 +129,7 @@ const useDepositOption = ({
   const { provider: virtualAccountProvider } = useVirtualAccountProvider();
   const [isDeleting, setIsDeleting] = useState(false);
   const { triggerElement } = useResponsiveModal();
+  const { isDesktop } = useDimension();
   const isForm = currentModal.name === DEPOSIT_MODAL.OPEN_FORM.name;
   const isFormAndAddress = Boolean(
     isForm && (address || (depositFromSolid && !!user?.safeAddress)),
@@ -154,6 +163,7 @@ const useDepositOption = ({
   const isBuyCryptoStatus = currentModal.name === DEPOSIT_MODAL.OPEN_BUY_CRYPTO_STATUS.name;
   const isBuyCryptoProfile = currentModal.name === DEPOSIT_MODAL.OPEN_BUY_CRYPTO_PROFILE.name;
   const isBuyCryptoError = currentModal.name === DEPOSIT_MODAL.OPEN_BUY_CRYPTO_ERROR.name;
+  const isOnramperWidget = currentModal.name === DEPOSIT_MODAL.OPEN_ONRAMPER_WIDGET.name;
   const isPublicAddress = currentModal.name === DEPOSIT_MODAL.OPEN_PUBLIC_ADDRESS.name;
   const isDepositDirectly = currentModal.name === DEPOSIT_MODAL.OPEN_DEPOSIT_DIRECTLY.name;
   const isDepositDirectlyAddress =
@@ -172,6 +182,9 @@ const useDepositOption = ({
   const isSavingsFundAddress = currentModal.name === DEPOSIT_MODAL.OPEN_SAVINGS_FUND_ADDRESS.name;
   const isSavingsFundFlow = isSavingsFund || isSavingsFundNetworks || isSavingsFundAddress;
   const isDepositTypeSelection = currentModal.name === DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE.name;
+  const isDepositCrypto = currentModal.name === DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO.name;
+  const isDepositCash = currentModal.name === DEPOSIT_MODAL.OPEN_DEPOSIT_CASH.name;
+  const isDepositToken = currentModal.name === DEPOSIT_MODAL.OPEN_DEPOSIT_TOKEN.name;
   const isOptions = currentModal.name === DEPOSIT_MODAL.OPEN_OPTIONS.name;
   const isWalletConnector = currentModal.name === DEPOSIT_MODAL.OPEN_CONNECT_WALLET.name;
   const isClose = currentModal.name === DEPOSIT_MODAL.CLOSE.name;
@@ -318,8 +331,12 @@ const useDepositOption = ({
       return <TransfiError />;
     }
 
+    if (isOnramperWidget) {
+      return <OnramperWidget onOutcome={() => setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CASH)} />;
+    }
+
     if (isPublicAddress) {
-      return <DepositPublicAddress onDone={() => setModal(DEPOSIT_MODAL.CLOSE)} />;
+      return <WalletDepositAddress />;
     }
 
     if (isSavingsFund) {
@@ -384,7 +401,19 @@ const useDepositOption = ({
       return <DepositWalletConnector />;
     }
 
-    return <DepositTypeSelection />;
+    if (isDepositCrypto) {
+      return <DepositCryptoOptions />;
+    }
+
+    if (isDepositCash) {
+      return <DepositCashOptions />;
+    }
+
+    if (isDepositToken) {
+      return <WalletDepositTokens />;
+    }
+
+    return <DepositTypeSelection onClose={() => handleOpenChange(false)} />;
   };
 
   const getContentKey = () => {
@@ -409,6 +438,7 @@ const useDepositOption = ({
     if (isBuyCryptoStatus) return 'buy-crypto-status';
     if (isBuyCryptoProfile) return 'buy-crypto-profile';
     if (isBuyCryptoError) return 'buy-crypto-error';
+    if (isOnramperWidget) return 'onramper-widget';
     if (isPublicAddress) return 'public-address';
     if (isSavingsFund) return 'savings-fund-options';
     if (isSavingsFundNetworks) return 'savings-fund-networks';
@@ -422,6 +452,9 @@ const useDepositOption = ({
     if (isVirtualAccountApply) return 'virtual-account-apply';
     if (isOptions) return 'deposit-options';
     if (isWalletConnector) return 'deposit-wallet-connector';
+    if (isDepositCrypto) return 'deposit-crypto-options';
+    if (isDepositCash) return 'deposit-cash-options';
+    if (isDepositToken) return 'deposit-token';
     return 'deposit-type-selection';
   };
 
@@ -451,7 +484,8 @@ const useDepositOption = ({
     // The error screen carries its own headline and icon; a second title above
     // it would say the same thing twice.
     if (isBuyCryptoError) return undefined;
-    if (isPublicAddress) return 'Your Solid address';
+    if (isOnramperWidget) return 'Buy crypto';
+    if (isPublicAddress) return 'Deposit address';
     if (isDepositDirectly) return 'Choose network';
     if (isDepositDirectlyTokens) return 'Choose token';
     if (isTokenSelector && depositFromSolid) return 'Deposit';
@@ -460,7 +494,12 @@ const useDepositOption = ({
     if (isVirtualAccountTos) return 'Bank Deposit';
     if ((isNetworks || isFormAndAddress) && depositFromSolid) return 'Deposit';
     if (isFormAndAddress && !depositFromSolid) return 'Add funds';
-    if (isDepositTypeSelection) return 'Fund your wallet';
+    // The chooser is a drawer with no header of its own — it carries its grab
+    // handle and centred title in the content (see DepositTypeSelection).
+    if (isDepositTypeSelection) return undefined;
+    if (isDepositCrypto) return 'Receive crypto';
+    if (isDepositCash) return 'Deposit with cash';
+    if (isDepositToken) return 'Select token';
     if (isWalletConnector) return 'Connect wallet';
     return 'Add funds';
   };
@@ -470,8 +509,20 @@ const useDepositOption = ({
       return 'mt-0 overflow-hidden bg-[#111] px-0 pb-0 pt-0 md:h-[90vh] md:w-screen md:max-w-lg md:!px-0 md:!pt-0';
     }
 
-    if (isDepositTypeSelection) {
-      return 'rounded-t-[30px]';
+    // The chooser, its two branches and the deposit address are designed at phone
+    // width. 480px keeps the desktop card in proportion without squeezing it: at
+    // the 420px the card flow uses, the 40px desktop inset left less room for
+    // content than a phone has, and rows wrapped tighter on the wider screen.
+    // `md:pb-6` sits under the scroll area's own md:pb-10: these screens end on a
+    // card or a button, and on desktop that landed too close to the modal's edge.
+    if (
+      isDepositTypeSelection ||
+      isDepositCrypto ||
+      isDepositCash ||
+      isDepositToken ||
+      isPublicAddress
+    ) {
+      return 'md:max-w-[480px] md:pb-6';
     }
 
     if (isBuyCrypto) {
@@ -521,7 +572,7 @@ const useDepositOption = ({
       return 'gap-3';
     }
 
-    // The deposit type picker is a short, self-contained choice screen. Let it
+    // The chooser is a short, self-contained choice screen with no header. Let it
     // size to its content instead of inheriting the legacy deposit flow height.
     if (isDepositTypeSelection) {
       return '';
@@ -541,7 +592,13 @@ const useDepositOption = ({
       !isBankTransfer &&
       !isDepositDirectly &&
       !isDepositDirectlyAddress &&
-      !isSavingsFundFlow
+      !isSavingsFundFlow &&
+      // The redesigned wallet deposit screens are as tall as their content — a
+      // two-row list padded out to 40rem is mostly empty card.
+      !isDepositCrypto &&
+      !isDepositCash &&
+      !isDepositToken &&
+      !isPublicAddress
     ) {
       return 'min-h-[40rem]';
     }
@@ -669,8 +726,10 @@ const useDepositOption = ({
       if (user && !user.email) {
         setModal(DEPOSIT_MODAL.OPEN_EMAIL_GATE);
       } else if (modal.name === DEPOSIT_MODAL.OPEN_SAVINGS_FUND.name) {
-        // Explicit savings entry point: show the token list, never a form that a
+        // The card's minimum-deposit step, which still funds savings by sending
+        // new money in: hold it on the token list rather than the form a
         // connected wallet or a stale chain selection would otherwise jump to.
+        // The savings screens themselves now open OPEN_FORM directly.
         setModal(DEPOSIT_MODAL.OPEN_SAVINGS_FUND);
       } else if (depositFromSolid && user?.safeAddress) {
         // Savings deposit: open form directly — token selector is inline
@@ -707,10 +766,14 @@ const useDepositOption = ({
 
   const handleBackPress = () => {
     if (isFormAndAddress && depositFromSolid) {
-      // Savings deposit form is the entry point — close the modal
+      // The savings deposit form is the entry point, so there is no earlier step
+      // to return to. Back leads to the vault being deposited into instead —
+      // reached from its own screen or from Home, it lands in the same place.
+      const vaultType = VAULTS[useSavingStore.getState().selectedVault]?.type ?? VaultType.USDC;
       setModal(DEPOSIT_MODAL.CLOSE);
       resetDepositFlow();
       clearSessionStartTime();
+      router.navigate({ pathname: '/savings', params: { vault: vaultType } } as Href);
     } else if (isFormAndAddress) {
       setModal(DEPOSIT_MODAL.OPEN_NETWORKS);
     } else if (isBankTransferKycFrame) {
@@ -727,7 +790,7 @@ const useDepositOption = ({
     } else if (isBankTransferKycInfo) {
       setModal(DEPOSIT_MODAL.OPEN_BANK_TRANSFER_PAYMENT);
     } else if (isBankTransferAmount) {
-      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CASH);
     } else if (isBankTransferPayment) {
       setModal(DEPOSIT_MODAL.OPEN_BANK_TRANSFER_AMOUNT);
     } else if (isBankTransferPreview) {
@@ -737,9 +800,13 @@ const useDepositOption = ({
     } else if (isBuyCryptoOptions) {
       setModal(DEPOSIT_MODAL.OPEN_OPTIONS);
     } else if (isWalletConnector) {
-      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO);
     } else if (isBuyCryptoKycConsent || isBuyCryptoKycPending || isBuyCryptoAmount) {
-      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+      // The onramp is only ever entered by picking a currency on the cash screen.
+      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CASH);
+    } else if (isOnramperWidget) {
+      // Entered from the cash screen's "Buy crypto" row.
+      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CASH);
     } else if (isBuyCryptoCurrency || isBuyCryptoPaymentMethod) {
       setModal(DEPOSIT_MODAL.OPEN_BUY_CRYPTO_AMOUNT);
     } else if (isBuyCryptoPayment) {
@@ -758,7 +825,18 @@ const useDepositOption = ({
       resetDepositFlow();
       clearSessionStartTime();
     } else if (isPublicAddress) {
-      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+      // Reached through the token list from the crypto branch, and directly from
+      // the savings flow's own external-wallet list — each step back to where it
+      // came from.
+      setModal(
+        previousModal.name === DEPOSIT_MODAL.OPEN_EXTERNAL_WALLET_OPTIONS.name
+          ? DEPOSIT_MODAL.OPEN_EXTERNAL_WALLET_OPTIONS
+          : DEPOSIT_MODAL.OPEN_DEPOSIT_TOKEN,
+      );
+    } else if (isDepositToken) {
+      const { walletDeposit, setWalletDeposit } = useDepositStore.getState();
+      setWalletDeposit({ isChangingToken: false });
+      setModal(getDepositTokenBackTarget(!!walletDeposit.isChangingToken, isDesktop));
     } else if (isSavingsFundAddress) {
       setModal(DEPOSIT_MODAL.OPEN_SAVINGS_FUND_NETWORKS);
     } else if (isSavingsFundNetworks) {
@@ -785,10 +863,12 @@ const useDepositOption = ({
     } else if (isTokenSelector) {
       setModal(DEPOSIT_MODAL.OPEN_FORM);
     } else if (isBuyCrypto) {
-      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CASH);
     } else if (isNetworks) {
       setDepositFromSolid(false);
-      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO);
+    } else if (isVirtualAccountApply) {
+      setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_CASH);
     } else if (isOptions) {
       setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
     } else {
@@ -835,35 +915,23 @@ const useDepositOption = ({
     return undefined;
   }, [isDepositDirectlyAddress, directDepositSession.status, handleDeleteDeposit, isDeleting]);
 
+  /**
+   * The steps that only exist because an external wallet is connected: the chain
+   * list, the amount form and its token selector all read that connection.
+   *
+   * Listed rather than excluded, because everything else in this modal — the
+   * chooser and its branches, the deposit address, bank transfer, the onramp,
+   * savings — stands on its own. Naming what depends on the connection keeps a
+   * disconnected desktop session (the default, since nobody has connected a
+   * wallet yet) from throwing the user back to the start of an unrelated flow.
+   */
+  const dependsOnConnectedWallet = !depositFromSolid && (isNetworks || isForm || isTokenSelector);
+
   useEffect(() => {
-    if (
-      status === 'disconnected' &&
-      !depositFromSolid &&
-      !isClose &&
-      !isDepositDirectly &&
-      !isDepositDirectlyAddress &&
-      !isDepositDirectlyTokens &&
-      !isSavingsFundFlow &&
-      !isExternalWalletOptions &&
-      !isBuyCryptoOptions &&
-      !isWalletConnector
-    ) {
+    if (status === 'disconnected' && dependsOnConnectedWallet) {
       setModal(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
     }
-  }, [
-    status,
-    setModal,
-    depositFromSolid,
-    isClose,
-    isDepositDirectly,
-    isDepositDirectlyAddress,
-    isDepositDirectlyTokens,
-    isSavingsFundFlow,
-    isExternalWalletOptions,
-    isBuyCryptoOptions,
-    isWalletConnector,
-    currentModal.name,
-  ]);
+  }, [status, dependsOnConnectedWallet, setModal]);
 
   useEffect(() => {
     return () => {
@@ -875,7 +943,7 @@ const useDepositOption = ({
   const shouldOpen = !isClose;
 
   const showBackButton =
-    (isFormAndAddress && !depositFromSolid) ||
+    isFormAndAddress ||
     isBuyCrypto ||
     isNetworks ||
     isOptions ||
@@ -891,6 +959,9 @@ const useDepositOption = ({
     isBuyCryptoCurrency ||
     isBuyCryptoPaymentMethod ||
     isPublicAddress ||
+    isDepositCrypto ||
+    isDepositCash ||
+    isDepositToken ||
     isSavingsFundNetworks ||
     isSavingsFundAddress ||
     isDepositDirectly ||
@@ -910,12 +981,17 @@ const useDepositOption = ({
     isVirtualAccountDetails ||
     isVirtualAccountApply;
   const fillViewportHeight = isVirtualAccountDetails || isVirtualAccountApply;
-  const hideHeader = isVirtualAccountApply;
+  // The chooser draws its own grab handle and centred title, and offers "Close"
+  // as a button, so it needs none of the modal's back/close chrome.
+  const hideHeader = isVirtualAccountApply || isDepositTypeSelection;
 
   return {
     shouldOpen,
     showBackButton,
-    compactHeader: isDepositTypeSelection,
+    compactHeader: isDepositCrypto || isDepositCash || isDepositToken || isPublicAddress,
+    // Short enough to sit at the bottom of a phone screen rather than take it
+    // over; desktop shows it as the usual centred modal either way.
+    mobilePresentation: isDepositTypeSelection ? ('drawer' as const) : ('sheet' as const),
     needsWalletProvider,
     disableScroll,
     fillViewportHeight,
diff --git a/hooks/useOnramperClient.ts b/hooks/useOnramperClient.ts
deleted file mode 100644
index d39143592..000000000
--- a/hooks/useOnramperClient.ts
+++ /dev/null
@@ -1,82 +0,0 @@
-import { useCallback, useEffect, useState } from 'react';
-
-import useUser from '@/hooks/useUser';
-import { initOnramper, isOnramperSupported } from '@/lib/onramper';
-
-import type { OnramperClient } from '@onramper/onramper-react-native';
-
-interface UseOnramperClientReturn {
-  /** Initialized client, or `undefined` until the bootstrap resolves. */
-  client: OnramperClient | undefined;
-  isLoading: boolean;
-  error: Error | undefined;
-  /**
-   * False on Android and web. Advisory only — it does not gate initialization,
-   * so the bootstrap is still attempted (and surfaces via `error`) off iOS.
-   */
-  isAvailable: boolean;
-  retry: () => void;
-}
-
-/**
- * Lazily bootstraps the Onramper SDK for the buy-crypto flow.
- *
- * Deliberately not wired into app/_layout.tsx: initialize() needs a session minted
- * for an authenticated user, and buy-crypto is geo-gated, so booting a native SDK at
- * launch would cost startup time for a flow most users never open. Mount this from
- * the buy-crypto entry point instead.
- *
- * Teardown is not on unmount — the client is a module singleton that may be shared by
- * sibling screens, so unmounting one must not release it from under another. It is
- * released on logout via `destroyOnramper()` in useUser's handleLogout.
- */
-export default function useOnramperClient(): UseOnramperClientReturn {
-  const { user } = useUser();
-
-  const [client, setClient] = useState<OnramperClient>();
-  const [error, setError] = useState<Error>();
-  const [isLoading, setIsLoading] = useState(false);
-  const [attempt, setAttempt] = useState(0);
-
-  const isAvailable = isOnramperSupported;
-  // The only hard requirement: the session is minted against the user's JWT.
-  // Platform and geo deliberately don't gate this — an unsupported platform fails
-  // in initOnramper() and surfaces as `error` rather than silently no-op'ing.
-  const canInitialize = !!user;
-
-  useEffect(() => {
-    if (!canInitialize) return;
-
-    let cancelled = false;
-
-    setIsLoading(true);
-    setError(undefined);
-
-    initOnramper()
-      .then(instance => {
-        if (cancelled) return;
-        setClient(instance);
-      })
-      .catch((e: unknown) => {
-        if (cancelled) return;
-        setError(e instanceof Error ? e : new Error(String(e)));
-      })
-      .finally(() => {
-        if (cancelled) return;
-        setIsLoading(false);
-      });
-
-    // Only stops this effect from writing to unmounted state. initOnramper() is
-    // single-flight and its result is cached, so an in-flight bootstrap is left to
-    // finish rather than being torn down.
-    return () => {
-      cancelled = true;
-    };
-  }, [canInitialize, attempt]);
-
-  const retry = useCallback(() => {
-    setAttempt(current => current + 1);
-  }, []);
-
-  return { client, isLoading, error, isAvailable, retry };
-}
diff --git a/hooks/useOnramperWidget.ts b/hooks/useOnramperWidget.ts
new file mode 100644
index 000000000..b045e97e3
--- /dev/null
+++ b/hooks/useOnramperWidget.ts
@@ -0,0 +1,29 @@
+import { Platform } from 'react-native';
+import { useQuery } from '@tanstack/react-query';
+
+import { fetchOnramperWidgetSession } from '@/lib/api';
+import { withRefreshToken } from '@/lib/utils';
+
+const ONRAMPER_WIDGET_SESSION_KEY = 'onramperWidgetSession';
+
+/**
+ * A signed widget URL for this platform.
+ *
+ * Nothing is cached between mounts. Onramper's signature is single-use and
+ * expires after 15 minutes, so a URL kept from a previous visit loads a widget
+ * that then refuses the checkout — a failure that surfaces only once the user
+ * is trying to pay. Minting one per open costs a request and removes the whole
+ * class of problem.
+ */
+export default function useOnramperWidget() {
+  return useQuery({
+    queryKey: [ONRAMPER_WIDGET_SESSION_KEY, Platform.OS],
+    queryFn: () =>
+      withRefreshToken(() => fetchOnramperWidgetSession(Platform.OS === 'web' ? 'web' : 'native')),
+    // A fresh URL every time this mounts, and none left behind afterwards.
+    staleTime: 0,
+    gcTime: 0,
+    refetchOnMount: 'always',
+    retry: 1,
+  });
+}
diff --git a/hooks/useUser.ts b/hooks/useUser.ts
index 6106f2e0f..829966806 100644
--- a/hooks/useUser.ts
+++ b/hooks/useUser.ts
@@ -27,7 +27,6 @@ import {
 import { getAttributionChannel } from '@/lib/attribution';
 import { EXPO_PUBLIC_TURNKEY_ORGANIZATION_ID, USER } from '@/lib/config';
 import { useIntercom } from '@/lib/intercom';
-import { destroyOnramper } from '@/lib/onramper';
 import { pimlicoClient } from '@/lib/pimlico';
 import { Status, User } from '@/lib/types';
 import {
@@ -548,10 +547,6 @@ const useUser = (): UseUserReturn => {
     useStoreReviewStore.getState().reset();
     intercom?.shutdown();
     intercom?.boot();
-    // The Onramper session is minted against this user's JWT; release the native
-    // client so it can't carry over into the next account.
-    destroyOnramper();
-
     const hasPasskeyUsers = users.some(existingUser => existingUser.hasPasskey !== false);
 
     // Go to onboarding on native, welcome on web
@@ -715,10 +710,6 @@ const useUser = (): UseUserReturn => {
     useStoreReviewStore.getState().reset();
     intercom?.shutdown();
     intercom?.boot();
-    // The Onramper session is minted against this user's JWT; release the native
-    // client so it can't carry over into the next account.
-    destroyOnramper();
-
     const hasPasskeyUsers = users.some(existingUser => existingUser.hasPasskey !== false);
 
     if (hasPasskeyUsers) {
diff --git a/hooks/useVaultDepositEntry.ts b/hooks/useVaultDepositEntry.ts
new file mode 100644
index 000000000..9d5cb9ba3
--- /dev/null
+++ b/hooks/useVaultDepositEntry.ts
@@ -0,0 +1,59 @@
+import { useCallback, useMemo } from 'react';
+
+import { DEPOSIT_MODAL } from '@/constants/modals';
+import { VAULTS } from '@/constants/vaults';
+import { useCardProvider } from '@/hooks/useCardProvider';
+import { DepositModal, VaultType } from '@/lib/types';
+import { usesDirectSavingsDeposit } from '@/lib/utils/cardHelpers';
+import { useDepositStore } from '@/store/useDepositStore';
+import { useSavingStore } from '@/store/useSavingStore';
+
+/**
+ * Which deposit flow the savings screens' Deposit button opens, and the state it
+ * needs primed.
+ *
+ * Two flows, chosen by issuer (see {@link usesDirectSavingsDeposit}). They are not
+ * two skins of one screen — they put money in by different routes, which is why
+ * each needs its own setup:
+ *
+ * - The direct-deposit flow sends *new* money in: pick a currency, then a chain,
+ *   then send to an address the backend mints for that pairing. So
+ *   `depositFromSolid` is off and any address left from an earlier deposit is
+ *   cleared, or the flow opens on a stale QR for a chain the user has moved off.
+ * - The amount form moves a balance the user already holds in Solid, so
+ *   `depositFromSolid` is on and it opens straight onto it.
+ *
+ * Both pre-select the vault whose screen the button was pressed on; without it
+ * the flow deposits into whichever vault was last chosen somewhere else.
+ */
+export const useVaultDepositEntry = (
+  vaultType: VaultType,
+): { modal: DepositModal; onBeforeOpen: () => void } => {
+  const { provider } = useCardProvider();
+  const isDirectDeposit = usesDirectSavingsDeposit(provider);
+
+  const onBeforeOpen = useCallback(() => {
+    const index = VAULTS.findIndex(vault => vault.type === vaultType);
+    if (index >= 0) {
+      useSavingStore.getState().selectVaultForDeposit(index);
+    }
+
+    const store = useDepositStore.getState();
+    if (isDirectDeposit) {
+      store.setDepositFromSolid(false);
+      store.setSavingsFundIntent('savings');
+      store.clearDirectDepositSession();
+      return;
+    }
+
+    store.setDepositFromSolid(true);
+  }, [isDirectDeposit, vaultType]);
+
+  return useMemo(
+    () => ({
+      modal: isDirectDeposit ? DEPOSIT_MODAL.OPEN_SAVINGS_FUND : DEPOSIT_MODAL.OPEN_FORM,
+      onBeforeOpen,
+    }),
+    [isDirectDeposit, onBeforeOpen],
+  );
+};
diff --git a/hooks/useWalletDepositAddress.ts b/hooks/useWalletDepositAddress.ts
new file mode 100644
index 000000000..caea3cb1a
--- /dev/null
+++ b/hooks/useWalletDepositAddress.ts
@@ -0,0 +1,56 @@
+import { useQuery } from '@tanstack/react-query';
+
+import { CARD_FUND_DESTINATION_TYPE } from '@/components/Card/CardFund/constants';
+import { usesDirectDepositAddress } from '@/components/DepositOption/WalletDepositAddress/constants';
+import { useCardProvider } from '@/hooks/useCardProvider';
+import useUser from '@/hooks/useUser';
+import { createDirectDepositSession } from '@/lib/api';
+import { withRefreshToken } from '@/lib/utils';
+
+export const WALLET_DEPOSIT_ADDRESS_QUERY_KEY = 'wallet-deposit-address';
+
+/**
+ * The address to show for a (chain, currency) pairing on the deposit screen.
+ *
+ * A Wirex cardholder depositing a stablecoin gets an address minted by
+ * `createDirectDepositSession` — watched, so the transfer is detected, credited
+ * and recorded as activity. Everyone else sees the Safe address, for every
+ * currency (see {@link usesDirectDepositAddress}).
+ *
+ * The destination is the card's (`RAIN_CARD`), which is historical naming: the
+ * backend resolves the issuer, and for Wirex that means their Safe on Fuse —
+ * the balance their card settles from. Which is exactly why the rule is theirs
+ * alone: the same call for a Rain cardholder would deliver to the card, and for
+ * someone with no card there is no issuer to resolve.
+ *
+ * Minting a session is a POST, so a failure is not retried into a loop; the
+ * caller shows the failure rather than quietly falling back to the Safe, which
+ * would hand out an address the deposit would be stranded on.
+ */
+export const useWalletDepositAddress = (chainId: number, symbol: string) => {
+  const { user } = useUser();
+  const { provider } = useCardProvider();
+  const needsSession = usesDirectDepositAddress(symbol, provider);
+
+  const { data, isLoading, isError } = useQuery({
+    queryKey: [WALLET_DEPOSIT_ADDRESS_QUERY_KEY, chainId, symbol],
+    queryFn: () =>
+      withRefreshToken(() =>
+        createDirectDepositSession(chainId, symbol, CARD_FUND_DESTINATION_TYPE),
+      ),
+    enabled: needsSession,
+    staleTime: Infinity,
+    retry: false,
+  });
+
+  if (!needsSession) {
+    return { address: user?.safeAddress, isLoading: false, isError: false, isMinted: false };
+  }
+
+  return {
+    address: data?.walletAddress,
+    isLoading,
+    isError,
+    isMinted: true,
+  };
+};
diff --git a/hooks/useXStockPrices.ts b/hooks/useXStockPrices.ts
index 781a933ed..1ef7093c3 100644
--- a/hooks/useXStockPrices.ts
+++ b/hooks/useXStockPrices.ts
@@ -1,39 +1,42 @@
 import { useMemo } from 'react';
-import { useQuery } from '@tanstack/react-query';
+import { useQueries } from '@tanstack/react-query';
 
 import { XSTOCKS_TOKENS } from '@/constants/xstocksTokens';
 import { cowGetTokenUsdPrice } from '@/lib/cowswap';
 
-// Maps ticker symbol → live USD price via CoW BFF /tokens/{address}/usdPrice.
-// Faster than quotes since it's a single price lookup per token with no order simulation.
+const PRICE_STALE_MS = 60_000;
+
+/**
+ * Maps ticker symbol → live USD price via CoW BFF /tokens/{address}/usdPrice.
+ * Faster than quotes since it's a single price lookup per token with no order
+ * simulation.
+ *
+ * One query per ticker rather than one keyed on the whole list: a list that
+ * grows — the Earn catalog paging in more rows as it scrolls — would otherwise
+ * change the key on every page and refetch every ticker it had already
+ * fetched, so reaching the end of 160-odd assets would cost thousands of
+ * requests instead of one per asset.
+ */
 export function useXStockPrices(tickers: string[]): Record<string, number> {
   const tokenMap = useMemo(() => new Map(XSTOCKS_TOKENS.map(t => [t.symbol, t])), []);
 
-  const { data } = useQuery({
-    queryKey: ['xstockPrices', tickers.join(',')],
-    queryFn: async () => {
-      const results = await Promise.allSettled(
-        tickers.map(async ticker => {
-          const token = tokenMap.get(ticker);
-          if (!token) return null;
-          const price = await cowGetTokenUsdPrice(token.contractAddress);
-          if (price == null) return null;
-          return { ticker, price };
-        }),
-      );
-
+  return useQueries({
+    queries: tickers.map(ticker => ({
+      queryKey: ['xstockPrice', ticker],
+      queryFn: async () => {
+        const token = tokenMap.get(ticker);
+        if (!token) return null;
+        return (await cowGetTokenUsdPrice(token.contractAddress)) ?? null;
+      },
+      staleTime: PRICE_STALE_MS,
+      refetchInterval: PRICE_STALE_MS,
+    })),
+    combine: results => {
       const prices: Record<string, number> = {};
-      for (const r of results) {
-        if (r.status === 'fulfilled' && r.value) {
-          prices[r.value.ticker] = r.value.price;
-        }
-      }
+      results.forEach((result, index) => {
+        if (typeof result.data === 'number') prices[tickers[index]] = result.data;
+      });
       return prices;
     },
-    enabled: tickers.length > 0,
-    staleTime: 60_000,
-    refetchInterval: 60_000,
   });
-
-  return data ?? {};
 }
diff --git a/lib/__tests__/walletDepositFlow.test.ts b/lib/__tests__/walletDepositFlow.test.ts
new file mode 100644
index 000000000..7c0338197
--- /dev/null
+++ b/lib/__tests__/walletDepositFlow.test.ts
@@ -0,0 +1,39 @@
+import { DEPOSIT_MODAL } from '@/constants/modals';
+import { getCryptoDepositEntry, getDepositTokenBackTarget } from '@/lib/walletDepositFlow';
+
+describe('getCryptoDepositEntry', () => {
+  it('stops at "Receive crypto" on desktop, where there are two ways through', () => {
+    expect(getCryptoDepositEntry(true)).toBe(DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO);
+  });
+
+  // Connect wallet is desktop-only, so that screen is a single row on a phone.
+  it('skips straight to the token list on a phone', () => {
+    expect(getCryptoDepositEntry(false)).toBe(DEPOSIT_MODAL.OPEN_DEPOSIT_TOKEN);
+  });
+});
+
+describe('getDepositTokenBackTarget', () => {
+  // Opened from the address screen's currency pill: back belongs there, not at
+  // the start of the flow.
+  it('returns to the address when that is where it was opened from', () => {
+    expect(getDepositTokenBackTarget(true, true)).toBe(DEPOSIT_MODAL.OPEN_PUBLIC_ADDRESS);
+    expect(getDepositTokenBackTarget(true, false)).toBe(DEPOSIT_MODAL.OPEN_PUBLIC_ADDRESS);
+  });
+
+  it('returns to "Receive crypto" on the way in, on desktop', () => {
+    expect(getDepositTokenBackTarget(false, true)).toBe(DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO);
+  });
+
+  // A phone never sees "Receive crypto", so sending it back there would land the
+  // user on a screen that is not in their flow.
+  it('returns to the chooser on the way in, on a phone', () => {
+    expect(getDepositTokenBackTarget(false, false)).toBe(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+  });
+
+  // Back from the address lands on the token list with the address as the
+  // previous step; back again must leave, not bounce forward to the address.
+  it('leaves the flow after stepping back from the address', () => {
+    expect(getDepositTokenBackTarget(false, false)).toBe(DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE);
+    expect(getDepositTokenBackTarget(false, true)).toBe(DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO);
+  });
+});
diff --git a/lib/api.ts b/lib/api.ts
index 32ac32579..cd5c17add 100644
--- a/lib/api.ts
+++ b/lib/api.ts
@@ -71,6 +71,7 @@ import {
   CoinHistoricalChart,
   CustomerFromBridgeResponse,
   Deposit,
+  DepositAssetsResponse,
   DepositTransaction,
   DetectedDirectDepositResponse,
   DiditSessionResponse,
@@ -2172,27 +2173,31 @@ export const createMercuryoTransaction = async (
 };
 
 /**
- * Credentials the Onramper SDK is bootstrapped with. Minted by our backend, never
- * derived on the client — the partner secret that signs them must stay server-side.
- * Structurally matches the SDK's `SessionCredentials`; kept local so this module
- * has no dependency on the iOS-only Onramper package.
+ * A signed Onramper widget URL.
+ *
+ * Minted per open, never cached: Onramper caps the signature at 15 minutes and
+ * treats each URL as single-use, so a stored one fails at checkout rather than
+ * at load — the worst place to find out.
  */
-export interface OnramperSession {
-  sessionId: string;
-  sessionToken: string;
+export interface OnramperWidgetSession {
+  url: string;
+  /** ISO timestamp. Past this, the URL must be re-minted. */
+  expiresAt: string;
 }
 
 /**
- * Mints a fresh Onramper session for the signed-in user. Used both for the initial
- * `initialize()` bootstrap and as the SDK's `onSessionExpired` handler, so it must
- * stay cheap and idempotent. Wrap calls in `withRefreshToken` so an expired Solid
- * JWT is refreshed and retried rather than surfacing as a checkout failure.
+ * Mints a signed widget URL for the signed-in user.
+ *
+ * The destination address is not sent — the backend reads it from the
+ * authenticated user, so nothing the client says can redirect the delivery.
  */
-export const fetchOnramperSession = async (): Promise<OnramperSession> => {
+export const fetchOnramperWidgetSession = async (
+  platform: 'web' | 'native',
+): Promise<OnramperWidgetSession> => {
   const jwt = getJWTToken();
 
   const response = await fetch(
-    `${EXPO_PUBLIC_FLASH_API_BASE_URL}/accounts/v1/onramper/create-session`,
+    `${EXPO_PUBLIC_FLASH_API_BASE_URL}/accounts/v1/onramper/widget-session`,
     {
       method: 'POST',
       headers: {
@@ -2201,14 +2206,13 @@ export const fetchOnramperSession = async (): Promise<OnramperSession> => {
         ...(jwt ? { Authorization: `Bearer ${jwt}` } : {}),
       },
       credentials: 'include',
+      body: JSON.stringify({ platform }),
     },
   );
 
   if (!response.ok) throw response;
 
-  const data = await response.json();
-
-  return data;
+  return response.json();
 };
 
 export const bridgeDeposit = async (
@@ -3932,6 +3936,26 @@ export const addToAddressBook = async (data: AddressBookRequest): Promise<Addres
   return response.json();
 };
 
+/**
+ * Every (chain, token) a deposit may be sent in, with the minimum worth sending.
+ *
+ * Unauthenticated, like the other config endpoints — the answer is the same for
+ * everyone. Callers must cope with it failing: the deposit screens fall back to
+ * their committed table rather than showing no minimum at all.
+ */
+export const getDepositAssets = async (): Promise<DepositAssetsResponse> => {
+  const response = await fetch(`${EXPO_PUBLIC_FLASH_API_BASE_URL}/accounts/v1/deposit/assets`, {
+    credentials: 'include',
+    headers: {
+      ...getPlatformHeaders(),
+    },
+  });
+
+  if (!response.ok) throw response;
+
+  return response.json();
+};
+
 export const getCardDepositBonusConfig = async (): Promise<CardDepositBonusConfig> => {
   const response = await fetch(
     `${EXPO_PUBLIC_FLASH_API_BASE_URL}/accounts/v1/app-config/card-deposit-bonus`,
diff --git a/lib/assets.ts b/lib/assets.ts
index 954cd43b8..21db25fcd 100644
--- a/lib/assets.ts
+++ b/lib/assets.ts
@@ -373,7 +373,11 @@ export const ASSETS = {
   },
   'images/earn-eth-icon.png': {
     module: require('@/assets/images/earn-eth-icon.png'),
-    hash: 'a1c4c4b5',
+    hash: 'be536400',
+  },
+  'images/earn-eth-tile-background.png': {
+    module: require('@/assets/images/earn-eth-tile-background.png'),
+    hash: 'f3c96725',
   },
   'images/earn-fuse-card-background.png': {
     module: require('@/assets/images/earn-fuse-card-background.png'),
@@ -381,7 +385,11 @@ export const ASSETS = {
   },
   'images/earn-fuse-icon.png': {
     module: require('@/assets/images/earn-fuse-icon.png'),
-    hash: 'c9a5744a',
+    hash: '3d4bd355',
+  },
+  'images/earn-fuse-tile-background.png': {
+    module: require('@/assets/images/earn-fuse-tile-background.png'),
+    hash: '8694f432',
   },
   'images/earn-green.png': { module: require('@/assets/images/earn-green.png'), hash: 'a1f2db4d' },
   'images/earn-indigo.png': {
@@ -399,7 +407,11 @@ export const ASSETS = {
   },
   'images/earn-usd-icon.png': {
     module: require('@/assets/images/earn-usd-icon.png'),
-    hash: '76cc5b17',
+    hash: 'adb82bcf',
+  },
+  'images/earn-usd-tile-background.png': {
+    module: require('@/assets/images/earn-usd-tile-background.png'),
+    hash: '28580f20',
   },
   'images/earn.png': { module: require('@/assets/images/earn.png'), hash: 'c1d01a5d' },
   'images/email.png': { module: require('@/assets/images/email.png'), hash: '7154e7ce' },
diff --git a/lib/buyCryptoFlow.ts b/lib/buyCryptoFlow.ts
index 86560d6da..29654c50a 100644
--- a/lib/buyCryptoFlow.ts
+++ b/lib/buyCryptoFlow.ts
@@ -30,6 +30,8 @@ export const getBuyCryptoTitle = (modal: DepositModal) => {
       return 'Order status';
     case DEPOSIT_MODAL.OPEN_BUY_CRYPTO_PROFILE.name:
       return 'Complete your details';
+    case DEPOSIT_MODAL.OPEN_ONRAMPER_WIDGET.name:
+      return 'Buy crypto';
     default:
       return undefined;
   }
@@ -40,6 +42,9 @@ export const getBuyCryptoBackTarget = (modal: DepositModal): BuyCryptoBackTarget
     case DEPOSIT_MODAL.OPEN_BUY_CRYPTO_KYC_CONSENT.name:
     case DEPOSIT_MODAL.OPEN_BUY_CRYPTO_KYC_PENDING.name:
     case DEPOSIT_MODAL.OPEN_BUY_CRYPTO_AMOUNT.name:
+    // Onramper's widget is a single screen: everything inside it is the
+    // provider's own, so the only way back is out to the funding options.
+    case DEPOSIT_MODAL.OPEN_ONRAMPER_WIDGET.name:
       return 'entry';
     case DEPOSIT_MODAL.OPEN_BUY_CRYPTO_CURRENCY.name:
     case DEPOSIT_MODAL.OPEN_BUY_CRYPTO_PAYMENT_METHOD.name:
diff --git a/lib/config.ts b/lib/config.ts
index addb0cc8e..469174aa4 100644
--- a/lib/config.ts
+++ b/lib/config.ts
@@ -32,8 +32,6 @@ export const EXPO_PUBLIC_CARD_SPEND_V2 = process.env.EXPO_PUBLIC_CARD_SPEND_V2 =
 // Onramper buy-crypto (iOS only — the SDK has no Android/web implementation).
 // `apiKey` is Onramper's publishable partner key: EXPO_PUBLIC_* values are inlined
 // into the JS bundle, so only ever put a publishable key here, never a secret.
-export const EXPO_PUBLIC_ONRAMPER_API_KEY = process.env.EXPO_PUBLIC_ONRAMPER_API_KEY ?? '';
-export const EXPO_PUBLIC_ONRAMPER_CLIENT_ID = process.env.EXPO_PUBLIC_ONRAMPER_CLIENT_ID ?? '';
 export const EXPO_PUBLIC_THIRDWEB_CLIENT_ID = process.env.EXPO_PUBLIC_THIRDWEB_CLIENT_ID ?? '';
 export const EXPO_PUBLIC_TURNKEY_API_BASE_URL = process.env.EXPO_PUBLIC_TURNKEY_API_BASE_URL ?? '';
 export const EXPO_PUBLIC_TURNKEY_ORGANIZATION_ID =
diff --git a/lib/onramper.ios.ts b/lib/onramper.ios.ts
deleted file mode 100644
index 760ba4e73..000000000
--- a/lib/onramper.ios.ts
+++ /dev/null
@@ -1,101 +0,0 @@
-import { OnramperClient } from '@onramper/onramper-react-native';
-
-import { fetchOnramperSession, type OnramperSession } from '@/lib/api';
-import {
-  EXPO_PUBLIC_ONRAMPER_API_KEY,
-  EXPO_PUBLIC_ONRAMPER_CLIENT_ID,
-  isProduction,
-} from '@/lib/config';
-import { withRefreshToken } from '@/lib/utils';
-
-// Real implementation, loaded by Metro only on iOS. Android and web get
-// lib/onramper.ts, which declares the SDK unavailable. See that file for why.
-
-export const isOnramperSupported: boolean = true;
-
-// One client per app session. OnramperClient creates its own native Nitro hybrid
-// object in its constructor and releases it in destroy(), so constructing one per
-// screen or per render would leak native SDK clients.
-let client: OnramperClient | null = null;
-
-// Single-flight guard: concurrent callers (e.g. two screens mounting at once)
-// share one bootstrap instead of racing two initialize() calls.
-let initialization: Promise<OnramperClient> | null = null;
-
-/**
- * Mints a session via our backend. Used for the initial bootstrap and reused as the
- * SDK's `onSessionExpired` handler — the SDK refreshes proactively and on 401, so
- * this normally only fires when the refresh token itself was revoked or rotated.
- */
-const mintSession = (): Promise<OnramperSession> =>
-  withRefreshToken(() => fetchOnramperSession());
-
-/**
- * The initialized client, or `null` if `initOnramper()` hasn't completed yet.
- * Prefer `useOnramperClient()` in components; this is for non-React callers.
- */
-export function getOnramperClient(): OnramperClient {
-  if (!client) {
-    throw new Error('Onramper has not been initialized yet — call initOnramper() first.');
-  }
-  return client;
-}
-
-/**
- * Constructs and bootstraps the client. Idempotent: repeat calls return the same
- * instance, and a failed attempt is discarded so a later call can retry.
- */
-export function initOnramper(): Promise<OnramperClient> {
-  if (initialization) return initialization;
-
-  initialization = (async () => {
-    if (!EXPO_PUBLIC_ONRAMPER_API_KEY || !EXPO_PUBLIC_ONRAMPER_CLIENT_ID) {
-      throw new Error(
-        'Missing EXPO_PUBLIC_ONRAMPER_API_KEY or EXPO_PUBLIC_ONRAMPER_CLIENT_ID.',
-      );
-    }
-
-    // Mint the session before constructing, so a backend failure doesn't leave an
-    // orphaned native client behind.
-    const session = await mintSession();
-
-    const instance = new OnramperClient({
-      apiKey: EXPO_PUBLIC_ONRAMPER_API_KEY,
-      clientId: EXPO_PUBLIC_ONRAMPER_CLIENT_ID,
-      environment: isProduction ? 'production' : 'development',
-      theme: 'system',
-      logLevel: isProduction ? 'off' : 'error',
-      onSessionExpired: mintSession,
-    });
-
-    try {
-      await instance.initialize(session);
-    } catch (error) {
-      // configure() or initialize() failed — release the native object rather than
-      // stranding it, then let the caller surface the error.
-      instance.destroy();
-      throw error;
-    }
-
-    client = instance;
-    return instance;
-  })();
-
-  // Drop the memo on failure so the next caller retries instead of replaying the
-  // rejection forever (e.g. the user lost connectivity on first attempt).
-  initialization.catch(() => {
-    initialization = null;
-  });
-
-  return initialization;
-}
-
-/**
- * Releases the native client and resets module state. Call on logout — the session
- * is scoped to the signed-in user, so it must not survive into the next account.
- */
-export function destroyOnramper(): void {
-  client?.destroy();
-  client = null;
-  initialization = null;
-}
diff --git a/lib/onramper.ts b/lib/onramper.ts
deleted file mode 100644
index 6015a75c8..000000000
--- a/lib/onramper.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-import { Platform } from 'react-native';
-import { OnramperClient } from '@onramper/onramper-react-native';
-
-import { fetchOnramperSession } from './api';
-import { EXPO_PUBLIC_ONRAMPER_API_KEY, EXPO_PUBLIC_ONRAMPER_CLIENT_ID } from './config';
-
-// Platform-specific resolution target for TypeScript, and the runtime fallback for
-// every platform except iOS. Metro loads lib/onramper.ios.ts on iOS and this file
-// on Android and web.
-//
-// @onramper/onramper-react-native wraps Onramper's *iOS* SDK: it ships no android/
-// implementation, and metro.config.js stubs it out of the web bundle entirely
-// (importing it there would pull in react-native internals that don't exist under
-// react-native-web). Constructing OnramperClient off-iOS throws from the SDK
-// itself, so this file keeps that failure declarative instead of a native crash.
-//
-// The `import type` above is erased at compile time, so this file never requires
-// the package at runtime.
-
-// Typed as `boolean` rather than the literal `false` on purpose: consumers see only
-// this file's types, and a literal would let TypeScript narrow the iOS code path
-// away as unreachable.
-export const isOnramperSupported: boolean = false;
-
-const unsupported = () => new Error(`Onramper is only supported on iOS, not ${Platform.OS}.`);
-
-export function getOnramperClient(): OnramperClient {
-  throw unsupported();
-}
-
-export async function initOnramper(): Promise<OnramperClient> {
-  const client = new OnramperClient({
-    apiKey: EXPO_PUBLIC_ONRAMPER_API_KEY,
-    clientId: EXPO_PUBLIC_ONRAMPER_CLIENT_ID,
-    environment: 'development',
-    theme: 'system',
-    logLevel: 'off',
-
-    onSessionExpired: () => {
-      return fetchOnramperSession();
-    },
-  });
-
-  const { sessionId, sessionToken } = await fetchOnramperSession();
-
-  await client.initialize({ sessionId, sessionToken });
-
-  return client;
-}
-
-export function destroyOnramper(): void {
-  // Nothing is ever constructed off-iOS, so there is nothing to tear down.
-}
diff --git a/lib/types.ts b/lib/types.ts
index 6bc26eada..ac12a9337 100644
--- a/lib/types.ts
+++ b/lib/types.ts
@@ -83,6 +83,31 @@ export interface DetectedDirectDepositResponse {
   detectedAt?: string;
 }
 
+/** One (chain, token) the deposit pipeline credits, as `/deposit/assets` gives it. */
+export interface DepositAsset {
+  chainId: number;
+  chainName: string;
+  symbol: string;
+  name?: string;
+  /**
+   * The contract the pipeline credits on this chain. Detection matches on the
+   * address, not the ticker, and some chains carry more than one contract
+   * calling itself USDC.
+   */
+  address: string;
+  decimals: number;
+  /** Smallest deposit worth sending, in whole token units ("10", "0.004"). */
+  minimum: string;
+}
+
+export interface DepositAssetsResponse {
+  /** The dollar figure every asset's `minimum` is derived from. */
+  minimumUsd: number;
+  assets: DepositAsset[];
+  /** False when a minimum is a conservative fallback, not a live conversion. */
+  pricesResolved: boolean;
+}
+
 export interface CardDepositBonusConfig {
   isEnabled: boolean;
   percentage: number;
diff --git a/lib/utils/__tests__/depositFee.test.ts b/lib/utils/__tests__/depositFee.test.ts
new file mode 100644
index 000000000..251662199
--- /dev/null
+++ b/lib/utils/__tests__/depositFee.test.ts
@@ -0,0 +1,122 @@
+import { arbitrum, base, bsc, fuse, mainnet, polygon } from 'viem/chains';
+
+import { CardProvider } from '@/lib/types';
+import { DEPOSIT_FEE_BPS, formatDepositFeePercent, getDepositFeeBps } from '@/lib/utils/depositFee';
+
+/** Every chain the deposit screens offer. */
+const CHAIN_IDS = [mainnet.id, polygon.id, base.id, arbitrum.id, bsc.id, fuse.id];
+
+const STABLECOINS = ['USDC', 'USDT'];
+/** What the wallet flow sends straight to the Safe, with no pipeline in between. */
+const NON_STABLECOINS = ['ETH', 'WETH', 'FUSE', 'WFUSE'];
+
+/** The chains a rule is free on, and the fee it charges on every other one. */
+const expectFreeOnlyOn = (freeChainIds: number[], feeFor: (chainId: number) => number) => {
+  for (const chainId of CHAIN_IDS) {
+    expect({ chainId, bps: feeFor(chainId) }).toEqual({
+      chainId,
+      bps: freeChainIds.includes(chainId) ? 0 : DEPOSIT_FEE_BPS,
+    });
+  }
+};
+
+// No card, and the deprecated Bridge card the app treats as no card.
+const NO_CARD: [string, CardProvider | null | undefined][] = [
+  ['no card', null],
+  ['an unresolved issuer', undefined],
+  ['a Bridge card', CardProvider.BRIDGE],
+];
+
+describe('getDepositFeeBps', () => {
+  describe('"Fund your card"', () => {
+    it.each(STABLECOINS)('charges a Rain card %s deposit everywhere but Base', symbol => {
+      expectFreeOnlyOn([base.id], chainId =>
+        getDepositFeeBps({ provider: CardProvider.RAIN, product: 'card', chainId, symbol }),
+      );
+    });
+
+    it.each(STABLECOINS)('charges a Wirex card %s deposit everywhere but Fuse', symbol => {
+      expectFreeOnlyOn([fuse.id], chainId =>
+        getDepositFeeBps({ provider: CardProvider.WIREX, product: 'card', chainId, symbol }),
+      );
+    });
+  });
+
+  describe('wallet deposit', () => {
+    it.each(STABLECOINS)('charges a Wirex cardholder %s everywhere but Fuse', symbol => {
+      expectFreeOnlyOn([fuse.id], chainId =>
+        getDepositFeeBps({ provider: CardProvider.WIREX, product: 'wallet', chainId, symbol }),
+      );
+    });
+
+    it.each(NON_STABLECOINS)('never charges a Wirex cardholder %s', symbol => {
+      expectFreeOnlyOn(CHAIN_IDS, chainId =>
+        getDepositFeeBps({ provider: CardProvider.WIREX, product: 'wallet', chainId, symbol }),
+      );
+    });
+
+    it('never charges a Wirex cardholder when the currency is not known', () => {
+      expectFreeOnlyOn(CHAIN_IDS, chainId =>
+        getDepositFeeBps({ provider: CardProvider.WIREX, product: 'wallet', chainId }),
+      );
+    });
+
+    it.each(NO_CARD)('never charges someone with %s', (_label, provider) => {
+      for (const symbol of [...STABLECOINS, ...NON_STABLECOINS]) {
+        expectFreeOnlyOn(CHAIN_IDS, chainId =>
+          getDepositFeeBps({ provider, product: 'wallet', chainId, symbol }),
+        );
+      }
+    });
+  });
+
+  describe('savings deposit', () => {
+    it('never charges a Wirex cardholder, on any chain or vault', () => {
+      for (const vaultToken of ['soUSD', 'soETH', 'soFUSE']) {
+        expectFreeOnlyOn(CHAIN_IDS, chainId =>
+          getDepositFeeBps({
+            provider: CardProvider.WIREX,
+            product: 'savings',
+            chainId,
+            vaultToken,
+          }),
+        );
+      }
+    });
+
+    describe.each([...NO_CARD, ['a Rain card', CardProvider.RAIN]] as const)(
+      'with %s',
+      (_label, provider) => {
+        it.each([
+          ['soUSD', mainnet.id],
+          ['soETH', mainnet.id],
+          ['soFUSE', fuse.id],
+        ])('charges %s deposits everywhere but its vault chain', (vaultToken, vaultChainId) => {
+          expectFreeOnlyOn([vaultChainId], chainId =>
+            getDepositFeeBps({ provider, product: 'savings', chainId, vaultToken }),
+          );
+        });
+
+        it('quotes no fee for a vault it cannot place', () => {
+          expectFreeOnlyOn(CHAIN_IDS, chainId =>
+            getDepositFeeBps({ provider, product: 'savings', chainId, vaultToken: 'soBTC' }),
+          );
+          expectFreeOnlyOn(CHAIN_IDS, chainId =>
+            getDepositFeeBps({ provider, product: 'savings', chainId }),
+          );
+        });
+      },
+    );
+  });
+});
+
+describe('formatDepositFeePercent', () => {
+  it('quotes the fee as the notice shows it', () => {
+    expect(formatDepositFeePercent(DEPOSIT_FEE_BPS)).toBe('0.03%');
+  });
+
+  it('keeps other rates exact', () => {
+    expect(formatDepositFeePercent(10)).toBe('0.1%');
+    expect(formatDepositFeePercent(50)).toBe('0.5%');
+  });
+});
diff --git a/lib/utils/__tests__/savingsDepositRoute.test.ts b/lib/utils/__tests__/savingsDepositRoute.test.ts
new file mode 100644
index 000000000..f48ae6f0c
--- /dev/null
+++ b/lib/utils/__tests__/savingsDepositRoute.test.ts
@@ -0,0 +1,29 @@
+import { CardProvider } from '@/lib/types';
+import { usesDirectSavingsDeposit } from '@/lib/utils/cardHelpers';
+
+/**
+ * Which flow the savings Deposit button opens. Not a styling choice: one brings
+ * new money in from outside, the other moves a balance already in Solid, so this
+ * decides what the button can do.
+ */
+describe('usesDirectSavingsDeposit', () => {
+  // Rain's wallet, card and savings are three separate pots, so the savings
+  // button is the only way new money reaches the vault directly.
+  it('gives Rain cardholders the direct-deposit flow', () => {
+    expect(usesDirectSavingsDeposit(CardProvider.RAIN)).toBe(true);
+  });
+
+  // A Wirex cardholder funds savings by funding their wallet, which the wallet
+  // deposit flow already covers — leaving the savings button to move what is
+  // already here.
+  it('gives Wirex cardholders the amount form', () => {
+    expect(usesDirectSavingsDeposit(CardProvider.WIREX)).toBe(false);
+  });
+
+  // A user with no card, and one whose issuer has not resolved yet, fall on the
+  // same side as Rain — the default canDepositToCard takes.
+  it('treats no card and an unresolved issuer as not Wirex', () => {
+    expect(usesDirectSavingsDeposit(null)).toBe(true);
+    expect(usesDirectSavingsDeposit(undefined)).toBe(true);
+  });
+});
diff --git a/lib/utils/cardHelpers.ts b/lib/utils/cardHelpers.ts
index 0a7a4f329..7fdbe0e68 100644
--- a/lib/utils/cardHelpers.ts
+++ b/lib/utils/cardHelpers.ts
@@ -138,6 +138,29 @@ export const canWithdrawFromCard = ({ isCustomerRestricted, provider }: CardFund
 export const canDepositToCard = (provider: CardProvider | null | undefined): boolean =>
   provider !== CardProvider.WIREX;
 
+/**
+ * Whether the savings Deposit button opens the direct-deposit flow — currency,
+ * then chain, then an address to send to — rather than the amount form that
+ * moves a balance already held in Solid.
+ *
+ * Everyone but Wirex. The two are not one screen in two styles: one brings new
+ * money in from outside, the other moves money that is already here, so this
+ * decides what the button can do and not only how it looks.
+ *
+ * A Wirex cardholder funds savings by funding their wallet — settlement draws on
+ * the Safe, so the wallet deposit flow already covers them — which leaves the
+ * savings button for the one thing that flow does not do: moving an existing
+ * balance across. A Rain cardholder's wallet and card are separate pots, and
+ * neither is savings, so their savings button is the only way new money reaches
+ * the vault directly.
+ *
+ * `null`/`undefined` means the issuer has not resolved yet, and reads as not
+ * Wirex — the same default {@link canDepositToCard} takes, and the same one a
+ * user with no card falls under.
+ */
+export const usesDirectSavingsDeposit = (provider: CardProvider | null | undefined): boolean =>
+  provider !== CardProvider.WIREX;
+
 /**
  * Whether the card carries a balance of its own, i.e. one that belongs in a total
  * of what the user holds.
diff --git a/lib/utils/depositFee.ts b/lib/utils/depositFee.ts
new file mode 100644
index 000000000..2e9b1f89d
--- /dev/null
+++ b/lib/utils/depositFee.ts
@@ -0,0 +1,100 @@
+import { base, fuse, mainnet } from 'viem/chains';
+
+import { isStablecoinSymbol } from '@/constants/stablecoins';
+import { CardProvider } from '@/lib/types';
+
+/**
+ * Which crypto deposits pay Solid's deposit fee.
+ *
+ * A deposit pays `DEPOSIT_FEE_BPS` when it is sent from a chain other than the
+ * one its destination lives on. Where that is depends on the flow that handed
+ * out the address, and on who it was handed to:
+ *
+ * | Flow           | Who             | Charged on                                        |
+ * | -------------- | --------------- | ------------------------------------------------- |
+ * | Fund your card | Rain            | Every chain but Base, where the card is funded    |
+ * | Wallet         | Wirex           | Stablecoins, on every chain but Fuse, where the   |
+ * |                |                 | Safe the card spends from lives                   |
+ * | Wallet         | No card         | Nothing                                           |
+ * | Savings        | Rain or no card | Every chain but the vault's: Ethereum for soUSD   |
+ * |                |                 | and soETH, Fuse for soFUSE                        |
+ * | Savings        | Wirex           | Nothing, for Phase 1                              |
+ *
+ * The client collects nothing here. This only decides whether a deposit address
+ * screen warns that the deposit will be charged, so a rule that changes belongs
+ * in this file rather than in the screens.
+ *
+ * A leaf module, like `cardFunding`, so it can be tested under jest-expo without
+ * pulling in `lib/assets`.
+ */
+
+/** The fee on a deposit that is charged: 3 bps, i.e. 0.03%. */
+export const DEPOSIT_FEE_BPS = 3;
+
+/**
+ * The flow a deposit address was handed out by: "Fund your card", the wallet
+ * deposit screen, or a savings vault's direct deposit.
+ */
+export type DepositFeeProduct = 'card' | 'wallet' | 'savings';
+
+/** The chain each vault lives on, keyed by the share token it mints. */
+const VAULT_CHAIN_IDS: Record<string, number> = {
+  soUSD: mainnet.id,
+  soETH: mainnet.id,
+  soFUSE: fuse.id,
+};
+
+/**
+ * The fee in basis points on this deposit, or 0 when it is free.
+ *
+ * Only a Wirex card changes the rules. No card, a Rain card and the deprecated
+ * Bridge card (which `useCardProvider` already reports as no card) all follow
+ * the Rain rows.
+ */
+export function getDepositFeeBps({
+  provider,
+  product,
+  chainId,
+  symbol,
+  vaultToken,
+}: {
+  /** The user's card issuer, or null when they have no card. */
+  provider: CardProvider | null | undefined;
+  product: DepositFeeProduct;
+  /** Chain the deposit is sent on. */
+  chainId: number;
+  /** Currency being sent. Only a Wirex cardholder's fee depends on it. */
+  symbol?: string;
+  /** Share token a savings deposit mints (soUSD, soETH, soFUSE). Unused otherwise. */
+  vaultToken?: string;
+}): number {
+  const isWirex = provider === CardProvider.WIREX;
+
+  if (product === 'savings') {
+    if (isWirex) return 0;
+
+    // A vault this table does not place gets no notice rather than a guess:
+    // telling someone a free deposit will be charged is worse than leaving the
+    // line off.
+    const vaultChainId = vaultToken ? VAULT_CHAIN_IDS[vaultToken] : undefined;
+    if (vaultChainId === undefined) return 0;
+
+    return chainId === vaultChainId ? 0 : DEPOSIT_FEE_BPS;
+  }
+
+  // A Wirex card holds no balance of its own, so funding it is funding the Safe
+  // on Fuse, whichever flow the address came from. Only stablecoins are routed
+  // there by the deposit pipeline; ETH and FUSE are sent straight to the Safe.
+  if (isWirex) {
+    return isStablecoinSymbol(symbol) && chainId !== fuse.id ? DEPOSIT_FEE_BPS : 0;
+  }
+
+  if (product === 'card') return chainId === base.id ? 0 : DEPOSIT_FEE_BPS;
+
+  // The wallet flow charges cardholders only. Rain cardholders are sent to "Fund
+  // your card" instead, so whoever is left here has no card.
+  return 0;
+}
+
+/** Basis points as the percentage the notice quotes: 3 → "0.03%". */
+export const formatDepositFeePercent = (bps: number): string => `${bps / 100}%`;
diff --git a/lib/walletDepositFlow.ts b/lib/walletDepositFlow.ts
new file mode 100644
index 000000000..5272e9b3e
--- /dev/null
+++ b/lib/walletDepositFlow.ts
@@ -0,0 +1,35 @@
+import { DEPOSIT_MODAL } from '@/constants/modals';
+
+import type { DepositModal } from '@/lib/types';
+
+/**
+ * Where "Crypto" leads from the "Deposit with" chooser.
+ *
+ * "Receive crypto" offers the deposit address and, on desktop only, connect
+ * wallet — thirdweb's connect modal being desktop-only. With one option there is
+ * nothing to choose, so a phone skips it and lands on the token list rather than
+ * being asked to confirm the only way through.
+ */
+export const getCryptoDepositEntry = (isDesktop: boolean): DepositModal =>
+  isDesktop ? DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO : DEPOSIT_MODAL.OPEN_DEPOSIT_TOKEN;
+
+/**
+ * Where back goes from "Select token", which is reached from two directions: on
+ * the way in to the address, and again from the address screen's currency pill.
+ *
+ * Which one opened it is recorded by the pill (`isChangingToken`) rather than
+ * read from the previous step: stepping back from the address also lands here
+ * with the address as the previous step, and treating that as the pill would
+ * send back straight forward to the address again. On the way in, a phone never
+ * sees "Receive crypto", so it returns to the chooser instead.
+ */
+export const getDepositTokenBackTarget = (
+  isChangingToken: boolean,
+  isDesktop: boolean,
+): DepositModal => {
+  if (isChangingToken) {
+    return DEPOSIT_MODAL.OPEN_PUBLIC_ADDRESS;
+  }
+
+  return isDesktop ? DEPOSIT_MODAL.OPEN_DEPOSIT_CRYPTO : DEPOSIT_MODAL.OPEN_DEPOSIT_TYPE;
+};
diff --git a/metro.config.js b/metro.config.js
index d2510a69e..5fba85de4 100644
--- a/metro.config.js
+++ b/metro.config.js
@@ -24,18 +24,6 @@ config.resolver = {
     events: 'events',
   },
   resolveRequest: (context, moduleName, platform) => {
-    // @onramper/onramper-react-native is an iOS-only Nitro module. Its
-    // OnramperCheckoutButtonView calls getHostComponent() at import time, which
-    // deep-imports react-native/Libraries/NativeComponent/NativeComponentRegistry
-    // — RN internals that don't exist in a react-native-web bundle. Stub it on
-    // web so merely importing it can't break the web build.
-    // Android is left alone on purpose: the import is lazy there (RN registers
-    // the view config without resolving it), and the package throws its own
-    // clear "iOS-only in this release" error if you actually call it.
-    if (platform === 'web' && moduleName.startsWith('@onramper/onramper-react-native')) {
-      return { type: 'empty' };
-    }
-
     // Block browser-specific modules when building for native platforms
     if (
       platform !== 'web' &&
diff --git a/package-lock.json b/package-lock.json
index 4e5bfac7b..04de2b298 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -28,7 +28,6 @@
         "@meawallet/react-native-mpp": "file:./stubs/meawallet-mpp",
         "@merkl/api": "file:./packages/merkl-api-1.4.15-patched.tgz",
         "@number-flow/react": "^0.5.14",
-        "@onramper/onramper-react-native": "^1.1.1",
         "@radix-ui/react-accordion": "^1.2.12",
         "@radix-ui/react-dialog": "^1.1.15",
         "@radix-ui/react-dropdown-menu": "^2.1.16",
@@ -9099,17 +9098,6 @@
         "react-dom": "^18 || ^19"
       }
     },
-    "node_modules/@onramper/onramper-react-native": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@onramper/onramper-react-native/-/onramper-react-native-1.1.1.tgz",
-      "integrity": "sha512-XqfWbRCu7B9AqNBShE1QFxVRINl4D0paZE+mtX27OndRXxGLKMHWaS6lIikHmVzWRKzcJjptHbhGouLtsu2/1w==",
-      "license": "Apache-2.0",
-      "peerDependencies": {
-        "react": ">=19.0.0",
-        "react-native": ">=0.79.0",
-        "react-native-nitro-modules": ">=0.35.0"
-      }
-    },
     "node_modules/@openzeppelin/contracts": {
       "version": "5.6.1",
       "resolved": "https://registry.npmjs.org/@openzeppelin/contracts/-/contracts-5.6.1.tgz",
diff --git a/package.json b/package.json
index 1a3e3596b..51bed86cf 100644
--- a/package.json
+++ b/package.json
@@ -52,7 +52,6 @@
     "@meawallet/react-native-mpp": "file:./stubs/meawallet-mpp",
     "@merkl/api": "file:./packages/merkl-api-1.4.15-patched.tgz",
     "@number-flow/react": "^0.5.14",
-    "@onramper/onramper-react-native": "^1.1.1",
     "@radix-ui/react-accordion": "^1.2.12",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
diff --git a/plugins/withSwiftExplicitModulesDisabled.js b/plugins/withSwiftExplicitModulesDisabled.js
new file mode 100644
index 000000000..de76291d9
--- /dev/null
+++ b/plugins/withSwiftExplicitModulesDisabled.js
@@ -0,0 +1,53 @@
+const { withDangerousMod } = require('@expo/config-plugins');
+const fs = require('fs');
+const path = require('path');
+
+/**
+ * Expo config plugin: set `SWIFT_ENABLE_EXPLICIT_MODULES=NO` for all Pods and
+ * app targets.
+ *
+ * On Xcode 16+/26, CocoaPods plus Swift pods — NitroModules (pulled in by
+ * react-native-nitro-modules and react-native-mmkv) and RN's own RCTSwiftUI —
+ * fail the app target's "Emit Swift module" phase with
+ * "module map file ... not found". Disabling explicit Swift modules avoids it.
+ *
+ * This arrived as @onramper/onramper-react-native's own app.plugin.js and was
+ * kept when that package was removed: the fix was never Onramper-specific, and
+ * the pods that still need it are still here.
+ *
+ * ios/ is prebuild-generated (gitignored), so this re-applies on every
+ * `expo prebuild`. Idempotent via the marker.
+ */
+const MARKER = 'disable explicit Swift modules (withSwiftExplicitModulesDisabled)';
+
+const SNIPPET = [
+  `    # ${MARKER}`,
+  '    installer.pods_project.targets.each do |t|',
+  "      t.build_configurations.each { |c| c.build_settings['SWIFT_ENABLE_EXPLICIT_MODULES'] = 'NO' }",
+  '    end',
+  '    installer.aggregate_targets.each do |at|',
+  '      next if at.user_project.nil?',
+  '      at.user_project.native_targets.each do |t|',
+  "        t.build_configurations.each { |c| c.build_settings['SWIFT_ENABLE_EXPLICIT_MODULES'] = 'NO' }",
+  '      end',
+  '      at.user_project.save',
+  '    end',
+].join('\n');
+
+module.exports = function withSwiftExplicitModulesDisabled(config) {
+  return withDangerousMod(config, [
+    'ios',
+    cfg => {
+      const podfile = path.join(cfg.modRequest.platformProjectRoot, 'Podfile');
+      let contents = fs.readFileSync(podfile, 'utf8');
+
+      if (!contents.includes(MARKER)) {
+        // Top of Expo's generated `post_install do |installer|` block.
+        contents = contents.replace(/(post_install do \|installer\|\n)/, `$1${SNIPPET}\n`);
+        fs.writeFileSync(podfile, contents);
+      }
+
+      return cfg;
+    },
+  ]);
+};
diff --git a/store/useDepositStore.ts b/store/useDepositStore.ts
index ca7191dec..fe242b977 100644
--- a/store/useDepositStore.ts
+++ b/store/useDepositStore.ts
@@ -89,6 +89,18 @@ export interface ExternalWalletState {
   disconnect?: (wallet: Wallet) => void;
 }
 
+/** Chain and currency the wallet deposit address screen is showing. */
+export interface WalletDepositSelection {
+  chainId?: number;
+  symbol?: string;
+  /**
+   * Set while "Select token" is open from the address screen's currency pill,
+   * so back returns to the address. Back from the address also lands on "Select
+   * token", so the previous step alone cannot tell the two apart.
+   */
+  isChangingToken?: boolean;
+}
+
 interface DepositState {
   currentModal: DepositModal;
   previousModal: DepositModal;
@@ -107,6 +119,16 @@ interface DepositState {
    * one flow and is cleared by `resetDepositFlow`.
    */
   savingsFundIntent: SavingsFundIntent;
+  /**
+   * Chain and currency chosen for the wallet deposit address ("Show deposit
+   * address" -> "Select chain" -> the address).
+   *
+   * In the store rather than in the address screen's own state because the chain
+   * is picked on the step before it, and the deposit modal renders each step
+   * without props. Not persisted: which chain someone last looked at is not worth
+   * restoring a week later, and `resetDepositFlow` returns it to the default.
+   */
+  walletDeposit: WalletDepositSelection;
   /** Transient (not persisted) — populated only on desktop by ThirdwebConnectionBridge. */
   externalWallet: ExternalWalletState;
   setExternalWallet: (data: ExternalWalletState) => void;
@@ -118,6 +140,7 @@ interface DepositState {
   clearBankTransferData: () => void;
   setKycData: (data: Partial<KycData>) => void;
   clearKycData: () => void;
+  setWalletDeposit: (data: Partial<WalletDepositSelection>) => void;
   setSrcChainId: (srcChainId: number) => void;
   setPrincipalToken: (token: string) => void;
   setDirectDepositSession: (data: Partial<DirectDepositSession>) => void;
@@ -141,6 +164,7 @@ export const useDepositStore = create<DepositState>()(
       sessionStartTime: undefined,
       depositFromSolid: false,
       savingsFundIntent: 'savings',
+      walletDeposit: {},
       externalWallet: {
         address: undefined,
         status: 'unknown',
@@ -164,6 +188,7 @@ export const useDepositStore = create<DepositState>()(
       clearBankTransferData: () => set({ bankTransfer: {} }),
       setKycData: data => set({ kyc: { ...get().kyc, ...data } }),
       clearKycData: () => set({ kyc: {} }),
+      setWalletDeposit: data => set({ walletDeposit: { ...get().walletDeposit, ...data } }),
       setSrcChainId: srcChainId => set({ srcChainId }),
       setPrincipalToken: principalToken => set({ principalToken }),
       setDirectDepositSession: data =>
@@ -184,6 +209,7 @@ export const useDepositStore = create<DepositState>()(
           sessionStartTime: undefined,
           depositFromSolid: false,
           savingsFundIntent: 'savings',
+          walletDeposit: {},
         }),
     }),
     {